Why am I still getting a 404 error in my App Proxy post request?

Shopify Apps
1

I know there are multiple threads about this topic, but I have tried all the suggestions and nothing seems to work. So here I am.

I am trying to communicate to an App Proxy from a JS script in a front end page. When I do a Post request via Fetch I get a 404 error. I can access the proxy script on its own without problem.

I don’t know why this is failing. I’m trying to access the proxy app without using a router, so I configured the App proxy with the actual url of the file that will do the processing, as shown below. Can this be the problem? I welcome any suggestions.

Thank you!

This is my setup:

App proxy set Up:

JS in Shopify’s front end page:

const proxy_url = 'https://my_store.my-shopify.com/apps/maker';

fetch(proxy_url, requestOptions)
    .then(async response => {
        const isJson = response.headers.get('content-type')?.includes('application/json');
        const data = isJson && await response.json();

        // check for error response
        if (!response.ok) {
            // get error message from body or default to response status
            const error = (data && data.message) || response.status;
            console.error('There was a response error:', error);
        }

        // element.innerHTML = data.id;
    })
    .catch(error => {
        // element.parentElement.innerHTML = `Error: ${error}`;
        console.error('There was an HTTP error:', error);
    });

Proxy App File: https://aaa.ngrok.io/my_app/maker/new_space.php


When I access the front end page, I see this error:

```javascript
POST https://my_store.my-shopify.com/apps/maker
[HTTP/2 404 Not Found 305ms]
1 Like
2

I’m answering my question for whomever has a similar issue.

My problem was indicating a specific file in the PROXY URL field of the Proxy App configuration:

I had :

I created a route on my app to the specific file mentioned above (new_space.php), so when a request is made to the folder ‘maker’ the file is invoked.

3

@mauricioarango , you save my life! It took me hours to solve it. I did follow this video: https://www.youtube.com/results?search_query=how+to+use+app+proxy+shopify

And, in the video I saw the proxy field is: " https://aaa.ngrok.io/api"

It was a waist of time following it.

After changing the proxy url to "https://aaa.ngrok.io/subpath", I have returned after death!