CORS error in app-proxy calls

[SzuJanLin]

First of all, thank you, Kinngh for creating this amazing repo.

I've followed the example from the youtube video (https://www.youtube.com/watch?v=JZMiVKcdar4&t=174s) on setting up App Proxy. I have my proxy set up exactly like the video that's "https://.myshopify.com/apps/express-proxy/json". If I open the URL on a chrome tab it keeps giving me back a Ngrok 6024 Error. It is basically an error from ngrok to remind you that this is a website served through ngrok.

I also tried to use a fetch GET request with "ngrok-skip-browser-warning" header but the responding to me with a CORS error. I get stuck on the page forever or if I use a fetch request to "https://.myshopify.com/apps/express-proxy/json" it gives me a CORS error.

However, I was able to get the responses from proxy routes when I do a fetch on "http://127.0.0.1:9292//apps/express-proxy/json" in the theme app extension preview page

I want it to work with my theme app extension and to test it through .myshopify.com/apps/express-proxy not https/127.0.0.1:9292/ . I appreciate any kind of help.

Please let me know if you need any specifications or details.

[kinngh]

I'd actually like to see your setup. Can you send me screenshots of

• App partner dashboard but only the app proxy section
• Code that's making the fetch request
• App proxy code in your server

[SzuJanLin]

This is just a simple fetch code to get data

If i use var base_url = "http://127.0.0.1:9292/apps/express-proxy/";
It would work.

I run my theme app extension with shopify app dev -- --tunnel-url "https://a953-66-219-195-186.ngrok.io:5173"

[kinngh]

Ok you're not supposed to make a call with your base url. Just run fetch(/apps/express-proxy/json) with ngrok bypass headers and you'll be fine. If it still doesn't work, it's probably because of using CLI3 with this is going to cause a number of errors so just build your extension as a custom liquid block and then pass it in your actual extension + deploy.

[SzuJanLin]

Thanks kinngh, it worked with custom liquid block with your instruction. I just had to put in an extra 'ngrok-skip-browser-warning' in my request header so ngrok warning is not showing up.