获得浏览器localStorage的剩余容量和最大容量

最新推荐文章于 2024-08-15 20:33:20 发布

Jack_Even

最新推荐文章于 2024-08-15 20:33:20 发布

阅读量2.3w

点赞数

分类专栏：零零碎碎的前端小知识

零零碎碎的前端小知识专栏收录该内容

3 篇文章 0 订阅

订阅专栏

一、如何获取localStorage的剩余容量

localStorage 中存储的是字符串，根据这一条件，我们可以通过取出所有的localStorage的内容，而其长度就是大小。具体代码如下:

(function(){
    if(!window.localStorage) {
        console.log('浏览器不支持localStorage');
    }
    var size = 0;
    for(item in window.localStorage) {
        if(window.localStorage.hasOwnProperty(item)) {
            size += window.localStorage.getItem(item).length;
        }
    }
    console.log('当前localStorage剩余容量为' + (size / 1024).toFixed(2) + 'KB');
})()

二、如何获取localStorage最大容量

通过上面的分析，其实思路基本是一样的，都是通过字符长度来判断。

(function() {
   if(!window.localStorage) {
   console.log('当前浏览器不支持localStorage!')
   }    var test = '0123456789';
   var add = function(num) {
     num += num;
     if(num.length == 10240) {
       test = num;
       return;
     }
     add(num);
   }
   add(test);
   var sum = test;
   var show = setInterval(function(){
      sum += test;
      try {
       window.localStorage.removeItem('test');
       window.localStorage.setItem('test', sum);
       console.log(sum.length / 1024 + 'KB');
      } catch(e) {
       console.log(sum.length / 1024 + 'KB超出最大限制');
       clearInterval(show);
      }
   }, 0.1)
 })()

转载自：https://www.cnblogs.com/MonkeyKingK/p/5499831.html