Tunnel bf256c0ea7e2.ngrok.io not found

[RoaldKamman]

Hey everyone, 

Recently I chose to commit to learning how to create shopify apps by building one myself. 

I'm new to using ngrok and had no issues at first. But now when I run shopify serve and follow the URL I get to a blank screen with the error: 

Tunnel bf256c0ea7e2.ngrok.io not found

I have looked around and posted on their GitHub with an issue but there is no response. I have seen something about whitelisting because ngrok is supposed to generate a new URL every time it runs but I checked and the URL it keeps spinning up is the same constantly. It's also listed in my App setup url's correctly. 

Would really appreciate any help. I'm not ready to give up on my app idea. 

[Mothy]

If you are using the free version of ngrok the url they give you expires after 8 hours.

You'll need to spin up a new instance to get a new URL and then update webhooks/callback accordingly.

[RoaldKamman]

Hey Mothy,

Thanks for your response. 

What you're saying makes sense but how do I get the command: shopify serve to create a new url? It keeps giving me the same one. 

[RoaldKamman]

Where do I update webhooks/callback? 

Does ngrok pass that information to the shopify cli somehow? Or is this the App setup redirection URL's  What goes where?

I don't know why this is not explained anywhere. I have been looking for this information for days now. nrok and Shopify documentation either don't have it or I wasn't able to find it. 

I have no problem running a ngrok server and displaying a project on my local machine on the URL but I can't seem to do the same when running the Shopify serve command since the URL there stays static even after it asked me to update it once it remained the same. 

[RoaldKamman]

So: 

url shopify serve always gives me: https://bf256c0ea7e2.ngrok.io/auth?shop=myfirstteststore01.myshopify.com

1* I run a new ngrok server: https://c7e7d62d0d9f.ngrok.io 

2* I change the url in app setup to the new ngrok url

3* I run shopify serve within the app

4* It asks me if I want to update the url

5* I say yes

6* the url stays the same and I get tunnel https://bf256c0ea7e2.ngrok.io/auth?shop=myfirstteststore01.myshopify.com not found

shopify cli print: 

Windows PowerShell
Copyright (C) Microsoft Corporation. All rights reserved.

Try the new cross-platform PowerShell https://aka.ms/pscore6

PS C:\Users\rjkam\Desktop\GameVertion\GameVertionApp> cd gamevertion
PS C:\Users\rjkam\Desktop\GameVertion\GameVertionApp\gamevertion> shopify serve
√ ngrok tunnel running at https://bf256c0ea7e2.ngrok.io, with account [email protected]
√ .env saved to project root
? Do you want to update your application url? (You chose: yes)
√ Whitelist URLS updated in Partners Dashboard

* To install and start using your app, open this URL in your browser:
https://bf256c0ea7e2.ngrok.io/auth?shop=myfirstteststore01.myshopify.com

┏━━ Running server... ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
┃
┃ > [email protected] dev C:\Users\rjkam\Desktop\GameVertion\GameVertionApp\gamevertion
┃ > cross-env NODE_ENV=development nodemon ./server/index.js --watch ./server/index.js
┃
┃ [nodemon] 2.0.2
┃ [nodemon] to restart at any time, enter `rs`
┃ [nodemon] watching dir(s): server\index.js
┃ [nodemon] watching extensions: js,mjs,json
┃ [nodemon] starting `node ./server/index.js`
┃ > Ready on http://localhost:8081

[RoaldKamman]

this also resulted in this message in ngrok:

GET / 502 Bad Gateway

GET / 502 Bad Gateway

GET / 502 Bad Gateway

[RoaldKamman]

I tried the following next: 

1* I noticed that the port used by the shopify cli was 8081 so I ran a new server on that port using ngrok. command: ngrok http 8081

2* In the app setup URL's changed the url to the provided url from ngrok: https://a24f4c51acf5.ngrok.io and the callback to: https://a24f4c51acf5.ngrok.io/auth/callback

3* I removed the expired URL from all fields. 

4* restarted vscode and ran a new terminal shopify serve command. again selected yes to update URL here follows the output: 

PS C:\Users\rjkam\Desktop\GameVertion\GameVertionApp> cd gamevertion
PS C:\Users\rjkam\Desktop\GameVertion\GameVertionApp\gamevertion> shopify serve
√ ngrok tunnel running at https://bf256c0ea7e2.ngrok.io, with account [email protected]
√ .env saved to project root
? Do you want to update your application url? (You chose: yes)
√ Whitelist URLS updated in Partners Dashboard

* To install and start using your app, open this URL in your browser:
https://bf256c0ea7e2.ngrok.io/auth?shop=myfirstteststore01.myshopify.com

