Error while deploying Next.js on vercel: Unexpected token R in JSON at position 0

Question

I am fetching json data from api like below

-pages/explorer.js

    const charity = await fetch("https://api.www.every.org/api/search_v0?query=&causes="+categories[i]+"&take=100&skip=0", {
        method: `GET`,
        headers: {
            Accept: "application/json"
        }
    });
    const json = await charity.json()

It's a bit long length of output. I am not sure that's the reason, but fails while deploying on vercel.

Error occurred prerendering page "/explorer". Read more: https://nextjs.org/docs/messages/prerender-error
FetchError: invalid json response body at https://api.www.every.org/api/search_v0?query=&causes=coronavirus&take=100&skip=0 reason: Unexpected token R in JSON at position 0
    at /vercel/path0/node_modules/node-fetch/lib/index.js:272:32
    at processTicksAndRejections (internal/process/task_queues.js:95:5)
    at async getStaticProps (/vercel/path0/.next/server/pages/explorer.js:331:18)
    at async renderToHTML (/vercel/path0/node_modules/next/dist/server/render.js:329:24)
    at async /vercel/path0/node_modules/next/dist/export/worker.js:273:36
    at async Span.traceAsyncFn (/vercel/path0/node_modules/next/dist/telemetry/trace/trace.js:60:20)

Answer 1

I avoid error by adding catch. I can't find better way.

try{
    const json = await charity.json()
} catch(err) {
    console.log("err: ", err)
}