App proxy showing 404 page

nerdymind
Visitor
1 0 0

We're building an app for a client and having issues setting up the App Proxy. We've added to our apps extensions section (see screenshot) but when accessing the site via the proxy we're just seeing a 404 response (as if it's accessing the Shopify store directly as apposed to hitting the Proxy).

 

If I update the proxy to use ngrok so I can see the traffic there are no requests being made, which makes me think Shopify is bypassing the proxy entirely. I've found a bunch of posts with similar issues but no resolution:

 

https://community.shopify.com/c/Shopify-APIs-SDKs/Help-needed-with-App-Proxy-not-working/td-p/522693

https://community.shopify.com/c/Shopify-APIs-SDKs/Shopify-app-proxy-never-working-for-me/td-p/353453

https://community.shopify.com/c/Shopify-APIs-SDKs/App-Proxy-not-working/td-p/295985

 

I'm hoping I can break the chain of unresolved issues on this!

 

Here some screenshots of the Proxy setup, the app response (when accessing the Proxy URL directly), the response received when accessing the Proxy URL via shopify (e.g. store.myshopify.com/apps/gg-product-options) and the response returned the from the store:

Proxy setupProxy setupProxy URL responseProxy URL responseProxy through myshopify.com URLProxy through myshopify.com URLProxy through myshopify.com URL responseProxy through myshopify.com URL response

 

Finally, just for testing, I've completely opened up that URL on the app side to accept all requests/headers/etc. You can see the results of the test by accessing this URL directly: https://ridegg.nerdstaging.com/proxy (as of 3/3/2020, won't be valid once I get this working). Once I'm able to get the proxy working correctly I'll add validation in, but for now, I kept it open just to rule it out as an issue.

 

Any and all help is greatly appreciated!!

Replies 13 (13)

SBD_
Shopify Staff
1829 269 406

Hey @nerdymind,

 

In this case it appears the proxy paths are getting confused on our end. For example, /apps/gg-product-options-1 works (note the -1)

This might be a result of installing two apps that try to register the same proxy (maybe the dev app).

I've raised this internally. In the mean time, try uninstalling both apps, changing the proxy paths and reinstalling.

Scott | Developer Advocate @ Shopify 

pjjeev
Visitor
1 0 3

Is there any update on this issue ? I am also facing the same error of 404. The proxy does not call the URL provided.

future_friend
Tourist
5 0 1

I am thirding this post. Help!

future_friend
Tourist
5 0 1

I don't know if it'll work for others, but I simply had to just delete the proxy settings and reinstall them. I think I entered them wrong the first time and I couldn't get Shopify to reset until I did so.

josephmcdermott
Visitor
3 0 0

Just in case it helps some people, as I was banging my head against the wall on this. I was using a local dev environment to test the Shopify App signup and App page processes, which work fine as the requests come from directly your browser.

The app-proxy, on the other hand, involves Shopify's backend (not your browser) making an HTTP request to your Proxy URL to download the contents of your page.

In my case, the Proxy URL I was using was not publicly accessible, so once I switched to use Ngrok it worked fine.

KarimTarek
Shopify Partner
34 0 10

For anyone that is still getting a 403/404:

  1. Going to the proxy url in the browser should help you understand what's going on, in my case – getting 403 – I needed to add this line 'config.hosts << "dev-store.myshopify.com"' to '/config/environments/development.rb' in Rails
  2. Try different names for the "Subpath" if you are getting 404, the name that worked for me is 'xoxo-1' 🙂 hopefully I can change it soon, but for now it's working!

In my case what helped – before I try the full proxy URL in the browser – was adding a '.catch' to the JS request:

axios.get("/apps/xoxo-1")
    .then((res) => { console.log('API response to proxy request: ', res) })
    .catch((error) => {
      if (error.response) {
        console.log(error.response.data);
        console.log(error.response.status);
        console.log(error.response.headers);
      } else if (error.request) {
        console.log(error.request);
      } else {
        console.log('Error', error.message);
      }
    });

I hope that help!

MarcoDo
Shopify Partner
19 4 8

Still have the same problem.

Does somebody have a solution? Trying different subpaths did not help me.

Not applicable

Thanks @future_friend , that worked.

Editing proxy settings seems like its working but it doesnt really, to apply any changes you must remove the proxy and add it again.

DiscountNinja
Shopify Partner
104 0 65

In some cases you may see a 404 when the following has happened:

- You have configured the proxy settings of your app to e.g. /apps/test

- You install the app on a development store

- You change the proxy settings of your app to e.g. /apps/my-test

- You test the app on the same development store you had installed it on earlier

 

It is important to note that the proxy settings are NOT updated on stores that installed your app prior to the change in proxy settings.

You can manually change the settings by going to the Apps section in the store and clicking "About", then manually changing the URL of the proxy using the "Customize URL" button:

DiscountNinja_0-1627375627367.png

I am not aware of options to do this programmatically. 

Bart Coppens | Limoni Apps | Building apps for Shopify since 2016
anthdng
Visitor
2 0 1

This seems tricky but it works for me. Thanks @DiscountNinja 

Edward_Wong2
Shopify Partner
9 0 7

Never aware there is customize URL under Apps section. Thanks for your help. 

Hugo92
Visitor
2 0 0

Any update for this? I have exactly such a problem.

Charles_Roberts
Shopify Partner
44 0 8

OK. Here is the solution. 100% guaranteed: 😊

 

Go to:

 

[app] -> configuration -> App proxy

 

shopify-app-settings-1.png

 

Refresh the configuration page.

 

Then, try and make a request to your admin app, using the form in your Theme App Extension or online store app.

Of course it will fail, but it seems to clear the cache.

 

Then go back to:

 

[app] -> configuration -> App proxy

 

And set up your App Proxy again.

 

This time it will work. 👌