How can I get my Next.JS API email route to send the host IP address to SendGrid?

Question

I am using the /api endpoint in my Next.js app to send emails. The request comes from the client side form like this (some code redacted for brevity and security):

const onSubmit = async (data) => {
    const result = await fetch('/api/customer_enquiry', {
        method: 'POST',
        body: JSON.stringify(data)
    })
    .then(res => {
        router.push({
            pathname: '/thanks'
        })
    })
}

and the /api/customer_enquiry endpoint is like so:

...
    const response = fetch(`https://api.sendgrid.com/v3/mail/send`, requestOptions)

    res.status(200).json(response)

I have opted for an IP 'allow-list'. IP addresses in my SendGrid account to help with security and it has been my assumption that Next.js's /api endpoint runs webhost-side on Next.js and so I was expecting that the IP address would be that of the webhost and thus the same every time. However, the IP address that is being sent is not that of the webhost, but of the client computer and so is being 'block-listed'. Have I made a wrong assumption about Next.js /api running webhost-side or am I doing something wrong?

Many thanks.

Answer 1

Turns out that Heroku's host IPs are dynamic and so they change from time to time. You can download a free (limited) or paid plugin e.g. QuotaGuard or Fixie to ensure that your app always appears as a static address.

In the end, I have created my own proxy on an API I own. My app sends the SendGrid email request from my app and the proxy API 'relays' it to SendGrid. The IP of my API is fixed and I add it to the allow list. Bit of a pain but there you have it.