javascript - Persistent local storage in iOS Safari issues - Stack Overflow

admin管理员组

文章数量:1343912

I'm currently working on a web application which sits inside an iframe for security purposes (protecting user data) and is hosted on other websites. To keep session state for insecure data, we write some data to local storage for user functionality i.e., remembering the user's background colour we save "backgroundColour" as "red".

However I have run into the following two issues on iOS Safari which currently work on MacOS Safari and Chrome and internet Explorer 11.

Issue 1: local storage is not retained when I force quit iOS

1. The user navigates to the host website, www.host, which loads my iframe content from a different domain, www.example
2. The user then interacts with the iframe and saves their background colour preferences which I save to local storage.
3. The user then force quits Safari or navigates away and then force quits Safari.
4. Navigate back to the host website

Expected behaviour: The localStorage contains the backgroundColour property

Actual behaviour: The local storage is empty

Issue 2: using the iframe content on different sites doesn't utilise local storage

1. The user navigates to the host website, www.host, which loads my iframe content from a different domain, www.example
2. The user then interacts with the iframe and saves their background colour preferences which I save to local storage.
3. The user navigates to www.awesomesite which also has my iframe content from the domain in step 1, www.example

Expected behaviour: The local storage is retained between the different sites because the storage is against DNS of the iframe

Actual behaviour: The local storage is empty

Has anyone experienced this before? Are there any workarounds that people have found? Is this a bug in iOS Safari? Have I done something wrong?

Cheers

I'm currently working on a web application which sits inside an iframe for security purposes (protecting user data) and is hosted on other websites. To keep session state for insecure data, we write some data to local storage for user functionality i.e., remembering the user's background colour we save "backgroundColour" as "red".

However I have run into the following two issues on iOS Safari which currently work on MacOS Safari and Chrome and internet Explorer 11.

Issue 1: local storage is not retained when I force quit iOS

1. The user navigates to the host website, www.host., which loads my iframe content from a different domain, www.example.
2. The user then interacts with the iframe and saves their background colour preferences which I save to local storage.
3. The user then force quits Safari or navigates away and then force quits Safari.
4. Navigate back to the host website

Expected behaviour: The localStorage contains the backgroundColour property

Actual behaviour: The local storage is empty

Issue 2: using the iframe content on different sites doesn't utilise local storage

1. The user navigates to the host website, www.host., which loads my iframe content from a different domain, www.example.
2. The user then interacts with the iframe and saves their background colour preferences which I save to local storage.
3. The user navigates to www.awesomesite. which also has my iframe content from the domain in step 1, www.example.

Expected behaviour: The local storage is retained between the different sites because the storage is against DNS of the iframe

Actual behaviour: The local storage is empty

Has anyone experienced this before? Are there any workarounds that people have found? Is this a bug in iOS Safari? Have I done something wrong?

Cheers

• javascript
• ios
• iframe
• safari
• local-storage

Share Improve this question Follow edited Oct 11, 2018 at 0:41 Matt Rowles 8,0802121 gold badges5757 silver badges8989 bronze badges asked Oct 10, 2018 at 0:11 Elliot SmithElliot Smith 30711 gold badge22 silver badges88 bronze badges 5

• 1 If you have not done so, please place your localStorage.setItem() calls in try/catch blocks. What is the result? – Randy Casburn Commented Oct 16, 2018 at 12:39
• 1 have you tried cookies as well? maybe it's a privacy setting in safari... – dandavis Commented Oct 16, 2018 at 20:16
• 1 @RandyCasburn I have tried localStorage.setItem() in try/catch blocks and no errors where thrown. If you inspect the local storage in simulator you can see that the values are written to the page and when you refresh the page the website is able to retrieve the stored values from local storage. It is only when you force quit Safari that the behaviour above occurs. – Elliot Smith Commented Oct 17, 2018 at 23:01
• 1 @dandavis I'd prefer not to use cookies as cookies have a maximum size (4093 bytes per website) which we will definitely go over in the short term. We would also have to set an arbitrary expiration date for the data which isn't really preferable. Furthermore, this stackoverflow thread mentions that cookies are passed to your servers and our servers don't need this information which will result in increased load times for our users. – Elliot Smith Commented Oct 17, 2018 at 23:06
• Apple is now deleting localStorage after 7 days of inactivity from webkit browsers on iOS & macOS webkit/blog/10218/full-third-party-cookie-blocking-and-more – Andy Ford Commented Nov 23, 2022 at 7:59

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 6 +100

Issue 1 is Safari behavior and cannot be changed externally with code. Please open a feature request or bug report with Apple:

https://www.apple./feedback/safari.html

Issue 2: Unfortunately, the technique you are using "3rd party local storage" is a technique employed by tracking technologies. The recent privacy push has led all browsers to make more strict rules for 3rd party cookies, and other local storage. You will find that privacy settings will make your user experience inconsistent. You cannot expect your local storage to be reliable when you are a 3rd party.

SEE: Is there any workaround to set third party cookie in Iframe for safari?

AND

https://medium./@bluepnume/safaris-new-tracking-rules-and-enabling-cross-domain-data-storage-85241eea7483

AND

https://groups.google./forum/#!topic/mozilla.dev.platform/vm81cSx4teo

本文标签： javascriptPersistent local storage in iOS Safari issuesStack Overflow