'Next.js APIs working locally, but throws errors when deployed to Vercel/Netlify

The issue I'm having here is that whenever I deploy my app to either Netlify or Vercel the POST requests specifically being sent to the NextJS APIs are all throwing this error;

ERROR   SyntaxError: Unexpected token ' in JSON at position 0

however, when I run the application in either development mode or by building and running locally I'm not having the same issue everything works perfectly.

This is the code I'm using to send the request;

fetch('api/route', {
        method: 'POST',
        headers: {
            'Content-Type': 'application/json'
        },
        body: JSON.stringify({ ... data })
    })
        .then(res => res.json())
        .then(data => {
            data.error ? reject(new Error(data.error)) : resolve(data)
        })
        .catch(err => {
            console.log(err)
            reject(new Error('Network Error'))
        })

And, this is an example of the code in the API files;

export default async function handler(req, res) {


const { method } = req

switch (method) {
    case 'POST':

        const { ... data } = req.body

        try {
            // Computation
            res.status(200).json({ message: 'OK' })
        } catch (error) {
            console.log(error)
            res.status(500)
        }

        break;

    default:
        // Invalid Method
        console.log(new Error('Invalid Method: ', method))
        res.status(405)
}}

I would really appreciate any assistance, I'd really like to know what the problem is.



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source