App Proxy Configuration Not Automatically Updating - 404 Error Issue

Online Store and Theme Development
1

Issue Description:

I’m experiencing an issue with Shopify App Proxy configuration where the proxy settings are not automatically updating based on my shopify.app.toml file.

  • This is my toml file (proxy part):
    image

  • In the store here is what I see with the actual setup:

    image
    image1046×963 83.7 KB

Problem:

  1. When checking the App proxy settings in the Shopify admin panel (Store → App → Apps and sales channels → App proxy), the configuration doesn’t match what’s defined in my shopify.app.toml file.

  2. This mismatch results in 404 errors when trying to fetch data from my server through the app proxy.

Current Workarounds:

The proxy works correctly only after either:

  • Manually updating the proxy settings in the Shopify admin panel

  • Uninstalling and reinstalling the app

Question:

  1. How can I maintain backward compatibility for current users without requiring manual intervention or app reinstallation?

Any help or guidance would be greatly appreciated. Thank you!

1 Like
2

Hey @oribenez

The merchant customizing the app proxy subpath is actually expected behavior. This feature allows merchants to create more user-friendly URLs that appear to originate from their own domain, giving them control over how these paths appear to their customers. Merchants can toggle between different subpath prefixes (/apps, /a, /community, or /tools) and customize the subpath to better fit their store’s navigation structure. You can learn more about this in our documentation: Display dynamic store data with app proxies.

To handle this your app should be able to work dynamically with the path_prefix parameter sent. This ensures your app remains flexible and continues to work properly regardless of how merchants customize their proxy paths. Documentation here: Handling Proxy Requests

If you’re using the remix template, this guide may help as well App proxy

3

Hi @KyleG-Shopify

Thank you for your help.
I understand now the reasons that stands behind the app proxy mechanism.

The path_prefix is added by shopify and can be seen after the request has been proxied to my server. How can I know the path prefix before sending the request?

In other words, how can my theme-app-extension know which path_prefix to use, in order for my request to arrive to it’s destination (my backend server),
what is the URL that I should write in the fetch function, if I use the one that has been saved in the shopify.app.toml it is not reliable cause it can be changed by the user.

Can I get the path prefix of the app from admin api / or with liquid?(if “yes”, I can embed it later on my theme app extension)?

My setup: Express server.
Also want to mention I’ve looked up reading carefully all the docs files, maybe I’m missing something…

Thanks.

4

I’m still left with no answer for that. Does Shopify have time to fix this issue?

5

Hey! Sorry I missed your reply here. Another developer was recently struggling with this as well and wrote a guide outlining how they set this up. Does this help at all? Shopify App Proxy with Remix (Notes)

If not, can you share more details around how your theme extension is handling the request as well as the expected response vs the response you are getting when the prefix is changed?

6

Hi KyleG-Shopify,

Thank you for replying back, I’ve read the article you’ve shared with me and unfortunately it is not helping, cause it is missing the part that the user can change the proxy subpath or prefix.

here is an explanation of what is happening:
Theme app extension sends a request through Fetch API with my app name
https://demo-store.myshopify.com/<prefix>/<subpath>
Shopify will receive the request and pass it to the app server that matches that link.

Let’s dive deeper and be more specific, if my app defined in the shopify.app.toml file:

[app_proxy]
url = "https://compensation-permanent-walter-ty.trycloudflare.com"
subpath = "boxhead-bundles"
prefix = "apps"

then the app extension should send a request to the link:
https://demo-store.myshopify.com/apps/boxhead-bundles
that way Shopify proxy will know to pass the request to my app.

The problem is in the middle of this procedure:

  • What happens if the store owner changes the app proxy name? because as you said they can change it so it can fit to their shop design.

Let’s take an example:
if the store owner decided he wants to change the app proxy prefix to “apps/boxlegs-bundles” then if the theme app extension will send a request to https://demo-store.myshopify.com/apps/boxhead-bundles
it will fail with a 404 error cause the prefix has been changed and no one notified to the app that the link has changed or even worse there is no place in admin api that shares that path prefix so the app can retrieve it and update the link to the new prefixed link.

Thanks again for your kind help.

7

@KyleG-Shopify this has been requested for the first time in 2014, and it has been passed on to Shopify team multiple times. I don’t believe there is a solution for it yet, but it would be great to finally have something that addresses it.

@JoshHighland, wondering if you ever found a solution for this?

8

@KyleG-Shopify the problem here is we don’t have an endpoint to read into what the current app proxy for our app is. App proxies are usually used to make fetch requests back to the app server. So my theme extension code would be

const res = await fetch("/a/my-app-proxy/json",{});

Now if the merchant changes it from my-app-proxy to new-route, my theme extension is still making calls to my-app-proxy, which would result in a 404 and break my app. There’s no webhooks, no Liquid drop ins or any other alternative to read into what my current app proxy URL is.

This has been a known problem for a very long time, and as @nunof pointed out, since at least 2014.

What would be great is a liquid drop in for Theme Extensions to get access to the current app proxy route. Since the theme extension has the context of what app it’s running from, something along the lines of this would solve this problem:

const res = await fetch("/a/{{ config.app_proxy }}/json",{});

This ensures that doesn’t matter what the merchant throws in for the App Proxy route, the theme extension doesn’t break, if at all, because of a route change.

2 Likes
10

Thank you! I really appreciate this context. I tested in my own test store to get a more clear picture and ran in to similar issues as well.

I’m consulting with our teams internally here to see if we can get some clarity on this limitation as you have demonstrated it’s been happening for a long time.

3 Likes
11

Hey everyone,

Thanks again for pointing this out. Our team is looking in to fixing this gap in functionality. I don’t have a timeframe at this point, but I will keep you posted.

1 Like