Очистить localstorage при закрытии браузера
My Case: localStorage с ключом + значение, которое должно быть удалено при закрытии браузера, а не одной вкладке.
Пожалуйста, посмотрите мой код, если он правильный и что можно улучшить:
ОТВЕТЫ
Ответ 1
должно выполняться так, а не с оператором delete:
Ответ 2
Используйте с window глобальное ключевое слово: -
Ответ 3
Вы можете использовать событие beforeunload в JavaScript.
Используя ванильный JavaScript, вы можете сделать что-то вроде:
Это удалит ключ до закрытия окна браузера/вкладки и предложит подтвердить действие закрытия окна/вкладки. Я надеюсь, что решает вашу проблему.
ПРИМЕЧАНИЕ. Метод onbeforeunload должен возвращать строку.
Ответ 4
Вместо этого вы должны использовать sessionStorage, если хотите, чтобы ключ был удален при закрытии браузера.
Ответ 5
Надеюсь, это сработает для вас.
Ответ 6
Существует очень конкретный вариант использования, в котором любое предложение использовать sessionStorage вместо localStorage действительно не помогает. Вариант использования был бы таким же простым, как наличие чего-то, хранящегося при открытии хотя бы одной вкладки, но недействительным, если вы закроете оставшуюся вкладку. Если вам нужны ваши значения для сохранения кросс-вкладок и окна, sessionStorage не поможет вам, если вы не усложняете свою жизнь слушателями, как я и пытался. Тем временем localStorage был бы идеален для этого, но он работает слишком хорошо, так как ваши данные будут ждать там даже после перезапуска браузера. Я закончил тем, что использовал собственный код и логику, которые используют преимущества обоих.
Я бы лучше объяснил, дайте код. Сначала сохраните то, что вам нужно, в localStorage, затем также в localStorage создайте счетчик, который будет содержать количество открываемых вкладок. Это будет увеличиваться каждый раз, когда страница загружается и уменьшается каждый раз, когда страница выгружается. Здесь вы можете выбрать, какие события использовать, я бы предложил "загрузить" и "разгрузить". В то время, когда вы выгружаетесь, вам нужно выполнить задачи очистки, которые вы хотите, когда счетчик достигнет 0, а это означает, что вы закрываете последнюю вкладку. Вот сложная часть: я не нашел надежного и общего способа рассказать разницу между перезагрузкой страницы или навигацией внутри страницы и закрытием вкладки. Поэтому Если хранящиеся данные не являются чем-то, что вы можете восстановить при загрузке после проверки, что это ваша первая вкладка, вы не можете удалить ее при каждом обновлении. Вместо этого вам нужно сохранить флаг в sessionStorage при каждой загрузке, прежде чем увеличивать счетчик табуляции. Перед сохранением этого значения вы можете сделать чек, чтобы узнать, имеет ли он уже значение, а если нет, это означает, что вы загружаетесь в этот сеанс в первый раз, что означает, что вы можете выполнить очистку при загрузке, если это значение не установлено, а счетчик равен 0.
Ответ 7
Объект sessionStorage равен объекту localStorage, за исключением того, что он хранит данные только для одного сеанса. Данные удаляются, когда пользователь закрывает окно браузера.
В следующем примере подсчитывается количество нажатий кнопки пользователя в текущем сеансе:
Ответ 8
Ответ 9
Хотя некоторые пользователи уже уже ответили на этот вопрос, я приводил пример настроек приложения для решения этой проблемы.
Надеюсь, это поможет.
Ответ 10
Вот простой тест, чтобы узнать, есть ли у вас поддержка браузера при работе с локальным хранилищем:
Ответ 11
Я не думаю, что решение, представленное здесь, на 100% правильное, потому что событие window.onbeforeunload вызывается не только при закрытии браузера /Tab (КОТОРЫЙ НЕОБХОДИМО), но также и во всех других событиях. (КОТОРЫЙ НЕ МОЖЕТ БЫТЬ НЕОБХОДИМО)
См. эту ссылку для получения дополнительной информации о списке событий, которые могут запускать window.onbeforeunload: -
Ответ 12
почему не используется sessionStorage?
"Объект sessionStorage равен объекту localStorage, за исключением того, что он хранит данные только для одного сеанса. Данные удаляются, когда пользователь закрывает окно браузера."
Ответ 13
Посмотрев на этот вопрос через 6 лет после того, как он был задан, я обнаружил, что до сих пор нет достаточного ответа на этот вопрос; который должен достичь всего следующего:
- Очистить локальное хранилище после закрытия браузера (или всех вкладок домена)
- Сохранить локальное хранилище на вкладках, если хотя бы одна вкладка остается активной
- Сохранять локальное хранилище при перезагрузке одной вкладки
Выполните этот фрагмент javascript в начале каждой загрузки страницы, чтобы достичь вышеуказанного:
Изменить: Основная идея здесь заключается в следующем:
- При запуске с нуля хранилищу сессии назначается случайный идентификатор в ключе с именем tabid
- Локальное хранилище затем задается ключом, называемым tabs содержащим объект, для которого ключ tabid имеет значение 1.
- Когда вкладка выгружена, tabs локального хранилища обновляются до объекта, содержащего tabid установленный в 0.
- Если вкладка перезагружена, она сначала выгружается и возобновляется. Поскольку существует tabid ключа хранилища tabid , а также ключ tabs локального хранилища с tabid клавишей tabid локальное хранилище не очищается.
- Когда браузер выгружен, все хранилище сессии будет очищено. При возобновлении tabid хранилища tabid больше не существует, и будет создан новый tabid . Так как в локальном хранилище нет tabid для этого tabid или любого другого tabid (все сеансы были закрыты), он очищен.
- При новой созданной вкладке, новые tabid генерируются в памяти сессии, но так как по крайней мере один tabs [ tabid ] существует, локальное хранилище не очищается
Ответ 14
По сути, идея заключается в следующем:
Ответ 15
Нет такого способа определения закрытия браузера, поэтому, вероятно, вы не можете удалить localStorage при закрытии браузера, но есть другой способ обработки вещей, которые вы можете использовать с помощью sessionCookies, так как он уничтожит после закрытия браузера. Это я реализовал в своем проекте.
Как долго я могу ожидать, что данные будут храниться в localStorage. Как долго будут сохраняться данные локального хранилища среднего пользователя? Если пользователь не очистит его, будет ли он длиться до переустановки браузера?
является ли это согласованным в браузерах?
проект W3C говорит это
агенты пользователей должны истекать данные из локальных областей хранения только по соображениям безопасности или по запросу пользователя. Агенты пользователей всегда должны избегать удаления данных во время выполнения сценария, который может получить доступ к этим данным.
поэтому, если браузеры следуют спецификации, она должна сохраняться до тех пор, пока пользователь не удалит ее во всех браузерах, я не нашел ни одного, который удалил на любом из моих проектов.
localStorage также известен как веб-хранилище, хранилище HTML5 и хранилище DOM (все они означают одно и то же).
localStorage похож на sessionStorage,кроме этого данные, хранящиеся в localStorage, не имеют срока действия, в то время как данные, хранящиеся в sessionStorage, очищаются, когда сеанс просмотра заканчивается (т. е. когда браузер закрыт).
localStorage доступен во всех браузерах, но постоянство не реализуется последовательно. В частности, localStorage может быть очищен действием пользователя и может быть очищен непреднамеренно (кто бы подумал, что очистка всех файлов cookie также очищает localStorage?).
в Firefox localStorage очищается, когда выполняются эти три условия: (a) пользователь очищает недавнюю историю, (b) файлы cookie выбираются для очистки, (c) диапазон времени - "все"
в IE, чтобы очистить хранилище localStorage: (а) инструменты--настройки интернета, (б) вкладка "Общие", (с) удалять журнал браузера при выходе (D) для обеспечения "файлы cookie и данные веб-сайтов" (или "временные файлы интернета и веб-файлы") выбран (е) рассмотреть убрав галочку "Сохранить данные избранных веб-сайтов данных" сверху
в Safari: (A) нажмите Safari (b) настройки (c) выберите вкладку Конфиденциальность (d) нажмите Удалить все данные веб-сайта (e) нажмите Удалить сейчас
Opera: несмотря на отличные статьи о localStorage с сайта Opera, я еще не нашел четких (не программных) инструкций для пользователей о том, как очистить localStorage. Если кто-то найдет, пожалуйста, оставьте комментарий ниже этого ответа со ссылкой.
My Case: localStorage with key + value that should be deleted when browser is closed and not single tab.
Please see my code if its proper and what can be improved:
1,877 3 3 gold badges 17 17 silver badges 18 18 bronze badges 23.9k 33 33 gold badges 105 105 silver badges 163 163 bronze badges If you want to clear local storage upon browser close I would question your reasons for using it. You can have both local and session storage objects- I would use sessionStorage for session values. Btw, setting a value to undefined does not delete it, or remove it from localStorage, it just sets its value to undefined. @kennebec - Setting to undefined would overwrite the previously stored item though. But yes, using .removeItem() is more appropriate. Use localStorage.clear(); if you want to clear whole storage.23 Answers 23
should be done like that and not with delete operator:
Use with window global keyword:-
You should use the sessionStorage instead if you want the key to be deleted when the browser close.
1,215 1 1 gold badge 11 11 silver badges 21 21 bronze badges This is the best answer; sessionStorage is the remedy for what the asker describes.You can make use of the beforeunload event in JavaScript.
Using vanilla JavaScript you could do something like:
That will delete the key before the browser window/tab is closed and prompts you to confirm the close window/tab action. I hope that solves your problem.
NOTE: The onbeforeunload method should return a string.
1,877 3 3 gold badges 17 17 silver badges 18 18 bronze badges This was indeed useful. It might be nice to accept the answer (even after all this time). One problem is that this is called even if you navigate on the same page, not just when the tab is closed, which might not be what is intended. Side note: returning undefined from onbeforeunload will disable the message showing when unloading. What happend if the user wants to stay on page and you already delete the local storage? Also the solution is not working on Chrome and IE11Hope this works for you
783 1 1 gold badge 8 8 silver badges 18 18 bronze badges This will clean up entire localstorage. bad solution!There is a very specific use case in which any suggestion to use sessionStorage instead of localStorage does not really help. The use-case would be something as simple as having something stored while you have at least one tab opened, but invalidate it if you close the last tab remaining. If you need your values to be saved cross-tab and window, sessionStorage does not help you unless you complicate your life with listeners, like I have tried. In the meantime localStorage would be perfect for this, but it does the job 'too well', since your data will be waiting there even after a restart of the browser. I ended up using a custom code and logic that takes advantage of both.
I'd rather explain then give code. First store what you need to in localStorage, then also in localStorage create a counter that will contain the number of tabs that you have opened. This will be increased every time the page loads and decreased every time the page unloads. You can have your pick here of the events to use, I'd suggest 'load' and 'unload'. At the time you unload, you need to do the cleanup tasks that you'd like to when the counter reaches 0, meaning you're closing the last tab. Here comes the tricky part: I haven't found a reliable and generic way to tell the difference between a page reload or navigation inside the page and the closing of the tab. So If the data you store is not something that you can rebuild on load after checking that this is your first tab, then you cannot remove it at every refresh. Instead you need to store a flag in sessionStorage at every load before increasing the tab counter. Before storing this value, you can make a check to see if it already has a value and if it doesn't, this means you're loading into this session for the first time, meaning that you can do the cleanup at load if this value is not set and the counter is 0.
I am thinking the best implementation for this would be a browserWatcher service which basically fires events that other components can listen to (i.e. browser-open, browser-close, broswer-load, browser-unload etc. and hide all these implementation details inside it. Each component can decide which events it needs to handle in order to do its work. My only question would be what happens if power gets cut to the machine or something, then these properties would stay in localStorage next time the browser is opened wouldnt they?The sessionStorage object is equal to the localStorage object, except that it stores the data for only one session. The data is deleted when the user closes the browser window.
The following example counts the number of times a user has clicked a button, in the current session:
1,137 1 1 gold badge 23 23 silver badges 41 41 bronze badges sessionStorage is not shared between tabs; it is not equal to localStorage. When answering an old question, your answer would be much more useful to other StackOverflow users if you included some context to explain how your answer helps, particularly for a question that already has an accepted answer. See: How do I write a good answer.There are five methods to choose from:
- setItem(): Add key and value to localStorage
- getItem(): Retrieve a value by the key from localStorage
- removeItem(): Remove an item by key from localStorage
- clear(): Clear all localStorage
- key(): Passed a number to retrieve nth key of a localStorage
You can use clear(), this method when invoked clears the entire storage of all records for that domain. It does not receive any parameters.
8.5 years in and the original question was never actually answered.
when browser is closed and not single tab.
This basic code snippet will give you the best of both worlds. Storage that persists only as long as the browser session (like sessionStorage), but is also shareable between tabs (localStorage).
Is there any way to reset/clear browser's localStorage in javascript?
12 Answers 12
Use this to clear localStorage:
35.1k 6 6 gold badges 53 53 silver badges 58 58 bronze badges @BakedInhalf not at all. Maybe your app sets it over again? I call localStorage.clear() when my app starts up, but even if I close the browser, clear cache, etc., the data are still there. I know this because I have set an "instance" property on my model to a random number on initialize, and, for a given id, the instance property is always the same. @digital-plane Will this clear the local storage from a specific domain or all the storage? clear() will remove all localStorage keys and values from the specific domain you are on. Javascript is unable to get localStorage values from any other domains due to CORS. @BakedInhalf is right, it stays until you hard refresh the page. When you clear your localStorage and fill it right after, it kind of restore the previous content and adds you new item to it. When you clear your localStorage and doing a hardrefresh, it is empty and you can start filling it again.If you want to remove a specific Item or variable from the user's local storage, you can use
Here is a function that will allow you to remove all localStorage items with exceptions. You will need jQuery for this function. You can download the gist.
You can call it like this
19.1k 11 11 gold badges 85 85 silver badges 118 118 bronze badges
If you want to clear all item you stored in localStorage then
Use this for clear all stored key.
If you want to clear/remove only specific key/value then you can use removeItem(key).
Localstorage is attached on the global window . When we log localstorage in the chrome devtools we see that it has the following APIs:
We can use the following API's for deleting items:
- localStorage.clear() : Clears the whole localstorage
- localStorage.removeItem('myItem') : To remove individual items
If you need to clear the local storage data use:
To remove a particular item from the local storage use :
First things first, you need to check to make sure that localStorage is enabled. I would recommend doing it like this:
Yes, you can (in some cases) just check to see if the localStorage is a member of the window object. However, there are iframe sandboxing options (among other things) that will throw an exception if you even attempt to access the index 'localStorage'. Thus, for best-practices reasons, this is the best way to check to see if the localStorage is enabled. Then, you can just clear the localStorage like so.
For example, you could clear the localStorage after an error occurs in webkit browsers like so.
Читайте также: