diff --git a/CHANGELOG.md b/CHANGELOG.md index 6f1ac45..2dee516 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,20 @@ + +## [1.2.1](https://github.com/dreambo8563/vue-storage-watcher/compare/1.1.3...1.2.1) (2019-02-20) + + +### Bug Fixes + +* **expire:** when getItem and it's expired, we should emit the subscribers with null ([9e0fa77](https://github.com/dreambo8563/vue-storage-watcher/commit/9e0fa77)) + + +### Features + +* **ttl:** add ttl method ([abbd794](https://github.com/dreambo8563/vue-storage-watcher/commit/abbd794)) + + + -## [1.1.3](https://github.com/dreambo8563/vue-storage-watcher/compare/v1.1.2...v1.1.3) (2019-02-19) +## [1.1.3](https://github.com/dreambo8563/vue-storage-watcher/compare/1.1.2...v1.1.3) (2019-02-19) diff --git a/README.md b/README.md index 2d1e75d..c1b29fc 100644 --- a/README.md +++ b/README.md @@ -26,7 +26,7 @@ TODO: - [x] support sessionStorage - [x] logo design -- [ ] ttl method like redis to get remaining lifetime in ms +- [x] ttl method like redis to get remaining lifetime in ms - [ ] show usage with github pages maybe ### Install @@ -75,6 +75,20 @@ this.$ls.set("token", "abccc", 3000) the key will be expried in 3s, you will get null after that. +#### ttl + +ttl will return **-1** if one of the following scenarios happen: + +- the key is non-exist +- the key is already expired +- the key has no expire time + +else return the remaining lifetime with ms as the unit + +```js +this.$ls.ttl("token) +``` + #### get ```js diff --git a/package-lock.json b/package-lock.json index 7b9d9b0..e2372e6 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,6 +1,6 @@ { "name": "vue-storage-watcher", - "version": "1.1.3", + "version": "1.2.1", "lockfileVersion": 1, "requires": true, "dependencies": { diff --git a/package.json b/package.json index 9b1a67d..3d73675 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "vue-storage-watcher", - "version": "1.1.3", + "version": "1.2.1", "author": "dreambo8563", "main": "dist/vue-storage-watcher.umd.min.js", "private": false, diff --git a/src/main.ts b/src/main.ts index f9db88d..6463341 100644 --- a/src/main.ts +++ b/src/main.ts @@ -5,7 +5,6 @@ export type lsOption = { storage?: "local" | "session"; }; interface ILSWatcher { - // constuctor(op: lsOption): void; on(key: string, fn: Function, immediate?: boolean): Symbol; set(key: string, payload: any, expire?: number | null): void; broadcast(key: string, payload?: any): void; @@ -16,6 +15,7 @@ interface ILSWatcher { init(): void; remove(key: string): void; off(key: string, handler: Symbol): void; + ttl(key: string): number; } class LSWatcher { // internal event queue 内置事件队列 @@ -39,6 +39,7 @@ class LSWatcher { } } // 注册事件 + // register the event of the key on(key: string, fn: Function, immediate: boolean = false): Symbol { if (typeof fn !== "function") { throw new Error("the second arg should be the callback function"); @@ -58,12 +59,14 @@ class LSWatcher { //赋值 set(key: string, payload: any, expire: number | null = null): void { // 先存入 ls + // save into storage const stringifyValue = JSON.stringify({ value: payload, expire: expire !== null ? new Date().getTime() + expire : null }); this.storageObj.setItem(this.prefix + key, stringifyValue); // 通知订阅者 + // inform subscribers this.broadcast(this.prefix + key, payload); } broadcast(key: string, payload: any = null): void { @@ -86,6 +89,7 @@ class LSWatcher { } /** * 是否有人订阅了这个key + * check if there is any subscriber of the key * * @param {string} key * @returns {boolean} @@ -120,24 +124,46 @@ class LSWatcher { get(key: string, def = null): any { const item = this.storageObj.getItem(this.prefix + key); - if (item !== null) { - try { - const data = JSON.parse(item); + if (item == null) { + return def; + } + try { + const data = JSON.parse(item); - if (data.expire === null) { - return data.value; - } + if (data.expire === null) { + return data.value; + } - if (data.expire >= new Date().getTime()) { - return data.value; - } - this.storageObj.removeItem(this.prefix + key); - } catch { - return def; + if (data.expire >= new Date().getTime()) { + return data.value; } + this.remove(key); + } catch { + return def; + } + } + /** + * if the key non-exist / no expire time / already expired return -1, + * else return remaining lifetime with unit of ms + * + * @param {string} key + * @returns {number} + * @memberof LSWatcher + */ + ttl(key: string): number { + const item = this.storageObj.getItem(this.prefix + key); + if (item == null) { + return -1; + } + try { + const data = JSON.parse(item); + if (data.expire >= new Date().getTime()) { + return data.expire - new Date().getTime(); + } + return -1; + } catch { + return -1; } - - return def; } init(): void { const keys = Object.keys(this.storageObj); @@ -167,12 +193,12 @@ class LSWatcher { this.storageObj.removeItem(this.prefix + key); this.broadcast(this.prefix + key); } - // 取消订阅 + // 取消订阅 - unsubscribe off(key: string, handler: Symbol): void { this.queue.get(this.prefix + key)!.delete(handler); } } -// 暂时只用单例 +// 暂时只用单例 - single instance export type LsWatcherPlugin = { install(vue: VueConstructor, options: lsOption): void; }; diff --git a/types/main.d.ts b/types/main.d.ts index 8eac16b..c89a40f 100644 --- a/types/main.d.ts +++ b/types/main.d.ts @@ -14,6 +14,7 @@ interface ILSWatcher { init(): void; remove(key: string): void; off(key: string, handler: Symbol): void; + ttl(key: string): number; } export declare type LsWatcherPlugin = { install(vue: VueConstructor, options: lsOption): void;