┏━━ Running server... ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
┃
┃ > [email protected] dev C:\Users\rjkam\Desktop\GameVertion\GameVertionApp\gamevertion
┃ > cross-env NODE_ENV=development nodemon ./server/index.js --watch ./server/index.js
┃
┃ [nodemon] 2.0.2
┃ [nodemon] to restart at any time, enter `rs`
┃ [nodemon] watching dir(s): server\index.js
┃ [nodemon] watching extensions: js,mjs,json
┃ [nodemon] starting `node ./server/index.js`
┃ > Ready on http://localhost:8081

[RoaldKamman]

ngrok output with that was: 

GET /auth/inline 400 Bad Request

GET /auth 200 OK

GET /auth/callback 403 Forbidden

GET / 302 Found

GET /auth/callback 403 Forbidden

[policenauts1]

Are you building a node or rails app with shopify CLI?

Not sure if this will be helpful, but when I was using shopify CLI and building a rails app, everything was really straightforward - it automatically updated the ngrok url after it expired and if the ngrok url changed, it would also prompt me if I wanted to automatically update the app's URL accordingly within the partner dashboard. 

[RoaldKamman]

Hey, @policenauts1 thank you for your response. 

I'm using Node and React on this project since I'm more familiar with them. 

I will try building a new app with rails to see if that works.

I'm not too familiar with ruby nor rails. But I'm committed to this app and making Shopify my long-term development niche so I will have to learn them anyway.  

But first I'm heading for the gym.

[RoaldKamman · Accepted solution]

I found a temporary workaround. 

For anyone else having this issue: https://youtu.be/Iw5Nu8zl9rc

[gebeto]

Just delete ~/.cache/shopify/sv/ngrok.pid file, it helps me.

rm ~/.cache/shopify/sv/ngrok.pid

[Chunky]

Thanks @gebeto  this is the quickest and easiest solution.

[linen]

It works!!Thank you for your solution!!! I deleted ngrok.pid ubder C:\Users\{UserName}\AppData\Local\shopify\sv

[buildpath]

@linen  thank you for making it easier for windows users to find and delete ngrok.pid so that ngrok starts making new tunnels again when we run shopify app serve in terminal in vscode 🙂

[den232]

On windows 10, I deleted the directory C:\Users\{UserName}\AppData\Local\shopify\sv 

I believe this worked.  Previously, I had removed/reinstalled CLI, ruby, and ngrok2 in my user folder, with no effect.  I also switched from the free ngrok to the $240/year version, all with no effect.

[CuttyBang]

The solution from @gebeto should be marked as the accepted answer. Works on MacOS & Windows.

[jasonmorgan]

This works confirmed on M1 Macbook Pro running Mac OS Big Sur by using...

rm ~/.cache/shopify/sv/ngrok.pid

in your terminal, as advised by gebeto above. Well done.

[sravans]

Thanks. This worked for me on Mac.

[ykhakshoor]

There seems to be a much simpler solution than manually updating the Ngrok tunnel as suggested here. Instead, try running: 

rm ~/.cache/shopify/sv/ngrok.pid

This will delete your cache. When running Shopify app serve, it will ask to update your URL. Select yes. @RoaldKamman 

[sagar_at_avyya]

@RoaldKamman Could you please change the "Accepted Solution" to this one: https://community.shopify.com/c/shopify-apis-and-sdks/tunnel-bf256c0ea7e2-ngrok-io-not-found/m-p/992...

Deleting the pid file works

rm ~/.cache/shopify/sv/ngrok.pid

[den232]

linux/windows version of the answer, (I'm on win 10) ... this from one of the comments at that youtube video.   Worked for me!

 Deleting the file located at "{UserName}\AppData\Local\shopify\sv" on Windows and "~/.cache/shopify/sv/ngrok.pid" on Linux is more efficient solution if anyone is experiencing this issue.

[Tony49]

What worked for me was simply running "shopify app tunnel stop", mentioned in one of the comments of this youtube video.

[wittybanter]

$ shopify login --store=[STORE]

[Virtualstone1]

Tried with the above procedures, still can't solve. Getting the same error

[DeveloperDave]

Free ngrok tunnels expire, so you'll need to restart your tunnel. Shopify doesn't make it easy to take control of the tunnel yourself, so usually the accepted solution won't work. You'll need to stop the tunnel that shopify-cli thinks is running before serving.

I now include this in all my start scripts:

$> shopify app tunnel stop && shopify app serve

Be sure to select "yes" to update the application url.

[charcole]

I've been having this problem as well. I learned that free ngrok urls expire, so I used `ngrok http 8081` to create a new one. and I changed .evn HOST to the new url that gave me. Didn't work. So I deleted ngrok.pid as answered above. Now I get "ngrok tunnel stopped" every time I try `shopify app serve` (the tunnel is running in another tab and didn't stop). Am I missing a step?

edit

edit: realized my mistake, I am not supposed to be running my own tunnel in another tab.

[n8pickle]

I recently just had this issue and all I had to do was restart the tunnel and update the url

shopify app tunnel stop
shopify app tunnel start

while starting the app with shopify app serve I selected to update the url.

This fixed it for me