update to apollo 3.9, add embed option

package.json

@@ -78,8 +78,8 @@
     "@storybook/react": "^6.4.22",
     "@storybook/testing-library": "^0.0.11",
     "@storybook/testing-react": "^1.2.4",
-    "apollo-server": "^3.5.0",
-    "apollo-server-express": "^3.5.0",
+    "apollo-server": "3.9",
+    "apollo-server-express": "3.9",
     "cors": "^2.8.5",
     "express": "^4.17.1",
     "graphql-tools": "^8.2.0",

starters/express/package.json

@@ -31,7 +31,8 @@
     "@vulcanjs/graphql": "^0.6.9-alpha.1",
     "@vulcanjs/mongo": "^0.6.7",
     "@vulcanjs/mongo-apollo": "^0.6.9-alpha.1",
-    "apollo-server-express": "^3.6.4",
+    "apollo-server": "3.9",
+    "apollo-server-express": "3.9",
     "express": "^4.17.3",
     "mongodb-memory-server": "^8.4.0",
     "mongoose": "^6.2.5"

starters/express/src/app.ts

@@ -51,6 +51,8 @@ const startServer = async () => {
   // Define the server (using Express for easier middleware usage)
   const server = new ApolloServer({
     schema: vulcanSchema,
+    csrfPrevention: true,
+    cache: "bounded",
     context: async ({ req }) => ({
       // will generate context used by Vulcan default resolvers
       ...(await contextForModels(req as Request)),
@@ -62,7 +64,6 @@ const startServer = async () => {
       // add your own data sources here
     }),
     introspection: process.env.NODE_ENV === "development", //false,
-    //playground: false,
   });
   await server.start();
 

starters/next/package.json

@@ -120,9 +120,9 @@
     "@vulcanjs/react-ui-lite": "^0.6.9-alpha.1",
     "@vulcanjs/schema": "^0.6.7",
     "apollo-datasource-mongodb": "^0.5.2",
-    "apollo-server": "^3",
-    "apollo-server-core": "^3.7.0",
-    "apollo-server-express": "^3",
+    "apollo-server": "3.9",
+    "apollo-server-core": "3.9",
+    "apollo-server-express": "3.9",
     "babel-jest": "28",
     "babel-plugin-istanbul": "6.0.0",
     "bcrypt": "^5.0.1",

starters/next/src/core/server/cors.ts

@@ -7,9 +7,8 @@ const corsWhitelist = parseEnvVariableArray(
 );
 
 if (process.env.NODE_ENV !== "production") {
-  // NOTE: can be removed if you prefer using Apollo GraphQL (check your server config)
-  // NOTE: you can also still Apollo Studio in production, just add it explicitely to APOLLO_SERVER_CORS_WHITELIST
-  corsWhitelist.push("https://studio.apollographql.com");
+  // Uncomment if you remove the "embed" option and connect to your local API via Apollo Studio
+  //corsWhitelist.push("https://studio.apollographql.com");
 }
 
 /**

starters/next/src/pages/api/graphql.ts

@@ -108,6 +108,10 @@ const createDataSourcesForModels = createDataSources(models);
 
 const server = new ApolloServer({
   schema: executableSchema,
+  // @see https://www.apollographql.com/docs/apollo-server/security/cors#preventing-cross-site-request-forgery-csrf
+  csrfPrevention: true,
+  // @see https://github.com/apollographql/apollo-server/blob/main/CHANGELOG.md#v390
+  cache: "bounded" as const,
   context: async ({ req }) => ({
     ...(await contextFromReq(req as Request)),
     /** Add your own context here (the field names must be DIFFERENT from the model names)
@@ -127,7 +131,11 @@ const server = new ApolloServer({
     // @see https://www.apollographql.com/docs/apollo-server/api/plugin/landing-pages/
     process.env.NODE_ENV === "production"
       ? ApolloServerPluginLandingPageProductionDefault()
-      : ApolloServerPluginLandingPageLocalDefault({ includeCookies: true }),
+      : ApolloServerPluginLandingPageLocalDefault({
+          includeCookies: true,
+          // Removed the need for a complex CORS/cookies configuration, Apollo Studio runs in localhost
+          embed: true,
+        }),
   ],
   formatError: (err) => {
     // This function is mandatory to log error messages, even in development