Why is 'UseAuthenticatedFetch' not working in my hosted custom app?

[sel_jmc]

I am seeing some issues when I host a version of my custom shopify app to test. It works absolutely fine when ran locally using 'npm run dev' command but when I build and host the app I am running into issues.

I am able to install the hosted version of the app on a development store and the front end displays without issues. Also the store appears in the 'installed stores' list. But, when I go to use anything that uses the 'useAuthenticatedFetch' call for the api, the service redirects to the top level auth endpoint with the shop as undefined. 

I am also getting "SyntaxError: Unexpected token '<', "<!DOCTYPE "... is not valid JSON" being returned from one of the oauth javascript files when the auth endpoint is hit with the undefined shop in the query string.

Anyone came across this issue?

[sel_jmc]

I have also noticed that when I kick off a request to my app api layer the result from the 

useAppBridge call is returning nothing. What could cause this? It is populated at every step before I make a call to the backend.

[sel_jmc · Accepted solution]

Okay so this has been resolved, just adding this comment incase anyone else experiences this issue.

Turns out the server was stripping the auth headers from every request! So just had to do some configuration around that.

[Girish_Rajwani]

Hi @sel_jmc 

what's the solution, can you please share? I am getting "No Shop provided error"

Thanks in advance 🙂

[SADIK112]

Hey, can you share the solution? I am getting a 403 forbidden error when I build and deploy the project and install it to a store. Locally the API works fine with "useAuthenticatedFetch()"

[Girish_Rajwani]

Hey,

If it’s working locally then the issue seems to be with token or missing
key i guess. Kindly cross check and issue persists then try sharing
screenshot if possible

cheers