Getting 404 error when calling Shopify App Proxy endpoint

Other Questions Shopify
1

I’m having trouble with my Shopify app proxy setup. I created an app using Shopify CLI and set up the proxy configuration like this:

Prefix: utilities  
Subpath: api
Proxy: https://myapp.ngrok.io/api

I’m trying to make an AJAX call from my theme file:

const request = new XMLHttpRequest();
request.onreadystatechange = function() {
    if (this.readyState === 4 && this.status === 200) {
        const data = request.responseText;
        console.log("Success: " + data);
    }
};
request.open("GET", "/utilities/api/data", true);
request.send();

When I test the direct URL in my browser, it works fine and returns the expected response. However, when I try to access it through the proxy from my Shopify store, I keep getting a 404 error.

I’ve tried different prefix combinations and even removed other apps to avoid conflicts, but nothing seems to work. Has anyone experienced similar issues with app proxy configuration?

2

I ran into something similar a few months back and the issue turned out to be with the proxy URL configuration in my app settings. Even though your direct ngrok URL works, there might be a mismatch between what you have configured in the Partner Dashboard and what your actual endpoint expects. Double check that your app proxy settings in the Partner Dashboard match exactly what you posted, and make sure your backend route is actually listening on /api/data not just /api. Also worth checking if your ngrok tunnel is still active and pointing to the right local port. Sometimes ngrok URLs expire or change if you restart the tunnel. One thing that helped me debug was temporarily adding some logging on the backend to see if requests are even reaching your server when called through the proxy versus direct access.

3

had this exact problem last week! turns out i was missing the full domain in my proxy setup. instead of just https://myapp.ngrok.io/api try using the complete path like https://myapp.ngrok.io/utilities/api. also check if your shopify store url is properly whitelisted in your app settings - sometimes the 404 happens when shopify cant verify the proxy destination.

4

This could be related to the verification parameters that Shopify sends with proxy requests. Your backend needs to validate the incoming request signature using your app’s secret key; otherwise, Shopify will return a 404 even if the endpoint exists. Make sure your /api/data route is properly handling the signature parameter and validating it against the query string using HMAC-SHA256. I encountered this when my validation logic was failing silently - the direct ngrok access worked because it bypassed Shopify’s proxy validation entirely. Also verify that your app is actually installed on the store you’re testing from, since uninstalled apps will throw 404s on proxy requests regardless of configuration.

5

Check your HTTP method handling on the backend server. I faced a similar 404 issue where my proxy endpoint was only configured to accept POST requests but my frontend was sending GET requests through the proxy. Even though the direct ngrok URL appeared to work in the browser (which sends GET by default), the actual proxy routing was failing because of method mismatch. Also ensure your server is responding with proper CORS headers when accessed through the Shopify proxy, as the request context changes when it goes through Shopify’s infrastructure versus direct access. Try testing with a simple endpoint that just returns a static response first to isolate whether the issue is with routing or with your specific data endpoint logic.