假设您想在插入项目之前检查 localStorage 是否已满:您会怎么做?
好吧,浏览器只有一种方式告诉您存储是否已满:当您尝试存储未填充到 localStorage 的项目时,它们会抛出错误(通常称为 QuotaExceededError
)。因此,要处理这个特定的用例,您必须将 localStorage.setItem 包装在 try & catch 中,以检测 localStorage 中是否有足够的空间来存储该项目:
尽管这种方法有效,但您应该记住,localStorage 不会仅在没有可用空间时抛出。它还会引发支持错误(例如,因为浏览器不支持 localStorage API)和安全错误(例如,因为在某些浏览器中以私有模式浏览时 localStorage API 受到限制)。
要区分此类错误和空间不足的错误,您可以尝试显式检测 QuotaExceededError 并采取相应的行为:
有一种比每次在 localStorage 中存储内容时检查错误类型更好的方法。
上面代码中您会看到,浏览器抛出与空间无关的错误的唯一情况是不支持 localStorage API。
因此,我们可以在开始使用之前单独检测 localStorage 的可用性(一次),而不是每次调用 setItem 时都考虑它们。
下面的完整代码片段是 MDN 的特征检测 localStorage 代码片段的轻微变体。它可用于检查实现 Web Storage API 的任何 API 的支持——因此它适用于
localStorage
和sessionStorage