ITP 2.3 and Shopify

Highlighted
New Member
1 0 0

Does Shopify have a built-in workaround for the ITP 2.3 change for Safari? Can't find any information about it in the docs and opening a support ticket pointed me here.

0 Likes
Highlighted
Tourist
8 1 5

I posed a similar question two days ago here:

https://community.shopify.com/c/Shopify-APIs-SDKs/Safari-13-1-and-embedded-apps/td-p/688416

 

We were able to work around previous privacy changes ('Prevent cross-site tracking' and ITP 2.3) by using App Bridge to redirect the top window to set a cookie from our domain and then back into our app (which App Bridge automatically puts back in its correct frame).

 

Safari 13.1 is a different beast, though. As I understand it, our app can only read its (previously set) first-party cookies after user interaction. And this only works if the app 'iframe' element is sandboxed with the appropriate tokens:

 

<iframe sandbox="allow-scripts allow-same-origin allow-top-navigation allow-storage-access-by-user-activation"></iframe>

 

We need Shopify to add these to the embedded app iframe.

0 Likes
Highlighted
Shopify Expert
4182 29 402

Safari wanks for this. Chrome wanks for other stuff. Firefox wanks for stuff. All our browsers **bleep**... but most of this wankage will hopefully disappear if Shopify gives up on the <iframe> element for Apps and moves us all in another direction. Can it be done? Will it be done? Only a few people know for sure and they're not talking... but it would be nice if they would... real nice. So we could plan our Apps and interactions without all this browser nonsense that is not only out of our hands, but also Shopify's.

Custom Shopify Apps built just for you! hunkybill@gmail.com http://www.resistorsoftware.com
0 Likes
Highlighted
Tourist
8 1 5

I was wrong in my response. The iframe does not need to be sandboxed, so Shopify doesn't need to make changes to the element.

 

In Safari 13.1, all third-party cookies are blocked. You can get access to previously set first-party cookies by using the Storage Access API. Getting access to storage requires user activation so the user has to click a button to initiate the process and then, if they haven't already, confirm access via the Safari prompt.

 

So the rough approach that worked for us was:

 

1) Initialize a page with App Bridge configured. You don't want to rely on retrieving your shop origin from a cookie -- retrieve it from the URL. Check if the page can read a cookie (make sure the cookie is not HTTP-only).

2) If no cookie access, use App Bridge to redirect to the top window. Set the session cookie and redirect back to your app. App Bridge will put it back in an iframe.

3) Display a user activation page with a button. When the user clicks the button, use the Storage Access API to request access.

4) The iframe should have access to your session cookie. Display the requested page.

 

Hope this helps.

0 Likes