Next.js Discord

Discord Forum

Open graph image. SVG data parsing failed cause unknown token at 1:1

Unanswered
Asian black bear posted this in #help-forum
Open in Discord
Asian black bearOP
Original ticket: https://github.com/vercel/next.js/issues/61047

To Reproduce:
1. Self-hosted NGINX server
2. Cloudflare CDN
3. Build app
4. Upload to self host
5. Open Dynamic opengraph-image.tsx



Error:
On the first load of /open-graph the image is generated.
But on cached version I got the error

 ⨯ Error: failed to pipe response
    at pipeToNodeResponse (/app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/pipe-readable.js:111:15)
    at process.processTicksAndRejections (node:internal/process/task_queues:95:5)
   
    at async NextNodeServer.renderPageComponent (/app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1856:24)
    at async NextNodeServer.renderToResponseImpl (/app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:1894:32)
    at async NextNodeServer.pipeImpl (/app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/base-server.js:911:25)
    at async NextNodeServer.handleCatchallRenderRequest (/app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/server/next-server.js:271:17) {
  [cause]: Error: SVG data parsing failed cause unknown token at 1:1
      at imports.wbg.__wbg_new_15d3966e9981a196 (file:///app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/@vercel/og/index.node.js:18465:17)
      at wasm://wasm/005420d6:wasm-function[515]:0x112c4c
      at wasm://wasm/005420d6:wasm-function[30]:0x3ffde
      at new Resvg (file:///app/node_modules/.pnpm/next@14.1.0_@babel+core@7.23.6_react-dom@18.2.0_react@18.2.0/node_modules/next/dist/compiled/@vercel/og/index.node.js:18347:12)
      at new Resvg2 

1 Reply

Asian black bearOP
The main issue - it works for at the beginning, but even with disalbed cache -> got the error.

I tried
export const dynamic = "force-dynamic";

the only different, that error occurs from cached function

For sure, reproduction on codegen doesn't show the issue, because it's a LIVE node version.

Maybe someone from you could help to add more explicit error handlers.