最近完善了 stokado ,用来解决 localStorage / sessionStorage 用起来的几个老问题,分享给大家看看。
它本质是给任意 storage 对象套一层 Proxy ,主要做了这几件事:
- 类型保留序列化 —— 存
number取出还是number,存Date取出还是Date,不用每次手动JSON.parse再转类型。 - 同标签页响应式订阅 —— 直接
on/once/off监听某个 key 的变化,不用自己写addEventListener('storage')(原生那个还监听不到本标签页)。 - 过期与一次性值 ——
setItem(k, v, { expires })自动过期,{ disposable: true }读一次就失效。 - 跨标签页同步 —— 基于 BroadcastChannel 。
- 配额告警 —— 接近容量上限时回调通知。
- 内置 7 个平台预设:cookie / 微信 / 抖音 / 支付宝 / uni-app / react-native / node 。
- 零依赖、框架无关、TypeScript 友好。
安装:
npm install stokado
最小示例:
import { createProxyStorage } from 'stokado'
const storage = createProxyStorage(localStorage)
// 类型保留:取出来还是 number / Date ,不是字符串
storage.count = 0
storage.count === 0 // true
storage.createdAt = new Date('2024-01-01')
storage.createdAt.getTime() // 正常可用
// 同标签页响应式订阅
storage.on('token', (newVal, oldVal) => {
console.log('token changed:', oldVal, '->', newVal)
})
// 过期 & 一次性值
storage.setItem('token', 'abc', { expires: Date.now() + 3600_000 })
storage.setItem('flash', 'data', { disposable: true })
storage.flash // 'data'
storage.flash // undefined (读过一次即失效)