Fire and forget Next.js API route

[dean1994]

Next.js version 14.2.0

I am trying to make an external API call from an API route using the fetch API. I am not interested in the external API response, I just want to fire and forget hence i am not using the await keyword on the fetch call,

export default async function handler(req: NextApiRequest, res: NextApiResponse) {
	try {
		fetch('/example-url', {
			method: 'POST',
		});

		res.status(200).json({ success: true });
	} catch (err) {
		return res.status(err.statusCode || 500).json({ error: err.message || 'Internal Server Error' });
	}
}

Why does Vercel not make the API call then return a 200?

Note: The above code works on my local

[anshumanb (Anshuman Bhardwaj)]

Hi @dean1994, I tried recreating the issue. Here’s what I found:

• The external requests are made (tested in both App and Pages router)
• The external requests are not shown in the External APIs section if they’re not awaited

I’m reaching out to the team to understand the reasoning behind it.

[anshumanb (Anshuman Bhardwaj)]

Hi @dean1994, the team confirmed this is intentional because un-awaited promises are not guaranteed to complete.

You can use the waitUntil utility from @vercel/functions for your fire and forget use case, as described in the docs.

import type { NextApiRequest, NextApiResponse } from "next";
import { waitUntil } from "@vercel/functions";

type ResponseData = {
  message: string;
};

export default async function handler(
  req: NextApiRequest,
  res: NextApiResponse<ResponseData>
) {
  try {
    waitUntil(fetch("https://example.com"));

    return res.status(200).json({ message: "Hello World" });
  } catch {
    return res.status(500).json({ message: "Error" });
  }
}