nuxt-graphql-middleware 3.0.2 → 3.1.0-beta.0

package/dist/module.d.ts

@@ -3,10 +3,10 @@ import { H3Event } from 'h3';
 import { FetchOptions, FetchResponse, FetchError } from 'ofetch';
 import { TypeScriptDocumentsPluginConfig } from '@graphql-codegen/typescript-operations';
 
-type GraphqlMiddlewareGraphqlEndpointMethod = (event?: H3Event, operation?: string, operationName?: string) => string;
-type GraphqlMiddlewareServerFetchOptionsMethod = (event?: H3Event, operation?: string, operationName?: string) => FetchOptions;
-type GraphqlMiddlewareOnServerResponseMethod = (event: H3Event, response: FetchResponse<any>, operation?: string, operationName?: string) => any;
-type GraphqlMiddlewareOnServerErrorMethod = (event: H3Event, error: FetchError, operation?: string, operationName?: string) => any;
+type GraphqlMiddlewareGraphqlEndpointMethod = (event?: H3Event, operation?: string, operationName?: string) => string | Promise<string> | void;
+type GraphqlMiddlewareServerFetchOptionsMethod = (event?: H3Event, operation?: string, operationName?: string) => FetchOptions | Promise<FetchOptions>;
+type GraphqlMiddlewareOnServerResponseMethod = (event: H3Event, response: FetchResponse<any>, operation?: string, operationName?: string) => any | Promise<any>;
+type GraphqlMiddlewareOnServerErrorMethod = (event: H3Event, error: FetchError, operation?: string, operationName?: string) => any | Promise<any>;
 interface GraphqlMiddlewareConfig {
     /**
      * File glob patterns for the auto import feature.
@@ -67,19 +67,17 @@ interface GraphqlMiddlewareConfig {
     /**
      * The URL of the GraphQL server.
      *
-     * You can either provide a string or a method that returns a string.
-     * If you provide a method it will be called everytime a GraphQL request is
-     * made in the server API handler.
+     * For the runtime execution you can provide a method that determines the endpoint
+     * during runtime. See the app/graphqlMiddleware.serverOptions.ts documentation
+     * for more information.
+     */
+    graphqlEndpoint: string;
+    /**
+     * Download the GraphQL schema and store it on disk.
      *
-     * @example
-     * ```ts
-     * function graphqlEndpoint(event, operation, operationName) {
-     *   const language = getLanguageFromRequest(event)
-     *   return `https://api.example.com/${language}/graphql`
-     * }
-     * ```
+     * @default true
      */
-    graphqlEndpoint?: string | GraphqlMiddlewareGraphqlEndpointMethod;
+    downloadSchema?: boolean;
     /**
      * The prefix for the server route.
      *
@@ -88,6 +86,54 @@ interface GraphqlMiddlewareConfig {
      * ```
      */
     serverApiPrefix?: string;
+    /**
+     * Path to the GraphQL schema file.
+     *
+     * If `downloadSchema` is `true`, the downloaded schema is written to this specified path.
+     * If `downloadSchema` is `false`, this file must be present in order to generate types.
+     *
+     * @default './schema.graphql'
+     */
+    schemaPath?: string;
+    /**
+     * These options are passed to the graphql-codegen method when generating the operations types.
+     *
+     * {@link https://www.the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations}
+     * @default
+     * ```ts
+     * const codegenConfig = {
+     *   exportFragmentSpreadSubTypes: true,
+     *   preResolveTypes: true,
+     *   skipTypeNameForRoot: true,
+     *   skipTypename: true,
+     *   useTypeImports: true,
+     *   onlyOperationTypes: true,
+     *   namingConvention: {
+     *     enumValues: 'change-case-all#upperCaseFirst',
+     *   },
+     * }
+     * ```
+     */
+    codegenConfig?: TypeScriptDocumentsPluginConfig;
+}
+/**
+ * Configuration options during runtime.
+ */
+type GraphqlMiddlewareServerOptions = {
+    /**
+     * Custom callback to return the GraphQL endpoint per request.
+     *
+     * @default undefined
+     *
+     * @example
+     * ```ts
+     * function graphqlEndpoint(event, operation, operationName) {
+     *   const language = getLanguageFromRequest(event)
+     *   return `https://api.example.com/${language}/graphql`
+     * }
+     * ```
+     */
+    graphqlEndpoint?: GraphqlMiddlewareGraphqlEndpointMethod;
     /**
      * Provide the options for the ofetch request to the GraphQL server.
      *
@@ -107,7 +153,7 @@ interface GraphqlMiddlewareConfig {
      * }
      * ```
      */
-    serverFetchOptions?: FetchOptions | GraphqlMiddlewareServerFetchOptionsMethod;
+    serverFetchOptions?: GraphqlMiddlewareServerFetchOptionsMethod;
     /**
      * Handle the response from the GraphQL server.
      *
@@ -165,45 +211,12 @@ interface GraphqlMiddlewareConfig {
      * ```
      */
     onServerError?: GraphqlMiddlewareOnServerErrorMethod;
-    /**
-     * Download the GraphQL schema and store it in the
-     *
-     * @default true
-     */
-    downloadSchema?: boolean;
-    /**
-     * Path to the GraphQL schema file.
-     *
-     * If `downloadSchema` is `true`, the downloaded schema is written to this specified path.
-     * If `downloadSchema` is `false`, this file must be present in order to generate types.
-     *
-     * @default './schema.graphql'
-     */
-    schemaPath?: string;
-    /**
-     * These options are passed to the graphql-codegen method when generating the operations types.
-     *
-     * {@link https://www.the-guild.dev/graphql/codegen/plugins/typescript/typescript-operations}
-     * @default
-     * ```ts
-     * const codegenConfig = {
-     *   exportFragmentSpreadSubTypes: true,
-     *   preResolveTypes: true,
-     *   skipTypeNameForRoot: true,
-     *   skipTypename: true,
-     *   useTypeImports: true,
-     *   onlyOperationTypes: true,
-     *   namingConvention: {
-     *     enumValues: 'change-case-all#upperCaseFirst',
-     *   },
-     * }
-     * ```
-     */
-    codegenConfig?: TypeScriptDocumentsPluginConfig;
-}
+};
 
 type ModuleOptions = GraphqlMiddlewareConfig;
 type ModuleHooks = {};
 declare const _default: NuxtModule<GraphqlMiddlewareConfig>;
 
