设置“ dataURL”的值超出了配额

我有一个 JavaScript 代码保存字符串到本地存储，字符串大小是400000,

var dataURL = canvas.toDataURL("image/jpg").toString();
localStorage.setItem("dataURL", dataURL);

我打开 HTML 文件从铬，在一台计算机它的确定在另一台计算机我得到

未捕获的 QuotaExceededError: 未能在 ‘ Storage’: 设置‘ dataURL’的值超过了配额。

在这台计算机中，我允许保存的字符串长度不超过100000个字符。 两台电脑都有相同的铬35.0版本 为什么？

97686 次浏览
小开

这取决于浏览器首选项和磁盘空间。在这里比较两台计算机的浏览器 https://arty.name/localstorage.html并检查它们是否存储相同的否。角色。你会看出区别的。

小开

Chrome 本地存储默认是25M，所以清除你的铬的本地存储将工作吧。祝你好运！

小开

当浏览器达到最大限制时，它将抛出此错误 未能在‘ Storage’上执行‘ setItem’: 设置“超出配额”的值。

  • 你可以这样处理

 try {
var count = 100;
var message = "LocalStorageIsNOTFull";
for (var i = 0; i <= count; count + 250) {
message += message;
localStorage.setItem("stringData", message);
console.log(localStorage);
console.log(count);
}


}
catch (e) {
console.log("Local Storage is full, Please empty data");
// fires When localstorage gets full
// you can handle error here or empty the local storage
}

小开

由于以下原因，这类错误也可能发生:

可以在单个 localStorage 键中存储值的限制。

例如 ，如果我写 localStorage.setItem (‘ data’，allData) ; 然后有一个限制设置为 「资料」键，可以存储指定数量的字符在 ‘ allData’值。

在 chrome 和 firefox 中，你可以在一个键中存储高达 5200000个字符的数据。您可以通过访问这个网站 https://arty.name/localstorage.html来检查您的浏览器限制

因此，要解决这个问题，您必须检查您试图存储在单个键中的字符数。

如果超过 localStorage 键的值大小，则必须将大小减小到适当的限制。

小开

用 localStorage.clear();清理本地仓库对我来说很管用。

如果你在 Firefox 上，你可能需要使用 window.localStorage.clear();

小开

下面的代码将允许您在本地存储中保存最多数量的数据，而不会在存储超过时清除它。

const setInLocalStorage = (keyName, value) => {
try {
localStorage.setItem(keyName, JSON.stringify(value));
} catch (error) {
console.log('Error in local storage', error);
setInLocalStorage(keyName, JSON.parse(localStorage.getItem(keyName)));
}
};


提交答案