Getting started - redirects in local dev

Support
, , , ,
#1

Hi, do redirects not work with netlify dev?

Going through the ‘Get started with Netlify’ tutorial, the redirect works correctly for my deployed site: https://sunnyside-math.netlify.app/api/hello-world → https://sunnyside-math.netlify.app/.netlify/functions/hello-world. But it doesn’t work in dev.

[access] /api/hello-world
[access] Not Found: /api/hello-world
[access] /404

I also tried adding an explicit redirect: /api/hello-world /.netlify/functions/hello-world but that also didn’t work in dev.

Thanks!

#2

Hey @troutshorty

Yes proxy rewrite such as using /api to point to /.netlify/functions should work (something I use myself frequently).

Are you able to share the _redirects, or netlify.toml file you are using?

#3

Thanks @coelmay!

I’m just using the suggested _redirects:
/api/* /.netlify/functions/:splat

#4

What you have should/will work, but will by default redirect using a 301 (see documentation) which is a permanent redirect.

Ideally, you would use

/api/*   /.netlify/functions/:splat    200

which does not redirect but returns the content from the function (without the path/address changing.)

Are you still seeing a 404? Are the functions getting loaded when netlify dev starts e.g.

◈ Loaded function print-headers (​http://localhost:8888/.netlify/functions/print-headers​).
◈ Loaded function rebuild-site (​http://localhost:8888/.netlify/functions/rebuild-site​).
◈ Loaded function redirector (​http://localhost:8888/.netlify/functions/redirector​).
◈ Functions server is listening on 50870
#5

Yes, I’m seeing the function getting loaded
$ ntl dev
◈ Netlify Dev ◈
◈ Injected build settings env var: MY_SECRET
◈ Ignored general context env var: LANG (defined in process)
◈ Loaded function hello-world.
◈ Functions server is listening on 45113
◈ Starting Netlify Dev with Astro

The function works fine like this: http://localhost:8888/.netlify/functions/hello-world
but http://localhost:8888/api/hello-world gives 404 not found
I tried adding the 200 response header as you suggested, but that also gave the 404.

#6

Previously I had some issues with Astro and Netlify CLI. I have just upgraded to netlify-cli/9.13.0 and those are non-existent now.

What version of Netlify CLI are you using?

#7

It’s the same as you have:
netlify --version
netlify-cli/9.13.0 linux-x64 node-v16.14.0

#8

Can you share the repository you are using?

#9

Sure, it’s GitHub - ddrake/netlify-feature-tour

#10

I cloned that repository.

When I run ntl dev and browse to http://localhost:8888/api/hello-world I see

hello world! I have a undefined

in the browser (undefined because I didn’t set the environment variable.) I don’t get a 404.

#11

Interesting, so the redirect is working for you locally. Maybe its an OS issue? I think you’re seeing ‘undefined’ because the message includes an environment variable that isn’t present in your build/deploy environment.

#12

I’m using mac OS.

(And yes, that is why I see undefined, as I mentioned in my previous post.)

#13

Sorry – missed that at first. Thanks – I have an old mac I can test with. I’ll see if that makes a difference. I’ll also try cloning my repo to a new directory and trying again, though it should be in sync with the github repo. If it turns out to be an OS issue, I’ll go ahead and report it. Thanks again!!

#14

I don’t think it’s an OS issue. I think it’s something to do with directory linking.
I cloned to a new directory and ran npm install then ntl dev then browsed to localhost:8888/api/hello-world and got “hello world! I have a undefined” – so the redirect worked – but then when I ran ntl link and selected the site id, then restarted with ntl dev, the redirect broke again.
localhost:8888/api/hello-world gives “404 not found” even though localhost:8888/.netlify/functions/hello-world gives me “hello world! I have a super secret”.

Edit: Since this thread was a bit long I summarized in a new post: Redirects fail in dev after 'ntl link' - #3 by troutshorty