QuotaExceededError: Dom exception 22: An attempt was made to add something to storage that exceeded the quota
This can occur when Safari is in private mode browsing. While in private browsing, local storage is not available at all.
One solution is to warn the user that the app needs non-private mode to work.
UPDATE: This has been fixed in Safari 11, so the behaviour is now aligned with other browsers.
As mentioned in other answers, you'll always get the QuotaExceededError in Safari Private Browser Mode on both iOS and OS X when localStorage.setItem
(or sessionStorage.setItem
) is called.
One solution is to do a try/catch or Modernizr check in each instance of using setItem
.
However if you want a shim that simply globally stops this error being thrown, to prevent the rest of your JavaScript from breaking, you can use this:
https://gist.github.com/philfreo/68ea3cd980d72383c951
// Safari, in Private Browsing Mode, looks like it supports localStorage but all calls to setItem
// throw QuotaExceededError. We're going to detect this and just silently drop any calls to setItem
// to avoid the entire page breaking, without having to do a check at each usage of Storage.
if (typeof localStorage === 'object') {
try {
localStorage.setItem('localStorage', 1);
localStorage.removeItem('localStorage');
} catch (e) {
Storage.prototype._setItem = Storage.prototype.setItem;
Storage.prototype.setItem = function() {};
alert('Your web browser does not support storing settings locally. In Safari, the most common cause of this is using "Private Browsing Mode". Some settings may not save or some features may not work properly for you.');
}
}
I use this simple function, which returns true
or false
, to test for localStorage availablity:
isLocalStorageNameSupported = function() {
var testKey = 'test', storage = window.sessionStorage;
try {
storage.setItem(testKey, '1');
storage.removeItem(testKey);
return true;
} catch (error) {
return false;
}
}
Now you can test for localStorage.setItem()
availability before using it. Example:
if ( isLocalStorageNameSupported() ) {
// can use localStorage.setItem('item','value')
} else {
// can't use localStorage.setItem('item','value')
}