10

I'm pretty new in Ngrok. I always got warning about abuse. It's just annoying, that I wanted to test measure of my site but the endpoint it's get into the browser warning.

How to send an [ngrok-skip-browser-warning] request header to bypass this warning?

Browser Warning

Noobie Cooder
  • 141
  • 1
  • 1
  • 7
  • 2
    What browser are you using? For Chrome, there are plugins that allow you to set headers. I haven't used this one so I can't vouch for it, but it seems like it should do the trick: https://chrome.google.com/webstore/detail/modheader/idgpnmonknjnojddfkpgkljpfnnfcklj?hl=en – Russ Savage Jul 18 '22 at 17:11

2 Answers2

12

Set and send an [ngrok-skip-browser-warning] request header with any value

This is what you have to do to bypass the browser warning: You have to include the request header ngrok-skip-browser-warning with any value in the request header.
The exact syntax of what is to be included depends on the type of the api call you're making.
For instance for a fetch request in javascript, this is what has to be included to bypass the warning:

fetch(url, {
      method: "get",
      headers: new Headers({
        "ngrok-skip-browser-warning": "69420",
      }),
    })
      .then((response) => response.json())
      .then((data) => console.log(data))
      .catch((err) => console.log(err));
Deb
  • 355
  • 2
  • 9
  • 1
    I want to add my URL as webhook in Facebook. But we cann't configure the custom header there. Any other solution? – Ankur Raiyani Nov 15 '22 at 09:29
  • @AnkurRaiyani if you are able to run ngrok *behind a proxy*, check out my answer. In your case, you need the simplest VM with the static IP, which will proxy the traffic to ngrok. – igops Jan 03 '23 at 14:36
3

TL;DR; For those still curious about how to automate a workaround, I've created a docker image which runs a simple HTTPS proxy locally and adds ngrok-skip-browser-warning header to each request.

Run:

$ docker run -d --rm \
  -p 8443:443 \
  -p 8080:80 \
  -e NGROK_HOST=https://your-ngrok-domain.ngrok.io \
  igops/ngrok-skip-browser-warning:latest

From now, use https://ngrok.localhost.direct:8443 as your API webroot.

E.g., you were told to call GET https://your-ngrok-domain.ngrok.io/api/v1/whatever. Now you just call GET https://ngrok.localhost.direct:8443/api/v1/whatever instead, and get the response without the warning page!

*.localhost.direct is a wildcard record of the public DNS pointing to 127.0.0.1.

Read more

The main idea under the hood is running Nginx with the following config:

server {
    server_name localhost ngrok.localhost.direct;

    listen 80;
    listen 443 ssl;

    ssl_certificate /etc/nginx/certs/localhost.direct.crt;
    ssl_certificate_key /etc/nginx/certs/localhost.direct.key;

    location / {
        # regular forwarding headers
        proxy_set_header X-Forwarded-For $proxy_protocol_addr;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_set_header Host your-ngrok-domain.ngrok.io;

        # this line does the actual trick
        proxy_set_header ngrok-skip-browser-warning 1;

        # forward!
        proxy_pass https://your-ngrok-domain.ngrok.io;
    }
}

Feel free to use.

igops
  • 475
  • 3
  • 7