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 r.j.kamman@gmail.com
√ .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... ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
┃
┃ > shopify-node-app@1.0.0 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 r.j.kamman@gmail.com
√ .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... ━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━
┃
┃ > shopify-node-app@1.0.0 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

[wittybanter]

$ shopify login --store=[STORE]

[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.

[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.

[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