Next.JS fetch and Axios request timing out on Vercel production

Question

I'm trying to fetch a specific JSON data, but it times out and never gets the response back and ends up timing out on Vercel deploy. The response I'm fetching is only 18KB and the fetch request works fine in dev on localhost. However when I deploy it to Vercel, it simply doesn't fetch anymore. I've tried using axios, but same issue occurs. This is the JSON data I'm trying to fetch:

https://www.canada.ca/content/dam/ircc/documents/json/ee_rounds_123_en.json

Here's my code inside the api routes folder:

/api/checkUpdates.tsx

const url = 'https://www.canada.ca/content/dam/ircc/documents/json/ee_rounds_123_en.json'
export default async (req: NextApiRequest, res: NextApiResponse) => {

    console.log('before fetch request')
    console.time('fetch')
    
    const data = await fetch(url)
    
    // from here on, it only executes on localhost
    console.timeEnd('fetch')
    console.log('fetch success')

    const json = await data.json();
    console.log('success')
    const thisDraw = json.rounds[0]
    res.send(thisDraw?.drawNumber)
}

When I try to fetch the page https://www.canada.ca/content/dam/ircc/documents/json/ee_rounds_123_en.json from a Vercel deploy it takes forever and never loads. Same thing happens if I try using axios. It works normally on localhost, though. Apparently it's something related to that page specifically, as I've tried fetching other JSONs from the web and it worked fine.

Next.JS v13.2.3

Answer 1

• I think the server version of node is 16 or below so you would need to install node-fetch
• Or change vercel node version to 18

yarn add node-fetch

or

npm install node-fetch

import fetch from 'node-fetch';
const data = await fetch(url)