Shopify App Gets Caught in Infinite 'Enable Cookies' loop in Safari

[STAGE_TEN]

We have been experiencing a problem where users attempting to access our Shopify App from a Safari browser, either on desktop or iPhone, get caught in an infinite ‘Enable cookies' loop.

Our app is built as an Embedded App, using the current versions of Shopify's various libraries. We are using:

• Safari (MacOS) Version 13.0.4 (14608.4.9.1.4)
• Safari (iOS) on iOS 13.3

To verify that the problem wasn’t specific to our app code, I used the demo React app included in a tutorial: https://github.com/Shopify/shopify-demo-app-node-react

I set this up as is defined in the documentation, and the behaviour is as follows:

1. Starting a standard attempt to install an app via hitting: https://9f508623.ngrok.io/auth?shop=lee-stageten-store.myshopify.com, I get an ‘Enable cookies' screen:
   
2. After accepting this, and logging in to my store as normal, I get the standard OAuth permission screen.
3. After clicking "Install unlisted app" I get a standard Approve Charge screen, and accept the charges there.
4. At this point, the browser briefly goes to the sample app's default page, NOT in the Shopify admin iFrame.
5. It then attempts to redirect to the Shopify admin because of the 'forceRedirect' statement here:
   https://github.com/Shopify/shopify-demo-app-node-react/blob/4dd8f5a2db89910024f2cb52c43bed30b480c3de...
6. The browser then logs: [Error] Unable to post message to https://lee-stageten-store.myshopify.com. Recipient has origin https://<name>.ngrok.io. (That's our testing 
7. I am returned to the same 'Enable cookies’ page as above. Continuing produces the same loop infinitely.

Our own application experiences exactly the same problem.

This all looks related to Safari ITP (https://help.shopify.com/en/api/guides/itp-impact), but it appears newer versions of Safari have broken the solution described in that article. Do you have any further advice or ideas we can try? Given our users will want to use our application from a iOS device, this is a critical issue for us.

[hannachen]

👋Hi STAGE_TEN,

Thank you for taking the time to reproduce this issue on a test app and writing up such detailed instructions. I was able to reproduce the issue on my end, and I think you might be onto something, it does appear to be related to Safari ITP. We have a possible fix from a while back in anticipation for this Safari update within the `@shopify/koa-shopify-auth` utils, but we'll have to do some tests to verify that it does indeed work. For the time being, there's no workaround I can think of. Please bear with me while I dig into this issue a bit more, and I'll share the results ASAP.

[s_werk]

similar behavior in Firefox. Really annoying. Hope there will be a solution in @shopify/koa-shopify-auth soon

[hannachen]

Hey folks, I'm following up to let you know that this is still being worked on. A lot has changed since the possible solution was proposed, and there's quite a bit of catching up. s_werk, thank you for the additional info, it sounds like Firefox also have their own ITP and should be throughly tested as well. Much appreciated 🙏

[jsx]

I am having a similar problem in both Safari and Chrome. I'm new to developing apps with shopify and have been using the tutorial here:

https://developers.shopify.com/tutorials/build-a-shopify-app-with-node-and-react

I've built three test apps; one on my MacBook localhost, one on a FreeBSD server, and one on an Ubuntu server.

The one on localhost, as expected, passes all trust checks and loads as expected into the Shopify interface and as seen in the tutorial.

The installs on the remote servers do not. First the warning about enabling cookies is shown, and then the app loads externally as a redirect. I attempted to implement a user-proposed solution ( https://community.shopify.com/c/Shopify-APIs-SDKs/Embedded-App-not-working-in-Safari/td-p/335934/pag... ) but it did not work. It does not seem possible with updated browsers to embed an app in the Shopify admin interface.

I wonder if this is working for anyone? Or if users are simply assuming it's their fault and disabling the browser security?

[Ehsan_Khakbaz]

An updates on this?

Customers cannot open our app and we need support!

[victor75]

Hello,

Any news? This starts to impact more and more clients every day, and I cannot manage to find any workaround.

[hannachen]

Hello everyone, thanks for your continued patience on this. It appears that there were a few underlying issues around app auth flow, and not all related to the koa-shopify-auth library, making it quite tricky to debug. A few of those issues were addressed last week, and just yesterday we were able to isolate this bug. Unfortunately the proposed solution from last year didn't seem to solve the problem, so I am looking into other solutions at the moment.

[FandyGotama]

Any timeframe for the fix?

[Ash00]

I'm having the same issue.