Exposing localhost to the internet via tunneling (using ngrok): HTTP error 400: bad request; invalid hostname

Question

From previous versions of the question, there is this: Browse website with ip address rather than localhost, which outlines pretty much what I've done so far...I've got the local IP working. Then I found ngrok, and apparently I don't need to connect via the IP.

---

What I am trying to do is expose my website running on localhost to the internet. I found a tool that will do this: ngrok.

Running the website in visual studio, the website starts up on localhost/port#. I run the command "ngrok http port#" in the command line. Everything seems to start up fine. I generate a couple of URLs, and the ngrok inspection url (localhost:4040) works.

The only problem is that when I go to the generated URLs, I get an HTTP error 400: bad request invalid hostname. This is a different error than when I run "ngrok http wrongport#", which is a host not found error...so I think something good is happening. I just can't tell what...

Is there a step I am missing in exposing my site to the internet via the tunneling service? If there is, I can't find it in the ngrok documentation.

Solution 1

Troubleshot this issue with ngrok. In the words of inconshrevable, some applications get angry when they see a different host header than expected.

Running the following command should fix the problem:

ngrok http [port] -host-header="localhost:[port]"

Depending on the version, you may also want to try:

ngrok http [port] --host-header="localhost:[port]"

Solution 2

Following command will fix the issue

ngrok http -host-header=localhost 8080

Solution 3

This didn't work for me. you could do the following:

For IIS Express

In VS 2015: Go to the .vs\config\applicationhost.config folder in your project

In VS 2013 and earlier: Go to %USERPROFILE%\My Documents\IISExpress\config\applicationhost.config

Find the binding that says:

<binding protocol="http" bindingInformation="*:5219:localhost" />

For me it was a project running on port 5219

change it to

  <binding protocol="http" bindingInformation="*:5219:" />

IIS Express will now accept all incoming connections on that port.

Disadvantage: you need to run IIS Express as admin.

or you could rewrite the host header in Ngrok:

ngrok.exe http -host-header=rewrite localhost:5219

Solution 4

For https this works:

ngrok http https://localhost:<PORT> -host-header="localhost:<PORT>"

Solution 5

The simplest thing for me was using iisexpress-proxy + ngrok.

First I install iisexpress-proxy globally with npm

npm install -g iisexpress-proxy

Then I proxy my localhost with it. Say for instance my site is running on 3003.

iisexpress-proxy 3003 to 12345 where 12345 is the new http port I want to proxy to.

Then I can run ngrok on it.

./ngrok.exe http 12345

It just works! 😃

But I think it works only with http. Right now I don't use https to test, but even if it works, usually it's a lot of work as always.

View more solutions

Comments

[umunBeing]

The whole process is summarized here. Maybe this could help.

[sobelito]

Thanks. I previously followed the instructions from Devin Rader detailed here, but this now makes this way easier. twilio.com/blog/2014/03/…

[trevorc]

This solution also works if you are having trouble adding another binding to the applicationHost.config (vs2015/iisexpress). You don't need to add one just use this answer. Finally, if you paid for a custom domain to avoid changing the address every time just add -subdomain=mysubdomain to above answer.

[skjoshi]

It worked. Just in case of using Social Authentication in asp.net 5 mvc 6, somehow, the return URL is becoming localhost/signin-facebook instead of using my subdomain. Any idea how to fix that?

[Chris]

@Sanju Not sure; it's been a year since I've used Ngrok

[Neil Laslett]

Can't upvote this enough! For all the complex and buggy instructions out there to hack your IISExpress bindings and network settings, this cuts through it all like a hot knife through butter.

[Jsinh]

When local is on https instead of http then this variation of above works: ngrok http https://localhost:44362 -host-header="localhost:44362"

[Pirate]

wow, I wasted almost 2 hours figure this one out. my only problem was I was adding https in -host-header. like this: ngrok http https://localhost:44392 -host-header="https://localhost:44392" removing https:// from -host-header parameter solved my problem. Thanks

[Mark G]

If using ASP.NET Core you should also comment out app.UseHttpsRedirection() in your Startup class to avoid a 307 Temporary Redirect.

[Tyeth]

This is the correct way to rewrite header in ngrok. None of the other answers worked. Already got IIS set to any hostname, but ngrok returned "hostname invalid" when using -host-header="localhost:8892" however this rewrite version worked immediately.

[M1sterPl0w]

For some reason the accepted answer didn't work for me, this solution did. Thanks!

[lucky.expert]

This used to work for me, but appears you must have Pro or Enterprise version to get host header rewrite capabilities, at least that is the error that was returned to me today

[LoLo]

thanks, it still works in 2022. just as --host-header=whatever

[Chris]

@LoLo Thanks. And yeah: I'd hold off on spending money pre-working prototype and continue to problem solve if you can't get it working. There might be something else wrong.

[brianc]

didn't work for me