After new Dev platform update 3.84 proxy doesn't work anymore

Dev Platform
1

I’m reading a lot of other issues with the new release and proxy. I had a beautiful proxy working for our app and 2 apps in development with proxy. But right now nothing works with proxies. I would love some help because I don’t know what to do. I have tried many things from other threads but without luck.

1 Like
2

Hi Benjamin,

There was a known issue with App Proxies returning 404 errors after migrating apps to the new Dev Dashboard.

Our developers were aware of this and have since resolved this behaviour, however the fix does require clearing old proxy values and re-adding them in a new deployment, with the following steps:

  1. Remove the app_proxy config from your app.toml
  2. shopify app deploy
  3. Add it back
  4. shopify app deploy again

More details can be found in the following thread:

3

Hey @Kaalo-Shopify thanks for the reply. I have done this several times but it still doesn’t work. Our app has been deployed to the dev platform and also on the clients server. We have not changed anything to the proxy.

It still gives a 404 and in the dev console the url is https://ebook-authorized-story-ant.trycloudflare.com/ for example while I have use the clients url where the app has been deployed.

The things I have done/checked:

  • shopify.app.toml settings have been thoroughly checked
  • proxy has been removed from shopify.app.toml → deploy app → added back → deployed
  • app has been removed and installed again
5

Hi Benjamin,

I initially thought this might have been related to the use of the Shopify app dev command replacing the App URLs with the temporary local tunnel URL while testing the app, as discussed in the Shopify.dev documentation below:

However, this is specificallly the App URL that is replaced with the temporary tunnel URL, not the Proxy URL as you are experiencing.

For us to be able to look into the Proxy URL being set to a tunnel URL incorrectly, and returning a 404 error when making a proxy request, we will need to look into this further with specific examples.

I would recommend reaching out to our support team directly via the Shopify Help Center, with some more context specific to your partner account and app, and our Developer Support Team can definitely help look into this further.

When reaching out please be sure to have the following context available for efficient troubleshooting.

  • The name of the Partner Organization and App
  • The proxy settings you have set in the configuration and are expecting to be used, including the Proxy Path and Subpath, and the Proxy URL
  • A recording of a HAR file showing the proxy requests being made in a web browser.

Here are some additional details on how to record a HAR file for the most popular web browsers.

Note: HAR files can contain login information/credentials and session cookies. For data privacy purposes, please avoid entering/recording personal details such as passwords and credit card information. It would be best to record the HAR via an Incognito window.

Chrome

  1. Open the Developer Tools from the menu (Menu > More Tools > Developer tools), or by pressing Ctrl+Shift+C on your keyboard.
  2. Click on the Network tab.
  3. Look for a round button at the top-left of the Network tab. Make sure it is red. If it is grey, click it once to start recording.
  4. Check the box next to Preserve log.
  5. Use the clear button (a circle with a diagonal line through it) right before trying to reproduce the issue to remove any unnecessary information.
  6. Reproduce the issue (E.g. load/refresh the page that has errors, or perform the action that has errors).
  7. Save the capture by right-clicking on the grid and choosing Save as HAR with Content. Alternatively, you can click the export/save button (downward arrow with a line underneath).

Safari

  1. In Safari, go to the page where the HTTP(s) URL Sequence needs to be monitored.
  2. Enable Developers Tool by going to Safari > Preferences > Advance > Click Show Develop menu in menu bar
  3. In the menu bar at the top, click Develop and select Show Web Inspector.
  4. Click the Resources tab and enable Preserve Logs.
  5. Go to the Network tab.
  6. Reproduce the issue (E.g. load/refresh the page that has errors, or perform the action that has errors).
  7. After successfully performing the activity, lick the Export icon and save the HAR file.

Firefox

  1. In Firefox, go to the page where the issue is occurring.
  2. Click the Firefox menu available at the top-right of your browser window and select Web Developer → Network, or simply press the F12 button. The Developer Tools window opens as a docked panel at the side or bottom of Firefox.
  3. Click the Network tab.
  4. Click on Network Settings and enable Persist Logs.
  5. Now refresh the page and perform the activity that needs to be recorded i.e. the activity that produces the error.
  6. After successfully performing the activity, right-click on any row of the activity pane and select Save all as HAR or click the Export HAR icon and select Save all as HAR to download the HAR file.

Edge

  1. Open Microsoft Edge and navigate to the page where the issue is occurring. Note: This is tab and window dependent, so if the issue occurs in a new tab or window, the HAR recording needs to be done in that new tab or window.
  2. Click the horizontal ellipsis menu button and select More Tools, then click Developer Tools.
  3. Click the Network tab, and then click the Record button in the upper left corner of the tab and verify that it is red, if it is grey, click it to start recording.
  4. Check the box Preserve Log.
  5. Click the Clear button to clear out any existing logs from the Network tab. Note: Do not close the Developer Tools panel. This will end recording and the HAR file will be lost.
  6. Reproduce the issue while the network requests are being recorded.
  7. Once you have reproduced the issue fully, right-click anywhere on the grid of network requests and choose Save as HAR with Content, and save the file to the computer.
6

Hi Benjamin,

I’ve looked into this a bit further and I think this might actually be potentially expected behaviour, based on what I mentioned above with the App URL being replaced with a temporary tunnel URL when running the app dev command.

I have confirmed with our team internally that the new app dev command functionality does also include Proxy URLs in the url’s replaced with a temporary tunnel url, when the app config has the automatically_update_urls_on_dev flag set to true, or when it’s not specified in the config toml file, the Shopify CLI will prompt you to ask if it should replace the URLs or not.

More info here:

I would recommend confirming that your app toml configuration has automatically_update_urls_on_dev set to false and that you clear your last dev environment with the shopify app dev clean command to remove any temporary urls that were set this way.

If the behaviour is still happening on your development store after clearing this and ensuring the URL’s aren’t automatically updated when running app dev, or if it is happening on a production store, not a development store, then I would still recommend reaching out to Shopify Support as mentioned above and we can help look into it further.

8

Hey @Kaalo-Shopify Thank you for all the help. After trying everything you described, I eventually contacted Shopify Support. While going through each step with them, I realized that one of my other apps using a proxy was working fine. That made me suspect it had to be a strange issue with my proxy path, even though I had already removed and re-added it in my toml several times.

I decided to change both the function and the proxy path to a completely new one (proxy → productproxy), redeployed it in the Dev Portal and on the server—and voilà, it worked again.

Looking back, it seems very likely this was just a quirky bug in the portal where the old proxy subpath was no longer being recognized. It’s worth noting this was also the very first of my three apps with a proxy that I deployed in the old Dev Portal. The other two, which still worked, were deployed later after the new release (3.84.1)