Hello everyone,

My nextjs (App router) app is trying to connect to a service deployed on render.com.
The service at render.com is receiving the request and processing the request.
But nextjs await doesnot stop for the response. The response time is 6 seconds
The same thing works on local environment connecting to render.com.

This is how i am making the call in a route handler. 

 const response = await fetchWithTimeout({
      url: process.env.NEXT_PUBLIC_CRAWL_SERVICE_URL!,
      options: {
        method: "POST",
        headers: newHeaders,
        body: payload,
      },
    });

This is how fetchWithTImeout looks like

export async function fetchWithTimeout({
  url,
  timeout = 30000,
  options = {},
}: {
  url: string;
  timeout?: number;
  options: any;
}): Promise<any> {
  try {
    const controller = new AbortController();
    const timeoutId = setTimeout(() => {
      console.log("aborting the timer");
      controller.abort();
    }, timeout);

    const fetchOptions = { signal: controller.signal, ...options };
    console.log("making the call");

    const response = await fetch(new URL(url), fetchOptions);

    console.log("before successfull call");
    if (timeoutId) {
      clearTimeout(timeoutId); // Clear the timeout if the request completes before the timeout
    }
    console.log("successfull call");
    return response;
  } catch (e: any) {
    console.log("error inside  fetchWithTimeout -->", e);
    // Change the status code
    return {
      status: StatusCodes.REQUEST_TIMEOUT,
    };
  }
}

Strange thing I cannot see anything logged after "making the call" log in vercel logs.

I see connection closed error on browser console.

One more addional note: I am making the call from a server component -> Route handler (intermediate route handler)-> RoutHandler (the one which calls fetchWithTimeout)-> Thirdparty


Any pointers. what might be happening.?