你还在直接用 localStorage 么?该提升下了

网站建设5年前发布
142 0 0

20230306103149085499257f368cb88b286461d35f5516ab8db3912,封装之前先梳理下所需功能,并要做成什么样,采用什么样的规范,部分主要代码片段是以 ​​localStorage​​作为示例,最后会贴出完整代码的。可以结合项目自行优化,也可以直接使用。,Storage 本身是不支持过期时间设置的,要支持设置过期时间,可以效仿 Cookie 的做法,​​setStorage(key,value,expire)​​ 方法,接收三个参数,第三个参数就是设置过期时间的,用相对时间,单位秒,要对所传参数进行类型检查。可以设置统一的过期时间,也可以对单个值得过期时间进行单独配置。两种方式按需配置。,代码实现:,首先要对 ​​key​​ 是否存在进行判断,防止获取不存在的值而报错。对获取方法进一步扩展,只要在有效期内获取 ​​Storage​​ 值,就对过期时间进行续期,如果过期则直接删除该值。并返回 ​​null​​,加密采用的是 ​​crypto-js​​,对 ​​crypto-js​​ 设置密钥和密钥偏移量,可以采用将一个私钥经 ​​MD5​​ 加密生成16位密钥获得。,对加密方法进行封装,对解密方法进行封装,在存储数据及获取数据中进行使用:,这里我们主要看下进行加密和解密部分,部分方法在下面代码段中并未展示,请注意,不能直接运行。,使用的时候你可以通过 ​​import​​ 按需引入,也可以挂载到全局上使用,一般建议少用全局方式或全局变量,为后来接手项目继续开发维护的人,追查代码留条便捷之路!不要为了封装而封装,尽可能基于项目需求和后续的通用,以及使用上的便捷。比如获取全部存储变量,如果你项目上都未曾用到过,倒不如删减掉,留着过年也不见得有多香,不如为减小体积做点贡献!,该代码已进一步完善,需要的可以直接进一步优化,也可以将可优化或可扩展的建议,留言说明,我会进一步迭代的。可以根据自己的需要删除一些不用的方法,以减小文件大小。,

© 版权声明

相关文章