Shopify_app: Safari click to allow cookies on every authentication

Created on 27 May 2019  路  12Comments  路  Source: Shopify/shopify_app

Every time I open our app in Safari I have to "Click continue and allow cookies to use the app." even though the footer says "Cookies expire after 30 days."

Video

http://www.youtube.com/watch?v=vvnHPiO_Jro

Screenshot

Screen Shot 2019-05-27 at 2 12 13 PM

Software

shopify_app gem 9.0.1
Safari 12.1.1 (14607.2.6.1.1)
macOS Mojave 10.14.5 (18F132)

Hardware

MacBook Pro (13-inch, 2017, Two Thunderbolt 3 ports)

bug

Most helpful comment

Hello,

Our application has also had this same error.

Video

https://youtu.be/GkSotlXCFX0

Summary

I have spent quite a bit of time debugging the ITP handling logic this gem uses. From what I can tell, the issue lies here:

Storage access is granted for the life of the document as long as the document鈥檚 frame is attached to the DOM. This means:

  • Access is removed when the sub frame navigates.
  • Access is removed when the sub frame is detached from the DOM.
  • Access is removed when the top frame navigates.
  • Access is removed when the webpage goes away, such as a tab close.

_Source: https://webkit.org/blog/8124/introducing-storage-access-api/_

Assuming this information is still accurate, the Storage Access API permissions are not kept for 30 days, but are revoked immediately. Firefox's documentation says this is one of the differences between it's implementation and Safari's:

If the embedded origin tracker.example has already obtained first-party storage access on the top-level origin foo.example, and the user visits a page from foo.example embedding a page from tracker.example again in less than 30 days, the embedded origin will have storage access immediately when loading.

_Source: https://developer.mozilla.org/en-US/docs/Web/API/Storage_Access_API#Safari_implementation_differences_

Temporary Fix

We could actually fix this error temporarily by deleting the embedded app's cookies in Safari's privacy preferences tab.

We have considered redesigning the app to be a single-page application to avoid the issue of permissions being revoked on sub-frame navigation (or in our case, Embedded SDK Modals opening iframes to different parts of our application). We have also considered no longer providing an embedded application, and deploying it as a standalone application using Polaris.

Software

shopify_app gem 10.0.0
Safari Technology Preview Release 86 (Safari 13.0, WebKit 14608.1.30.2)
Safari Version 12.1.1 (14607.2.6.1.1)
macOS Mojave 10.14.5 (18F132)

Hardware

MacBook Pro (Retina, 13-inch, Early 2015)

All 12 comments

Hello,

Our application has also had this same error.

Video

https://youtu.be/GkSotlXCFX0

Summary

I have spent quite a bit of time debugging the ITP handling logic this gem uses. From what I can tell, the issue lies here:

Storage access is granted for the life of the document as long as the document鈥檚 frame is attached to the DOM. This means:

  • Access is removed when the sub frame navigates.
  • Access is removed when the sub frame is detached from the DOM.
  • Access is removed when the top frame navigates.
  • Access is removed when the webpage goes away, such as a tab close.

_Source: https://webkit.org/blog/8124/introducing-storage-access-api/_

Assuming this information is still accurate, the Storage Access API permissions are not kept for 30 days, but are revoked immediately. Firefox's documentation says this is one of the differences between it's implementation and Safari's:

If the embedded origin tracker.example has already obtained first-party storage access on the top-level origin foo.example, and the user visits a page from foo.example embedding a page from tracker.example again in less than 30 days, the embedded origin will have storage access immediately when loading.

_Source: https://developer.mozilla.org/en-US/docs/Web/API/Storage_Access_API#Safari_implementation_differences_

Temporary Fix

We could actually fix this error temporarily by deleting the embedded app's cookies in Safari's privacy preferences tab.

We have considered redesigning the app to be a single-page application to avoid the issue of permissions being revoked on sub-frame navigation (or in our case, Embedded SDK Modals opening iframes to different parts of our application). We have also considered no longer providing an embedded application, and deploying it as a standalone application using Polaris.

Software

shopify_app gem 10.0.0
Safari Technology Preview Release 86 (Safari 13.0, WebKit 14608.1.30.2)
Safari Version 12.1.1 (14607.2.6.1.1)
macOS Mojave 10.14.5 (18F132)

Hardware

MacBook Pro (Retina, 13-inch, Early 2015)

Seeing the same issue as @sergey-alekseev in my app.

shopify_app (11.3.0)
shopify_api (8.0.0)
macOS Catalina 10.15.1
Safari Version 13.0.3

@nwtn is this a bug or a known limitation of ITP in Safari? I've accepted this as an annoyance we have to live with but, clearly, it would be a huge UX win for Safari users if they don't have to go through that flow every time they open an embedded app.

@sergey-alekseev @tjclifton @janklimo Are you still having this issue with the latest version of the shopify_app gem (v12.0.4)?

After clearing cookies, this works now for me on Safari using shopify_app (12.0.7) 馃憤

Thanks @janklimo. @sergey-alekseev @tjclifton, are you able to confirm likewise, before I close the issue?

We'll need to update and get back to you with a confirmation. I've just quickly checked on shopify_app (12.0.0) and it's still the same. cc @dhalai

Thanks @sergey-alekseev - the changes in question went into v12.0.4, so anything after that should work.

@mkevinosullivan What changes in question are you referring to? We just noticed this and are running 12.0.7. After clearing cookies, I still get the "needs access to cookies" pop-up every time.

PR #897 should have helped alleviate it, but I guess not. Will keep this open ...

Strangely this worked for me in 12.0.7 but it is broken again in 13.1.0. Reported by my users and confirmed.

Update: this is not working correctly in v15.0.0 either. The notice says _Cookies expire after 30 days._ but you are shown this screen every single time you open the app.

For anyone facing the issue, users can avoid it by unchecking _Prevent cross-site tracking_ in Safari's settings. Some users are reporting this started to cause troubles around the 10.15.4 macOS release. I'm not sure if shopify_app can fix this somehow, I'd love to hear if anyone has ideas.

I'd recommend switching to session token auth, which avoids this issue! https://shopify.dev/tutorials/authenticate-your-app-using-session-tokens

Was this page helpful?
0 / 5 - 0 ratings