@graphcommerce/graphql-mesh 10.1.0-canary.4 → 10.1.0-canary.40

package/CHANGELOG.md

@@ -1,5 +1,89 @@
 # Change Log
 
+## 10.1.0-canary.40
+
+## 10.1.0-canary.39
+
+## 10.1.0-canary.38
+
+### Minor Changes
+
+- [#2650](https://github.com/graphcommerce-org/graphcommerce/pull/2650) [`ccd01e9`](https://github.com/graphcommerce-org/graphcommerce/commit/ccd01e9ad061783b354fd8655b5319edb26a15f1) - Route server-side Magento traffic over an internal network with the new runtime-only `GC_MAGENTO_ENDPOINT_SERVER` environment variable (e.g. `http://varnish.magento-namespace.svc.cluster.local`). When set, every mesh request whose URL starts with the origin of `GC_MAGENTO_ENDPOINT` — GraphQL and REST — is rewritten to the internal origin and gains an `X-Forwarded-Proto: https` header, so frontend↔Magento traffic inside a Kubernetes cluster no longer hairpins over the public load balancer. Unset, behavior is unchanged. See the new "Routing Magento traffic over an internal network" section in the mesh docs. ([@paales](https://github.com/paales))
+
+## 10.1.0-canary.37
+
+## 10.1.0-canary.36
+
+## 10.1.0-canary.35
+
+## 10.1.0-canary.34
+
+## 10.1.0-canary.33
+
+### Patch Changes
+
+- [#2648](https://github.com/graphcommerce-org/graphcommerce/pull/2648) [`24541b8`](https://github.com/graphcommerce-org/graphcommerce/commit/24541b8d3d7f5de80ebc7b9a03d439b4347eb9e6) - Fix multipart file uploads through the mesh returning "Unable to parse the request." in `next dev` (turbopack). `customFetch` used `globalThis.fetch` (undici) inside Next, while `@graphql-tools/executor-http` builds upload bodies with `FormData` from `@whatwg-node/fetch`. In `next dev`, `@whatwg-node/fetch` is evaluated while `next.config.ts` loads — before any `__NEXT` global exists — so its Next.js detection fails and it exports its ponyfills. Undici doesn't recognize the ponyfill `FormData` and stringified the request body to the literal `[object Object]`. `customFetch` now always uses the fetch exported by `@whatwg-node/fetch`, which is `globalThis.fetch` whenever the native path is active and the matching ponyfill fetch otherwise, so fetch and `FormData` always come from the same implementation family. ([@paales](https://github.com/paales))
+
+## 10.1.0-canary.32
+
+### Patch Changes
+
+- [#2644](https://github.com/graphcommerce-org/graphcommerce/pull/2644) [`c4ca56a`](https://github.com/graphcommerce-org/graphcommerce/commit/c4ca56a08915d918f78339ecddcc418dfc26857d) - Fix GraphQL multipart uploads (`Upload` scalar) through the Mesh. Next.js' pages-router bodyParser decodes multipart request bodies as UTF-8 text before Yoga can parse them, silently corrupting binary upload bytes (invalid UTF-8 sequences become replacement characters and the part's mime type is lost). The `/api/graphql` route now sets `bodyParser: false` so Yoga receives the raw stream, and `createServer` throws a descriptive error when it receives a multipart request whose body was already consumed by the bodyParser. ([@paales](https://github.com/paales))
+
+## 10.1.0-canary.31
+
+## 10.1.0-canary.30
+
+## 10.1.0-canary.29
+
+## 10.1.0-canary.28
+
+## 10.1.0-canary.27
+
+## 10.1.0-canary.26
+
+## 10.1.0-canary.25
+
+## 10.1.0-canary.24
+
+## 10.1.0-canary.23
+
+## 10.1.0-canary.22
+
+## 10.1.0-canary.21
+
+## 10.1.0-canary.20
+
+## 10.1.0-canary.19
+
+## 10.1.0-canary.18
+
+## 10.1.0-canary.17
+
+## 10.1.0-canary.16
+
+## 10.1.0-canary.15
+
+## 10.1.0-canary.14
+
+## 10.1.0-canary.13
+
+## 10.1.0-canary.12
+
+## 10.1.0-canary.11
+
+## 10.1.0-canary.10
+
+## 10.1.0-canary.9
+
+## 10.1.0-canary.8
+
+## 10.1.0-canary.7
+
+## 10.1.0-canary.6
+
+## 10.1.0-canary.5
+
 ## 10.1.0-canary.4
 
 ## 10.1.0-canary.3

package/api/createEnvelop.ts

@@ -8,6 +8,15 @@ export const createServer = async (endpoint: string) => {
 
   const handler = createBuiltMeshHTTPHandler()
   return async (req: NextApiRequest, res: NextApiResponse) => {
+    if (req.headers['content-type']?.startsWith('multipart/form-data') && req.body !== undefined) {
+      // Next's pages-router bodyParser has already consumed the request stream and decoded it as
+      // UTF-8 text, which corrupts binary `Upload` bytes (the multipart boundary survives, so the
+      // request would otherwise be forwarded with silently mangled file contents).
+      throw Error(
+        "Multipart GraphQL requests require Next.js' bodyParser to be disabled. Add `bodyParser: false` to the route config in pages/api/graphql.ts: export const config = { api: { externalResolver: true, bodyParser: false } }",
+      )
+    }
+
     res.setHeader('Access-Control-Allow-Origin', req.headers.origin || '*')
     const requestedHeaders = req.headers['access-control-request-headers']
     if (requestedHeaders) {

package/customFetch.ts

@@ -2,10 +2,60 @@ import fetchRetry from 'fetch-retry'
 import type { RequestInitWithRetry } from 'fetch-retry'
 
 const fetcher = fetchRetry(
-  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, no-underscore-dangle, @typescript-eslint/no-var-requires
-  process.env.__NEXT_PROCESSED_ENV ? globalThis.fetch : require('@whatwg-node/fetch').fetch,
+  /**
+   * Always use the fetch that `@whatwg-node/fetch` exports, never `globalThis.fetch` directly. When
+   * `@whatwg-node/fetch` detects a Next.js runtime it re-exports the native fetch primitives (so
+   * inside Next this IS `globalThis.fetch`/undici, keeping SSL handshakes alive), but when that
+   * detection fails — `next dev` (turbopack) evaluates it while loading `next.config.ts` (via
+   * `@graphql-codegen/cli`), before any `__NEXT` global exists — it exports its ponyfills instead.
+   * In that case `@graphql-tools/executor-http` builds multipart upload bodies with the ponyfill
+   * `FormData`, which undici doesn't recognize and stringifies to the literal `[object Object]`
+   * (Magento: "Unable to parse the request."). The fetch implementation must therefore always come
+   * from the same family as the `FormData`/`File` classes executor-http uses.
+   */
+  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument, @typescript-eslint/no-var-requires
+  require('@whatwg-node/fetch').fetch,
 )
 
+/**
+ * Optionally reroute server-side Magento traffic to an internal endpoint.
+ *
+ * When the runtime environment sets `GC_MAGENTO_ENDPOINT_SERVER` (e.g.
+ * `http://varnish.magento-namespace.svc.cluster.local`), every request whose URL starts with the
+ * origin of `GC_MAGENTO_ENDPOINT` is rewritten to that origin. All Magento traffic the mesh
+ * performs (GraphQL and REST) then stays on the internal network — e.g. within a Kubernetes cluster
+ * — instead of hairpinning over the public load balancer, while the public endpoint keeps serving
+ * the browser-facing concerns (media URLs, image optimization).
+ *
+ * - Both variables are read from `process.env` at request time: this module also runs outside the
+ *   Next.js bundler (the mesh CLI imports it during `gc-mesh build`), so it cannot rely on
+ *   build-inlined configuration.
+ * - Set `GC_MAGENTO_ENDPOINT_SERVER` in the runtime environment only (e.g. a Kubernetes ConfigMap),
+ *   never in the build environment: schema introspection and static generation run where the
+ *   internal endpoint is not reachable. Unset, this is a no-op.
+ * - The rewrite adds `X-Forwarded-Proto: https` — the internal path bypasses the TLS-terminating
+ *   proxy that normally adds it, and without it Magento considers the request insecure and
+ *   generates http:// URLs in responses.
+ */
+function toServerEndpoint(
+  url: RequestInfo | URL,
+  options: RequestInitWithRetry | undefined,
+): [RequestInfo | URL, RequestInitWithRetry | undefined] {
+  const serverEndpoint = process.env.GC_MAGENTO_ENDPOINT_SERVER
+  const publicEndpoint = process.env.GC_MAGENTO_ENDPOINT
+  if (!serverEndpoint || !publicEndpoint) return [url, options]
+  if (typeof url !== 'string' && !(url instanceof URL)) return [url, options]
+
+  const publicOrigin = new URL(publicEndpoint).origin
+  const target = url.toString()
+  if (!target.startsWith(publicOrigin)) return [url, options]
+
+  return [
+    new URL(serverEndpoint).origin + target.slice(publicOrigin.length),
+    { ...options, headers: { ...options?.headers, 'x-forwarded-proto': 'https' } },
+  ]
+}
+
 /**
  * @param {RequestInfo | URL} url
  * @param {import('fetch-retry').RequestInitWithRetry | undefined} options
@@ -16,12 +66,14 @@ export const fetch = (
   url: RequestInfo | URL,
   options: RequestInitWithRetry | undefined,
 ): Promise<Response> => {
+  const [serverUrl, serverOptions] = toServerEndpoint(url, options)
+
   const headers = Object.fromEntries(
-    Object.entries(options?.headers ?? {}).filter(([, value]) => value !== ''),
+    Object.entries(serverOptions?.headers ?? {}).filter(([, value]) => value !== ''),
   )
 
-  return fetcher(url, {
-    ...options,
+  return fetcher(serverUrl, {
+    ...serverOptions,
     headers,
     retries: 6,
     retryDelay: (attempt) => 2 ** attempt * 200, // 200, 400, 800, 1600, 3200, 6400

package/package.json

@@ -2,7 +2,7 @@
   "name": "@graphcommerce/graphql-mesh",
   "homepage": "https://www.graphcommerce.org/",
   "repository": "github:graphcommerce-org/graphcommerce",
-  "version": "10.1.0-canary.4",
+  "version": "10.1.0-canary.40",
   "dependencies": {
     "@whatwg-node/fetch": "^0.10.13",
     "fetch-retry": "^5.0.6",
@@ -20,9 +20,9 @@
   },
   "peerDependencies": {
     "@apollo/client": "*",
-    "@graphcommerce/eslint-config-pwa": "^10.1.0-canary.4",
-    "@graphcommerce/prettier-config-pwa": "^10.1.0-canary.4",
-    "@graphcommerce/typescript-config-pwa": "^10.1.0-canary.4",
+    "@graphcommerce/eslint-config-pwa": "^10.1.0-canary.40",
+    "@graphcommerce/prettier-config-pwa": "^10.1.0-canary.40",
+    "@graphcommerce/typescript-config-pwa": "^10.1.0-canary.40",
     "@graphql-mesh/runtime": "*",
     "@graphql-mesh/types": "*"
   },