Re: "Have Shopify automatically update your app's URL in order to create a preview experience?&

Solved

"Have Shopify automatically update your app's URL in order to create a preview experience?"

JorensM
Shopify Partner
6 0 3

Hello, I wanted to know what this message means when running 'npm run dev' - "Have Shopify automatically update your app's URL in order to create a preview experience?"

Accepted Solution (1)

Liam
Shopify Staff
2873 312 820

This is an accepted solution.

Hi JorensM,

 

If you choose to have Shopify automatically update your app's URL, the Shopify CLI will update the APP_URL environment variable in your development environment to match the URL of the preview experience. This allows your app to make requests to the development store and interact with the preview experience.

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

View solution in original post

Replies 13 (13)

Liam
Shopify Staff
2873 312 820

This is an accepted solution.

Hi JorensM,

 

If you choose to have Shopify automatically update your app's URL, the Shopify CLI will update the APP_URL environment variable in your development environment to match the URL of the preview experience. This allows your app to make requests to the development store and interact with the preview experience.

 

Hope this helps!

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

JorensM
Shopify Partner
6 0 3

Thanks!

arnav98
Shopify Partner
26 1 7

Hi Liam,

 

But what if I select the option to not update the URL every time I do "npm run dev", what will happen?

Why does this option exist? For what reasons could be it feasible to update the URL every time in some case and not update it for others?

 

Thanks!

Liam
Shopify Staff
2873 312 820

Hi Arnav98,

 

If you choose not to have Shopify update the app URL when running `npm run dev`, your app's URL in your Shopify Partner Dashboard will not be automatically updated to match the local development server URL.

 

This means that if you try to preview your app in a development store, it won't load your local development version. Instead, it'll try to load your app from the URL that's currently set in your Shopify Partner Dashboard, which could be a production URL or a different development URL. This could make it more difficult to test changes you're making in your local development environment.

 

Whether or not you want Shopify to update the URL might depend what you're currently doing, for example if there's multiple developers working on the same app at the same time, each with their own local development environment, you'd likely choose to not update the URL. Different developers constantly updating the app's URL could lead to confusion, as the URL in the Shopify Partner Dashboard would keep changing to different localhost URLs. 

 

Also, certain features of your app, such as webhooks or APIs, might require a publicly accessible URL, and won't work with a localhost URL. Again you might prefer to manually set the app's URL to a tunneling service like ngrok, and wouldn't want the URL to update automatically when running your development server. 

 

Hope this makes it a bit clearer 🙂 

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

arnav98
Shopify Partner
26 1 7

Hi Liam,

 

Thanks for your quick response and detailed explanation. I am facing an issue though, whenever I do not update the URL and run the application locally, it keeps the URLs in the partner account intact but then updates the cloudflare URL in VSCode terminal to a new URL, which again results into me not being able to view the app in the admin.

arnav98
Shopify Partner
26 1 7

Because I want to generate OAuth token on backend but I am not able to since the URL keeps on changing

Liam
Shopify Staff
2873 312 820

Is running the CLI command causing the cloudflare URL to update?

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

arnav98
Shopify Partner
26 1 7

No, it was a misunderstanding on my part. Thanks!

Liam
Shopify Staff
2873 312 820

No worries! Glad it's working now 🙂 

Liam | Developer Advocate @ Shopify 
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit Shopify.dev or the Shopify Web Design and Development Blog

colton007
Shopify Partner
2 0 1

Hi, I have an embedded app and I want it to call my public api route to get some data about the store the app is running inside.

 

I need to know the application_url to send a request to my public API route.

 

But in dev this url changes on every deploy (run npm dev) and in prod it will be a different url.

 

How do I know what the application_url is from my embedded app's javascript (runs in the browser) or the related .liquid file so I can create the API request in the browser?

Dan140
Shopify Partner
3 0 0

@Liam is there a link to a suggested workflow for multiple developers to work on an app locally with a preview experience?

anhdd-kuro-159
Shopify Partner
14 0 6

Does this update to the app's URL affect the production ?

In other words, will all the stores that have the app installed now reference the new URL?

arnav98
Shopify Partner
26 1 7

It will update the URLs in whichever app the code is being pointed to while running the dev command. So if you are running "npm run dev" while pointing to your production app, it will update the URLs in that app.