Configure ngrok's CORS headers

ngrok
wildeyes picture wildeyes · Oct 30, 2016 · Viewed 19.6k times · Source

I am running a local webserver, which runs an XHR request to an ngrok server, also run from my PC.

I'm getting XMLHttpRequest cannot load http://foo.ngrok.io/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:3000' is therefore not allowed access.

It appears the ngrok FAQ mentions CORS headers, but only in relation to basic auth - it doesn't mention how to set the headers so I could test my app in development.

How do I change ngrok's CORS options to allow loading requests from localhost?

Answer

Dave Kiss picture Dave Kiss · Aug 16, 2018

I just stumbled across this issue today and was able to resolve it by starting ngrok and including the -host-header flag.

ngrok http -host-header=rewrite 3000

From the docs:

Use the -host-header switch to rewrite incoming HTTP requests.

If rewrite is specified, the Host header will be rewritten to match the hostname portion of the forwarding address.

Related questions

How to generate fixed url with ngrok

I am working on facebook messenger. Facebook app only accept one url for webhook but ngrock is generating new URL every time. Now I am unable to test my app because of webhook URL changed.

Read More
Invalid Host Header when ngrok tries to connect to React dev server

I'm trying to test my React application on a mobile device. I'm using ngrok to make my local server available to other devices and have gotten this working with a variety of other applications. However, when I try to connect …

Read More
ngrok command not found

I'm trying to install ngrok (which I've been using for a while on Windows with no issues) on my 1 week old yosemite and these are the steps I've followed so far. Downloaded ngrok from here https://ngrok.com/download. Unziped …

Read More