ayklee•2mo ago

TRPC giving 502 errors with jsonl header

I'm encountering a 502 Bad Gateway error when making a GET request to my tRPC endpoint in a production environment. This only happens when using the trpc-accept: application/jsonl header. Environment Runtime: bun Deployment Stack: docker → nginx → cloudflare tRPC version:

"@trpc/client": "^11.0.0-rc.446",
"@trpc/react-query": "^11.0.0-rc.446",
"@trpc/server": "^11.0.0-rc.446",

"@trpc/client": "^11.0.0-rc.446",
"@trpc/react-query": "^11.0.0-rc.446",
"@trpc/server": "^11.0.0-rc.446",

Request Example Here is the frontend request triggering the issue:

await fetch("https://<cloudflare_url>/api/trpc/admin.getExams?batch=1&input=%7B%220%22%3A%7B%22json%22%3A%2230494%22%7D%7D", {
  credentials: "include",
  headers: {
    "User-Agent": "Mozilla/5.0 ...",
    "Accept": "*/*",
    "Accept-Language": "en-US,en;q=0.5",
    "content-type": "application/json",
    "trpc-accept": "application/jsonl",  // ← Causes 502
    "x-trpc-source": "nextjs-react",
    ...
  },
  referrer: "https://<cloudflare_url>/admin/p/30494",
  method: "GET",
  mode: "cors"
});

await fetch("https://<cloudflare_url>/api/trpc/admin.getExams?batch=1&input=%7B%220%22%3A%7B%22json%22%3A%2230494%22%7D%7D", {
  credentials: "include",
  headers: {
    "User-Agent": "Mozilla/5.0 ...",
    "Accept": "*/*",
    "Accept-Language": "en-US,en;q=0.5",
    "content-type": "application/json",
    "trpc-accept": "application/jsonl",  // ← Causes 502
    "x-trpc-source": "nextjs-react",
    ...
  },
  referrer: "https://<cloudflare_url>/admin/p/30494",
  method: "GET",
  mode: "cors"
});

Behavior ✅ Local Docker: Request works as expected. ❌ Production (Docker + Nginx + Cloudflare): Returns a 502 Bad Gateway. When I remove the trpc-accept header or change it to "application/json", the request works fine in production. Additional Notes In the browser dev tools, when this request fails locally (still using Docker), the Network > Response panel shows:

SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 2 column 1 of the JSON data

SyntaxError: JSON.parse: unexpected non-whitespace character after JSON data at line 2 column 1 of the JSON data

This seems to be an issue with how application/jsonl is handled, either by nginx, cloudflare, or the bun server itself. What I’ve Tried Changing trpc-accept to application/json → Works Removing trpc-accept altogether → Works Reproduced only in production (cloudflare + nginx)

2 Replies

aykleeOP•2mo ago

This is my Dockerfile and docker-compose, by the way

# Base image with Bun
FROM oven/bun:latest AS base

WORKDIR /app

# Copy dependencies and install
COPY bun.lock package.json ./
COPY prisma ./prisma
RUN bun install

# Copy the rest of the app
COPY . .

ENV SKIP_ENV_VALIDATION=true

# Build the app
RUN bun run build

# -----
# Production image
FROM oven/bun:latest AS runner

WORKDIR /app

ENV NODE_ENV=production
ENV PORT=3000

# Copy built output and dependencies
COPY --from=base /app/.next ./.next
COPY --from=base /app/public ./public
COPY --from=base /app/node_modules ./node_modules
COPY --from=base /app/package.json ./
COPY --from=base /app/prisma ./prisma

EXPOSE 3000

CMD ["bun", "deployment"]

# Base image with Bun
FROM oven/bun:latest AS base

WORKDIR /app

# Copy dependencies and install
COPY bun.lock package.json ./
COPY prisma ./prisma
RUN bun install

# Copy the rest of the app
COPY . .

ENV SKIP_ENV_VALIDATION=true

# Build the app
RUN bun run build

# -----
# Production image
FROM oven/bun:latest AS runner

WORKDIR /app

ENV NODE_ENV=production
ENV PORT=3000

# Copy built output and dependencies
COPY --from=base /app/.next ./.next
COPY --from=base /app/public ./public
COPY --from=base /app/node_modules ./node_modules
COPY --from=base /app/package.json ./
COPY --from=base /app/prisma ./prisma

EXPOSE 3000

CMD ["bun", "deployment"]

services:
  web:
    build: .
    ports:
      - "3000:3000"
    depends_on:
      - db
    env_file:
      - .env
    restart: unless-stopped

  db:
    image: postgres:15
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
      POSTGRES_DB: postgres
    volumes:
      - pgdata:/var/lib/postgresql/data

volumes:
  pgdata:

services:
  web:
    build: .
    ports:
      - "3000:3000"
    depends_on:
      - db
    env_file:
      - .env
    restart: unless-stopped

  db:
    image: postgres:15
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: postgres
      POSTGRES_DB: postgres
    volumes:
      - pgdata:/var/lib/postgresql/data

volumes:
  pgdata:

Bohdan•2mo ago

@ayklee I'm experiencing the same issue (both in standalone and in regular Next.js output mode, using DigitalOcean and Dokploy). Weirdly enough, deploying with nixpacks works, but I'm trying to move away from nickpacks. Going to try your workarounds... UPD: httpBatchStreamLink seems to be the culprit. Replacing it with httpBatchLink works as well.

TRPC giving 502 errors with jsonl header

Did you find this page helpful?