Working with localStorage
and sessionStorage
often poses challenges, the most significant of which is that they are not always available. This may be due to the browser’s security settings, or the user’s privacy settings, or even the browser’s version.
In any case, it is always a good idea to check if localStorage
or sessionStorage
is available before using it.
Check if localStorage
is enabled
Checking if localStorage
is enabled requires some trial and error, quite literally, as we will use a try...catch
block to test if operations in localStorage
are supported.
Using Storage.setItem()
and Storage.removeItem()
we will try to store and delete a value in localStorage
. If both operations complete successfully, we will return true
, otherwise we will return false
.
代码实现
const isLocalStorageEnabled = () => {
try {
const key = `__storage__test`;
window.localStorage.setItem(key, null);
window.localStorage.removeItem(key);
return true;
} catch (e) {
return false;
}
};
isLocalStorageEnabled(); // true, if localStorage is accessible
Check if sessionStorage
is enabled
Checking if sessionStorage
is enabled is the exact same as checking if localStorage
is enabled, except that we will use sessionStorage
instead of localStorage
.
使用样例
const isSessionStorageEnabled = () => {
try {
const key = `__storage__test`;
window.sessionStorage.setItem(key, null);
window.sessionStorage.removeItem(key);
return true;
} catch (e) {
return false;
}
};
isSessionStorageEnabled(); // true, if sessionStorage is accessible
[!TIP]
You can learn about the differences between
localStorage
andsessionStorage
in a previous article.
翻译自:https://www.30secondsofcode.org/js/s/is-local-storage-session-storage-enabled