-export { ModuleHooks, ModuleOptions, _default as default };
+declare function defineGraphqlServerOptions(options: GraphqlMiddlewareServerOptions): GraphqlMiddlewareServerOptions;
+
+export { GraphqlMiddlewareServerOptions, ModuleHooks, ModuleOptions, _default as default, defineGraphqlServerOptions };

package/dist/module.json

@@ -1,7 +1,7 @@
 {
   "name": "nuxt-graphql-middleware",
   "configKey": "graphqlMiddleware",
-  "version": "3.0.2",
+  "version": "3.1.0-beta.0",
   "compatibility": {
     "nuxt": "^3.0.0"
   }

package/dist/module.mjs

@@ -2,7 +2,7 @@ import { fileURLToPath } from 'url';
 import { defu } from 'defu';
 import { useLogger, resolveAlias, resolveFiles, defineNuxtModule, createResolver, addImportsDir, addTemplate, addServerHandler, updateTemplates } from '@nuxt/kit';
 import inquirer from 'inquirer';
-import { promises } from 'fs';
+import { promises, existsSync } from 'node:fs';
 import fragmentImport from '@graphql-fragment-import/lib/inline-imports.js';
 import { validateGraphQlDocuments } from '@graphql-tools/utils';
 import { loadSchema } from '@graphql-tools/load';
@@ -17,7 +17,7 @@ import { oldVisit } from '@graphql-codegen/plugin-helpers';
 import { pascalCase } from 'change-case-all';
 
 const name = "nuxt-graphql-middleware";
-const version = "3.0.2";
+const version = "3.1.0-beta.0";
 
 var GraphqlMiddlewareTemplate = /* @__PURE__ */ ((GraphqlMiddlewareTemplate2) => {
   GraphqlMiddlewareTemplate2["OperationTypes"] = "graphql-operations.d.ts";
@@ -241,16 +241,109 @@ function inlineFragments(source, resolver) {
     }
   });
 }
+function validateDeprecated(options) {
+  const deprecatedKeys = [
+    "graphqlEndpoint",
+    "serverFetchOptions",
+    "onServerResponse",
+    "onServerError"
+  ];
+  deprecatedKeys.forEach((key) => {
+    if (typeof options[key] === "function") {
+      logger.error(
+        `Providing a function for "${key}" via nuxt.config.ts has been removed. Please move the configuration to ~/app/graphqlMiddleware.serverOptions.ts.`
+      );
+      if (key === "graphqlEndpoint") {
+        logger.info(`
+import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware'
+import { getHeader } from 'h3'
+import acceptLanguageParser from 'accept-language-parser';
+
+export default defineGraphqlServerOptions({
+  graphqlEndpoint(event, operation, operationName) {
+    // Get accepted languages.
+    const acceptLanguage = getHeader('accept-language')
+    const languages = acceptLanguageParser.parse(acceptLanguage);
+
+    // Use first match or fallback to English.
+    const language = languages[0]?.code || 'en'
+    return \`https://api.example.com/\${language}/graphql\`
+  }
+}`);
+      }
+      if (key === "serverFetchOptions") {
+        logger.info(`
+import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware'
+import { getHeader } from 'h3'
+
+// Pass the cookie from the client request to the GraphQL request.
+export default defineGraphqlServerOptions({
+  serverFetchOptions(event, operation, operationName) {
+    return {
+      headers: {
+        Cookie: getHeader(event, 'cookie')
+      }
+    }
+  }
+}`);
+      }
+      if (key === "onServerResponse") {
+        logger.info(`
+import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware'
+import type { H3Event } from 'h3'
+import type { FetchResponse } from 'ofetch'
+
+export default defineGraphqlServerOptions({
+  onServerResponse(event, graphqlResponse) {
+    // Set a static header.
+    event.node.res.setHeader('x-nuxt-custom-header', 'A custom header value')
+
+    // Pass the set-cookie header from the GraphQL response to the client.
+    const setCookie = graphqlResponse.headers.get('set-cookie')
+    if (setCookie) {
+      event.node.res.setHeader('set-cookie', setCookie)
+    }
+
+    // Add additional properties to the response.
+    graphqlResponse._data.__customProperty = ['My', 'values']
+
+    // Return the GraphQL response.
+    return graphqlResponse._data
+  }
+}`);
+      }
+      if (key === "onServerError") {
+        logger.info(`
+import { defineGraphqlServerOptions } from 'nuxt-graphql-middleware'
+import type { H3Event } from 'h3'
+import type { FetchError } from 'ofetch'
+
+export default defineGraphqlServerOptions({
+  onServerError( event, error, operation, operationName) {
+    event.setHeader('cache-control', 'no-cache')
+    return {
+      data: {},
+      errors: [error.message]
+    }
+  }
+})
+`);
+      }
+      throw new TypeError("Invalid configuration for graphqlMiddleware." + key);
+    }
+  });
+}
 function validateOptions(options) {
   if (!options.graphqlEndpoint) {
     throw new Error("Missing graphqlEndpoint.");
   }
+  validateDeprecated(options);
 }
 async function getSchemaPath(options, resolver, writeToDisk = false) {
   const dest = resolver(options.schemaPath);
   if (!options.downloadSchema) {
-    const fileExists = await promises.access(dest).then(() => true).catch(() => false);
-    if (!fileExists) {
+    const fileExists2 = await promises.access(dest).then(() => true).catch(() => false);
+    if (!fileExists2) {
       logger.error(
         '"downloadSchema" is set to false but no schema exists at ' + dest
       );
@@ -261,8 +354,7 @@ async function getSchemaPath(options, resolver, writeToDisk = false) {
   if (!options.graphqlEndpoint) {
     throw new Error("Missing graphqlEndpoint config.");
   }
-  const graphqlEndpoint = typeof options.graphqlEndpoint === "string" ? options.graphqlEndpoint : options.graphqlEndpoint();
-  await generateSchema(graphqlEndpoint, dest, writeToDisk);
+  await generateSchema(options.graphqlEndpoint, dest, writeToDisk);
   return dest;
 }
 async function autoImportDocuments(patterns = [], srcResolver) {
@@ -385,6 +477,17 @@ async function generate(options, schemaPath, resolver, srcDir, logEverything = f
   logger.info("Finished GraphQL code generation.");
   return { templates, hasErrors };
 }
+const fileExists = (path, extensions = ["js", "ts"]) => {
+  if (!path) {
+    return null;
+  } else if (existsSync(path)) {
+    return path;
+  }
+  const extension = extensions.find(
+    (extension2) => existsSync(`${path}.${extension2}`)
+  );
+  return extension ? `${path}.${extension}` : null;
+};
 
 const module = defineNuxtModule({
   meta: {
@@ -399,7 +502,6 @@ const module = defineNuxtModule({
   async setup(passedOptions, nuxt) {
     const options = defu({}, passedOptions, defaultOptions);
     validateOptions(options);
-    const rootDir = nuxt.options.rootDir;
     const moduleResolver = createResolver(import.meta.url).resolve;
     const srcDir = nuxt.options.srcDir;
     const srcResolver = createResolver(srcDir).resolve;
@@ -462,7 +564,7 @@ const module = defineNuxtModule({
       serverApiPrefix: options.serverApiPrefix
     };
     nuxt.options.runtimeConfig.graphqlMiddleware = {
-      rootDir
+      graphqlEndpoint: options.graphqlEndpoint || ""
     };
     if (options.includeComposables) {
       addImportsDir(moduleResolver("runtime/composables"));
@@ -508,6 +610,28 @@ declare module '#graphql-documents' {
 `;
       }
     });
+    const extensions = ["js", "mjs", "ts"];
+    const resolvedPath = "~/app/graphqlMiddleware.serverOptions".replace(/^(~~|@@)/, nuxt.options.rootDir).replace(/^(~|@)/, nuxt.options.srcDir);
+    const template = (() => {
+      const resolvedFilename = `graphqlMiddleware.serverOptions.ts`;
+      const maybeUserFile = fileExists(resolvedPath, extensions);
+      if (maybeUserFile) {
+        return addTemplate({
+          filename: resolvedFilename,
+          write: true,
+          getContents: () => `export { default } from '${resolvedPath}'`
+        });
+      }
+      return addTemplate({
+        filename: resolvedFilename,
+        write: true,
+        getContents: () => "export default {}"
+      });
+    })();
+    nuxt.options.nitro.externals = nuxt.options.nitro.externals || {};
+    nuxt.options.nitro.externals.inline = nuxt.options.nitro.externals.inline || [];
+    nuxt.options.nitro.externals.inline.push(template.dst);
+    nuxt.options.alias["#graphql-middleware-server-options"] = template.dst;
     addServerHandler({
       handler: moduleResolver("./runtime/serverHandler/index"),
       route: options.serverApiPrefix + "/:operation/:name"
@@ -531,8 +655,8 @@ declare module '#graphql-documents' {
           }
           await generateHandler();
           await updateTemplates({
-            filter: (template) => {
-              return template.options && template.options.nuxtGraphqlMiddleware;
+            filter: (template2) => {
+              return template2.options && template2.options.nuxtGraphqlMiddleware;
             }
           });
           await nitro.hooks.callHook("dev:reload");
@@ -541,5 +665,8 @@ declare module '#graphql-documents' {
     }
   }
 });
+function defineGraphqlServerOptions(options) {
+  return options;
+}
 
-export { module as default };
+export { module as default, defineGraphqlServerOptions };

package/dist/runtime/serverHandler/helpers/index.d.ts

@@ -1,18 +1,26 @@
 import { QueryObject } from 'ufo';
 import type { H3Event } from 'h3';
-import type { FetchOptions } from 'ofetch';
-import type { GraphqlMiddlewareConfig } from './../../../types';
+import type { FetchOptions, FetchResponse, FetchError } from 'ofetch';
+import type { GraphqlMiddlewareRuntimeConfig, GraphqlMiddlewareServerOptions } from './../../../types';
 import { GraphqlMiddlewareOperation } from './../../settings';
 export declare function queryParamToVariables(query: QueryObject): any;
 /**
  * Get the URL of the GraphQL endpoint.
  */
-export declare function getEndpoint(moduleConfig: GraphqlMiddlewareConfig, event: H3Event, operation: GraphqlMiddlewareOperation, operationName: string): string;
+export declare function getEndpoint(config: GraphqlMiddlewareRuntimeConfig, serverOptions: GraphqlMiddlewareServerOptions, event: H3Event, operation: GraphqlMiddlewareOperation, operationName: string): string | Promise<string>;
 /**
  * Get the options for the $fetch request to the GraphQL server.
  */
-export declare function getFetchOptions(moduleConfig: GraphqlMiddlewareConfig, event: H3Event, operation: GraphqlMiddlewareOperation, operationName: string): FetchOptions;
+export declare function getFetchOptions(serverOptions: GraphqlMiddlewareServerOptions, event: H3Event, operation: GraphqlMiddlewareOperation, operationName: string): FetchOptions | Promise<FetchOptions>;
 /**
  * Assure that the request is valid.
  */
 export declare function validateRequest(method?: string, operation?: GraphqlMiddlewareOperation, name?: string, documents?: Record<string, Record<string, string>>): void;
+/**
+ * Handle GraphQL server response.
+ */
+export declare function onServerResponse(serverOptions: GraphqlMiddlewareServerOptions, event: H3Event, response: FetchResponse<any>, operation?: string, operationName?: string): any;
+/**
+ * Handle GraphQL server errors.
+ */
+export declare function onServerError(serverOptions: GraphqlMiddlewareServerOptions, event: H3Event, error: FetchError, operation?: string, operationName?: string): any;

package/dist/runtime/serverHandler/helpers/index.mjs

@@ -9,26 +9,25 @@ export function queryParamToVariables(query) {
   }
   return query;
 }
-export function getEndpoint(moduleConfig, event, operation, operationName) {
-  if (typeof moduleConfig.graphqlEndpoint === "string") {
-    return moduleConfig.graphqlEndpoint;
-  } else if (typeof moduleConfig.graphqlEndpoint === "function") {
-    const endpoint = moduleConfig.graphqlEndpoint(
+export function getEndpoint(config, serverOptions, event, operation, operationName) {
+  if (serverOptions.graphqlEndpoint) {
+    const result = serverOptions.graphqlEndpoint(
       event,
       operation,
       operationName
     );
-    if (endpoint && typeof endpoint === "string") {
-      return endpoint;
+    if (result) {
+      return Promise.resolve(result);
     }
   }
+  if (config.graphqlEndpoint) {
+    return config.graphqlEndpoint;
+  }
   throw new Error("Failed to determine endpoint for GraphQL server.");
 }
-export function getFetchOptions(moduleConfig, event, operation, operationName) {
-  if (typeof moduleConfig.serverFetchOptions === "function") {
-    return moduleConfig.serverFetchOptions(event, operation, operationName) || {};
-  } else if (typeof moduleConfig.serverFetchOptions === "object") {
-    return moduleConfig.serverFetchOptions;
+export function getFetchOptions(serverOptions, event, operation, operationName) {
+  if (serverOptions.serverFetchOptions) {
+    return serverOptions.serverFetchOptions(event, operation, operationName) || {};
   }
   return {};
 }
@@ -61,3 +60,24 @@ export function validateRequest(method, operation, name, documents) {
     throwError(`Operation "${operation}" with name "${name}" not found.`);
   }
 }
+export function onServerResponse(serverOptions, event, response, operation, operationName) {
+  if (serverOptions.onServerResponse) {
+    return serverOptions.onServerResponse(
+      event,
+      response,
+      operation,
+      operationName
+    );
+  }
+  return response._data;
+}
+export function onServerError(serverOptions, event, error, operation, operationName) {
+  if (serverOptions.onServerError) {
+    return serverOptions.onServerError(event, error, operation, operationName);
+  }
+  throw createError({
+    statusCode: 500,
+    statusMessage: "Couldn't execute GraphQL query.",
+    data: error && "message" in error ? error.message : error
+  });
+}

package/dist/runtime/serverHandler/index.mjs

@@ -1,28 +1,36 @@
-import {
-  defineEventHandler,
-  createError,
-  getQuery,
-  getMethod,
-  readBody
-} from "h3";
+import { defineEventHandler, getQuery, getMethod, readBody } from "h3";
 import {
   queryParamToVariables,
   getEndpoint,
   getFetchOptions,
-  validateRequest
+  validateRequest,
+  onServerResponse,
+  onServerError
 } from "./helpers";
-import { getModuleConfig } from "./helpers/getModuleConfig.mjs";
 import { GraphqlMiddlewareOperation } from "./../settings/index.mjs";
 import { documents } from "#graphql-documents";
+import { useRuntimeConfig } from "#imports";
+import serverOptions from "#graphql-middleware-server-options";
 export default defineEventHandler(async (event) => {
   const method = getMethod(event);
   const operation = event.context.params.operation;
   const name = event.context.params.name;
   validateRequest(method, operation, name, documents);
   const query = documents[operation][name];
-  const config = await getModuleConfig();
-  const endpoint = getEndpoint(config, event, operation, name);
-  const fetchOptions = getFetchOptions(config, event, operation, name);
+  const runtimeConfig = useRuntimeConfig().graphqlMiddleware;
+  const endpoint = await getEndpoint(
+    runtimeConfig,
+    serverOptions,
+    event,
+    operation,
+    name
+  );
+  const fetchOptions = await getFetchOptions(
+    serverOptions,
+    event,
+    operation,
+    name
+  );
   const variables = operation === GraphqlMiddlewareOperation.Query ? queryParamToVariables(getQuery(event)) : await readBody(event);
   return $fetch.raw(endpoint, {
     method: "POST",
@@ -32,18 +40,8 @@ export default defineEventHandler(async (event) => {
     },
     ...fetchOptions
   }).then((response) => {
-    if (config.onServerResponse) {
-      return config.onServerResponse(event, response, operation, name);
-    }
-    return response._data;
-  }).catch((err) => {
-    if (config.onServerError) {
-      return config.onServerError(event, err, operation, name);
-    }
-    throw createError({
-      statusCode: 500,
-      statusMessage: "Couldn't execute GraphQL query.",
-      data: err && "message" in err ? err.message : err
-    });
+    return onServerResponse(serverOptions, event, response, operation, name);
+  }).catch((error) => {
+    return onServerError(serverOptions, event, error, operation, name);
   });
 });

package/dist/types.d.ts

@@ -8,4 +8,4 @@ declare module '@nuxt/schema' {
 }
 
 
-export { ModuleHooks, ModuleOptions, default } from './module'
+export { GraphqlMiddlewareServerOptions, ModuleHooks, ModuleOptions, default, defineGraphqlServerOptions } from './module'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nuxt-graphql-middleware",
-  "version": "3.0.2",
+  "version": "3.1.0-beta.0",
   "description": "Module to perform GraphQL requests as a server middleware.",
   "repository": {
     "type": "git",

package/dist/runtime/serverHandler/helpers/getModuleConfig.d.ts

@@ -1,6 +0,0 @@
-import type { GraphqlMiddlewareConfig } from './../../../types';
-/**
- * Due to nuxt's architecture, we have to manually load the runtime configuration.
- * This is only done for the first time and we cache the config locally.
- */
-export declare function getModuleConfig(): Promise<GraphqlMiddlewareConfig>;

package/dist/runtime/serverHandler/helpers/getModuleConfig.mjs

@@ -1,15 +0,0 @@
-import { loadNuxtConfig } from "@nuxt/kit";
-import { useRuntimeConfig } from "#imports";
-let moduleConfig = null;
-export function getModuleConfig() {
-  if (moduleConfig) {
-    return Promise.resolve(moduleConfig);
-  }
-  const { graphqlMiddleware } = useRuntimeConfig();
-  return loadNuxtConfig({
-    cwd: graphqlMiddleware.rootDir
-  }).then((v) => {
-    moduleConfig = v.graphqlMiddleware;
-    return v.graphqlMiddleware;
-  });
-}