I have this site: readlist.jim-nielsen.com (code is on github).
The purpose of the site is to grab the HTML of any given URL and try to parse it for reading.
Because of CORS, I can’t do a client-side fetch to any URL on the web.
Instead, I leverage Netlify’s rewrites functionality to essentially fetch the HTML for any given URL and hand it back to me on the client-side.
To do this, my netlify.toml
file has this rule in it:
[[redirects]]
from = "/cors-proxy/*"
to = ":splat"
status = 200
force = true
So, from my domain readlists.jim-nielsen.com
, if I do:
fetch("https://theverge.com/path/to/article")
I’ll get a CORS issue. But if I hit my /cors-proxy
path then pass the URL, Netlify’s redirects/rewrites engine will handle the fetching of that document for me without a CORS issue:
fetch("/cors-proxy/https://theverge.com/path/to/article")
At least that’s the idea.
If I get my local server up and running with netlify dev
and I hit localhost:8888/cors-proxy/URL
, I see the response I would expect:
I even see that request show up in the log for netlify dev
But when I push my code and it deploys at my url readlists.jim-nielsen.com
, the exact same request returns a 500.
Trying a fetch
request in the browser shows a 500 as well.
But this isn’t a problem on local development. I get a 200 locally. It only becomes a 500 when this goes live.
Why is that? What am I missing?