Can't manage to return a 404 response from Netlify Edge

Site name: popthegrid
Site ID: c107594c-eeb5-4824-8236-505580ffe54d
Repository: GitHub - tmaxmax/popthegrid: Pop all the squares in the grid! Will you make it?

Hello there!

I can’t manage to return a 404 response from Netlify Edge. For context, my website hosts a simple game in which you can achieve various records; you can share these records with others by generating some unique URLs, which are stored in a database, accessed through a Netlify serverless function. The URLs are of the format, where :code is a server-side randomly generated string of 6 characters, [a-zA-Z0-9].

Anyway, to serve these unique URLs I use an Edge function as follows (implementation here:

  • get the code from the request URL, if it exists; if not, skip the function
  • call the serverless function with the code, to retrieve the required information about the record
  • if the code doesn’t exist, redirect the client to the home page, with status code 307
  • if the code does exist and is fetched successfully, call with a request for the index page, then modify the HTML to add some specific meta tags and other data
  • return the new response

What I would like to do instead is to return a proper status code and keep the initial URL (not redirect to another page). Here was my implementation idea (the following code would be included in the implementation linked above):

// This is the request to the serverless function; not sure if I need `sendConditionalRequest` here,
// I must confess I didn't thoroughly understand this part – it seemed to fix some weird
// "Could not process your request for the document because it would cause an HTTP proxy cycle" error
const res = await Request(`${baseURL}/.netlify/functions/share?code=${code}`), { sendConditionalRequest: false })
if (res.status !== 200) {
  // baseURL is the index page – basically `/`
  const homepage = await Request(baseURL))
  // This cookie is used on FE to modify the  so it shows there was an error
  context.cookies.set({ /* value */ }
  return new Response(homepage.body, { ...homepage, status: res.status })

This works for status 500 – and I assume other statuses aswell – but not 404. On 500 I get the homepage, and in Devtools I see that the server responded correctly with 500 and that the cookie is set; on 404 I get nothing. I can see, through a log I have at the beginning of the edge function, that on 404 a request is sent for the following files: :code.html, :code.htm, :code/index.html, :code/index.htm; as if 404 is handled in some special manner and my returned response from the function is just ignored.

Not returning any response in the res.status !== 200 branch (basically just return) gives the same result as described above; I tried this because I thought that I could have a 404 redirect in netlify.toml to take care of it, and redirects are not considered if the edge function returns a response, but it’s still ignored. For a working example, see implementation and a deploy preview link which should be broken (non-existing code).

What can I do? It appears as if my code would be correct, but 404 seems to be handled differently by the Edge runtime. Should I approach this differently? Thank you.

EDIT: This apparently works in deploy preview but does not work in dev (using Netlify CLI). What should I do?

Hi @tmaxmax,

Just to confirm, the issue here is that, when you send a 404 status code, you’re getting the Netlify 404 page? And this happen only in CLI, right?

Yes, you got it right, the issue only happens in Netlify CLI! Sorry for the post being so long, only for a CLI bug – I discovered that it works in deployment only after pushing and having a preview built.

Thanks for confirming. In that case, is it possible to create a minimal reproduction and file an issue for the CLI team to check?

I will create a repository in the next couple days, sorry for the late response! I think I’ve found in the past other issues with the CLI and edge functions, which I’ll make sure to also report if they still occur. Thank you!