前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >记录一下因 localStorage 引发的故障

记录一下因 localStorage 引发的故障

作者头像
Li_XiaoJin
发布2022-06-10 19:45:43
3130
发布2022-06-10 19:45:43
举报
文章被收录于专栏:Lixj's BlogLixj's Blog

上周8号晚上上线发现一个问题,部分用户无法打开网站,我们这边的机器又都可以。查了半天是因为 localStorage 引起的,以前的开发人员写代码时也不够严谨,真是头疼。

问题现象

当时我们都可以正常打开页面,业务部门却说无法打开,让其打开控制台后,发现有报错。

分析原因

由于我们无法复现客户的现象,所以联系业务部门上 zoom 投屏给我们看,后来定位到是获取语言时报的错。

语言是存储在 localStorage 里的,然后让用户操作查看了用户的 localStorage,如下:

用户的电脑上存的是 EN-US 然后我们查看我们自己的电脑,可以看到 lang 字段是按照 json 格式存储的

推测用户是在别的网站登录过,别的网站用来控制语言的字段正好和我们网站是同一个,取名都为 lang ,所以在获取时获取不到。而事实也是如此,会员网站与我们营销网站用的都是 lang 字段。 最坑爹的是,以前的开发人员没有进行判空,如果获取不到,整个js就直接报错了,导致页面无法正常展示。

所以我们加了个判空的情况,获取不到时就默认给一个英文。

默认给英文之后,又发现用户只是一部分页面可以打开,有些还是无法打开。

继续分析后,发现程序中引用的 localStorage.js 有点问题,在存储 localStorage 时,会先将其删除,而删除是删除json格式的,用户存储的是 EN-US,非 json 格式,删除失败,直接报错了。代码中虽然用了 try catch, 但是并没有作特殊处理,所以还是没有设置语言成功。

查了半天终于查到原因了,那时也到了半夜,真心累。

解决办法

因为 localStorage.js 是公共的 js,担心大改会引发别的问题,最后决定是对 lang 字段进行特殊处理,如果删除报错,还是在 catch 里面继续进行往后的操作,插入新的 localStorage。

至此,问题解决。

Copyright: 采用 知识共享署名4.0 国际许可协议进行许可 Links: https://lixj.fun/archives/记录一下因localstorage引发的故障

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2020-05-11,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 问题现象
  • 分析原因
  • 解决办法
相关产品与服务
对象存储
对象存储(Cloud Object Storage,COS)是由腾讯云推出的无目录层次结构、无数据格式限制,可容纳海量数据且支持 HTTP/HTTPS 协议访问的分布式存储服务。腾讯云 COS 的存储桶空间无容量上限,无需分区管理,适用于 CDN 数据分发、数据万象处理或大数据计算与分析的数据湖等多种场景。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档