Hacktoberfest 2026：メンテナが10月に向けて印を付けた、オープンで初心者向けの issue。 Hacktoberfest の issue を見る

[Bug]: `theme dev` proxy 502s on cookie-heavy storefront responses (undici default 16 KiB `maxHeaderSize`)

オープン
  • 何か問題がありますか？
#8,717 コメント 2 件 リアクション 0 件 担当者 0 名 GitHub で見る

メンテナーはふだん 1 日以内に返信

@efegokdemir がすでに取り組んでいます。

2026年10月2日 から。

  • #8746 @efegokdemir による — オープン

評価

難易度
3/5
見積もり時間
1〜2日
初心者へのやさしさ
68/100
issue の種類
バグ
明瞭さ
明確に書かれている
活発さ
活発
技術スタック
node.js, typescript
領域
backend, cli

調査の方向性

Start by tracing the theme dev storefront proxy path that forwards requests and handles upstream fetch errors; the report does not name a source file or test. Reproduce with a cookie-heavy response and inspect how the proxy configures undici and turns failures into 502s. Done means the response succeeds above the default header limit and the overflow cause is actionable in the error output.

索引モデルが issue の本文から書いたものです。

説明

[Bug]: theme dev proxy 502s on cookie-heavy storefront responses (undici default 16 KiB maxHeaderSize)

Description

shopify theme dev renders all pages as 502 ("Failed to render storefront") once the browser has cookies for the store. The storefront proxy dies parsing the upstream response headers: the response to a cookie'd request carries enough Set-Cookie headers to exceed undici's default 16 KiB header limit. The undici error (UND_ERR_HEADERS_OVERFLOW) is swallowed and surfaced as a bare TypeError: fetch failed → 502.

The theme, the dev theme, and the store are all fine — a cookie-less request to the same URL renders correctly.

Steps to reproduce

  1. shopify theme pull --live and shopify theme dev on any store whose storefront sets a large Set-Cookie collection on cookie'd requests (this merchant: a Plus cosmetics store with cart/localization/tracking cookies).
  2. Visit http://127.0.0.1:9292/ in a browser with an existing cookie jar for the store.
  3. Every page render fails:
Failed to render storefront with status 502 (Bad Gateway).
URL: https://REDACTED-store.myshopify.com/?_fd=0&pb=0

TypeError: fetch failed
    at Object.processResponse (node:internal/deps/undici/undici:12793:20)
    at async ze (.../@shopify/cli/dist/chunk-CSNXCRPY.js:12:375)
  1. Open the same URL in an incognito window (empty cookie jar) — it renders. curl to the same URL renders. Node fetch from a fresh process renders. Only the CLI's cookie-forwarding proxy path fails.

Isolating the real error

The CLI wraps the undici error and drops error.cause. Attaching this shim via NODE_OPTIONS="--require /tmp/shim.cjs" and re-running theme dev reveals the cause:

const orig = globalThis.fetch;
globalThis.fetch = async (...args) => {
  try { return await orig(...args); }
  catch (e) {
    console.error('[fetch-debug] URL:', String(args[0] && (args[0].url || args[0])).slice(0, 200));
    console.error('[fetch-debug] cause code:', e.cause && e.cause.code, '| cause:', e.cause && e.cause.message);
    throw e;
  }
};

Output:

[fetch-debug] URL: https://REDACTED-store.myshopify.com/?_fd=0&pb=0
[fetch-debug] cause code: UND_ERR_HEADERS_OVERFLOW | cause: Headers Overflow Error
    at Parser.trackHeader (node:internal/deps/undici/undici:7385:37)
    at Parser.onHeaderValue (node:internal/deps/undici/undici:7376:14)

Supporting measurements

  • Cookie-less GET https://REDACTED-store.myshopify.com/?_fd=0&pb=0 (with the CLI's User-Agent): 200, full 940 KB body, response header block ≈ 7.9 KB — under the 16 KiB cap, no failure.
  • Same request with the browser's cookie jar forwarded: the storefront returns a much larger Set-Cookie collection, pushing the response header block past 16 KiB → UND_ERR_HEADERS_OVERFLOW.
  • GET and POST (with replace_templates form bodies, up to 2 MB) both succeed without cookies, so neither method, body, nor header shape is the trigger — only response header size.

Suggested fix

  1. Configure the proxy's fetch/Agent with a larger maxHeaderSize (e.g. 64–128 KiB) instead of undici's 16 KiB default. Shopify storefronts legitimately set large Set-Cookie collections on cookie'd requests.
  2. In the 502 error page, surface error.cause.code (e.g. UND_ERR_HEADERS_OVERFLOW) instead of only the wrapped TypeError: fetch failed stack — it took a NODE_OPTIONS shim to find the actual cause.

Workaround

Use an incognito/private window for http://127.0.0.1:9292/, or clear site data for 127.0.0.1 and the store domain.

Environment
CLI version @shopify/[email protected] (pnpm global)
Node v24.15.0
OS macOS 15
Store Shopify Plus storefront

Possibly related: #8480 (theme dev proxy 502, cause not isolated — same proxy path, this report's cause code may explain it) and #3963.

主要言語
TypeScript
スター
754
フォーク
294
平均マージ
2日 2時間
マージ済み PR（30日）
138

環境構築

はじめの一歩

  1. issue を最後まで読み、次にプロジェクトのコントリビューションガイドを読みます。
  2. 着手することを issue にコメントします — 二人が同じ作業をするのを防げます。
  3. リポジトリをフォークし、ブランチを切って変更します。
  4. issue 番号を参照したプルリクエストを送ります。

Shopify/cli のほかの issue

Shopify/cli の issue をすべて見る

似ている issue

TypeScript の issue をもっと見る

新しい issue をメールで受け取る

初心者向けの GitHub issue を短くまとめたダイジェスト。