Safari的html5 localStorage错误:"QUOTA_EXCEEDED_ERR:DOM例外22:尝试向超出配额的存储添加内容."

Question

我的webapp在ios safari私密浏览中有javascript错误:

JavaScript的:错误

未定义

QUOTA_EXCEEDED_ERR:DOM例外22:尝试向存储添加内容......

我的代码:

localStorage.setItem('test',1)

Answer 1

显然这是设计的.当Safari(OS X或iOS)处于隐私浏览模式时,它看起来好像localStorage可用,但尝试调用setItem会抛出异常.

store.js line 73
"QUOTA_EXCEEDED_ERR: DOM Exception 22: An attempt was made to add something to storage that exceeded the quota."

发生的事情是窗口对象仍然localStorage在全局命名空间中公开,但是当您调用时setItem,抛出此异常.任何调用都会removeItem被忽略.

我相信最简单的修复(虽然我还没有测试过这个交叉浏览器)是改变功能isLocalStorageNameSupported()来测试你也可以设置一些值.

https://github.com/marcuswestin/store.js/issues/42

function isLocalStorageNameSupported() 
{
    var testKey = 'test', storage = window.sessionStorage;
    try 
    {
        storage.setItem(testKey, '1');
        storage.removeItem(testKey);
        return localStorageName in win && win[localStorageName];
    } 
    catch (error) 
    {
        return false;
    }
}

Answer 2

上面链接上发布的修复程序对我不起作用.这样做:

function isLocalStorageNameSupported() {
  var testKey = 'test', storage = window.localStorage;
  try {
    storage.setItem(testKey, '1');
    storage.removeItem(testKey);
    return true;
  } catch (error) {
    return false;
  }
}

源自http://m.cg/post/13095478393/detect-private-browsing-mode-in-mobile-safari-on-ios5

Answer 3

如其他答案中所述,当调用localStorage.setItem(或sessionStorage.setItem)时,您将始终在iOS和OS X上的Safari私有浏览器模式中获得QuotaExceededError .

一种解决方案是在每个使用实例中执行try/catch或Modernizr检查setItem.

但是,如果你想要一个简单地全局停止抛出此错误的垫片,为了防止其他JavaScript被破坏,你可以使用:

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.');
    }
}

Answer 4

在我的上下文中,刚开发了一个类抽象.当我的应用程序启动时,我通过调用getStorage()检查localStorage是否正在工作.此功能还返回:

• 如果localStorage正在工作,则localStorage
• 或自定义类LocalStorageAlternative的实现

在我的代码中,我从不直接调用localStorage.我调用cusSto global var,我通过调用getStorage()初始化了.

这样,它适用于私人浏览或特定Safari版本

function getStorage() {

    var storageImpl;

     try { 
        localStorage.setItem("storage", ""); 
        localStorage.removeItem("storage");
        storageImpl = localStorage;
     }
     catch (err) { 
         storageImpl = new LocalStorageAlternative();
     }

    return storageImpl;

}

function LocalStorageAlternative() {

    var structureLocalStorage = {};

    this.setItem = function (key, value) {
        structureLocalStorage[key] = value;
    }

    this.getItem = function (key) {
        if(typeof structureLocalStorage[key] != 'undefined' ) {
            return structureLocalStorage[key];
        }
        else {
            return null;
        }
    }

    this.removeItem = function (key) {
        structureLocalStorage[key] = undefined;
    }
}

cusSto = getStorage();

Answer 5

似乎Safari 11改变了行为，现在本地存储可在专用浏览器窗口中工作。万岁！

我们曾经在Safari私人浏览中失败的Web应用程序现在可以完美运行。在Chrome的专用浏览模式下，它始终可以正常运行，该模式始终允许写入本地存储。

Apple的Safari技术预览版发行说明 -和WebKit发行说明 -于2017年5月发布的第29版中对此进行了记录。

特别：

• 修复了在私人浏览模式或WebDriver会话中保存到localStorage时出现QuotaExceededError- r215315