Netlify + Planetscale database integration with Typescript

Question

I am trying to do a simple GET call (select * from …). I have created the below Netlify function and saved it in the node_modules/@netlify/functions folder:

const handler: Handler = withPlanetscale(async (event, context) => {
  const {
    planetscale: { connection },
  } = context;

  console.log('MADE IT INSIDE!')

  const { body } = event;

  return connection.execute('select * from Todo')
    .then((res) => {
      return {
        statusCode: 201,
        body: JSON.stringify(res),
      };
    })
    .catch((err) => ({
        statusCode: 400,
        body: JSON.stringify(err),
      })
    )
});

export { handler };

In a react file I am using the following fetch request:

fetch(
    '/.netlify/functions/select',
    {
        method: 'GET',
        headers: {  
        "Content-Type": "application/json",
        "Accept": "application/json"
        },
})
    .then((res) => console.log(res))
    .catch((err) => console.log(err))

I get the following error: “GET http://localhost:8888/.netlify/functions/select [HTTP/1.1 431 Request Header Fields Too Large 1323ms]”.

I have tried changing the fetch call path between the following: ‘/.netlify/functions/select’, ‘/@netlify/functions/select’, ‘.netlify/functions/select’, and ‘@netlify/functions/select’.

I have placed console logs inside the function but they aren't reached. None of the catches are reached; i.e. the fetch call doesn't error.

I have cleared my cache.

I am using firefox.