API calls to sendgrid works perfectly on local but not on live (Netlify-deployed) version

Support
1

PLEASE help us help you by writing a good post!

My app is deployed on https://sectors.app and there is a simple form with just one field: email on the homepage. This is intended to collect newsletter subscribers and push it to SendGrid using a simple PUT action.

Here’s the relevant code in route.js:

import { NextResponse } from "next/server";

export async function PUT(request: Request){
    const url = `https://api.sendgrid.com/v3/marketing/contacts`


    const headers = {
        Authorization: `Bearer ${process.env.SENDGRID_API_KEY}`,
        "Content-Type": "application/json",
        cookie: request.headers.get("cookie") || "",
    };

    const formJson = await request.json() 

    const data = {
        "contacts": [{ email: formJson.email }],
        "list_ids": ["042xxxx-xxxxxxxx-xxxxxxxxx-xxxxxx"]
    };
    const options = {
        method: "PUT",
        headers: headers,
        body: JSON.stringify(data),
    };
    const response = await fetch(url, options);
     
    return NextResponse.json({ json })
}

It works like a charm on local, so I pushed the environment variable to netlify, double-checked that it is correct, and then spent the next 2 days troubleshooting why it didn’t work. I am not using Netlify Functions. I don’t need Netlify to handle any actual sending of emails, just this PUT request to sendgrid’s api.

Scoured every bit of threads and forums over the last 48 hours but no luck! Any pointers I’ll greatly appreciate!

2

Netlify functions are the only way to handle such a request, as the rest of the environment does not have a listening server. It’s meant for building your static website, nothing else.

3

Would this also apply to making a PUT request to supabase? Let’s say adding a row to a db on supabase / planetscale / railway, I’d have to use Netlify Functions as well instead it the usual fetch requests?

4

You can directly point a form to whatever endpoint you wish to use, but PUT is not a valid method for forms: Using PUT method in HTML form - Stack Overflow

So, if you want to use PUT and POST is not an option, Netlify Functions (or Edge Functions) are the way to go.