refactor: refacotr preference
This commit is contained in:
vben
@@ -1 +1 @@
|
||||
export * from './storage-cache';
|
||||
export * from './storage-manager';
|
||||
|
||||
@@ -1,104 +0,0 @@
|
||||
import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { StorageCache } from './storage-cache';
|
||||
|
||||
describe('storageCache', () => {
|
||||
let localStorageCache: StorageCache;
|
||||
let sessionStorageCache: StorageCache;
|
||||
|
||||
beforeEach(() => {
|
||||
localStorageCache = new StorageCache('prefix_', 'localStorage');
|
||||
sessionStorageCache = new StorageCache('prefix_', 'sessionStorage');
|
||||
localStorage.clear();
|
||||
sessionStorage.clear();
|
||||
vi.useFakeTimers();
|
||||
});
|
||||
|
||||
afterEach(() => {
|
||||
vi.useRealTimers();
|
||||
});
|
||||
|
||||
it('should set and get an item with prefix in localStorage', () => {
|
||||
localStorageCache.setItem('testKey', 'testValue');
|
||||
const value = localStorageCache.getItem<string>('testKey');
|
||||
expect(value).toBe('testValue');
|
||||
expect(localStorage.getItem('prefix_testKey')).not.toBeNull();
|
||||
});
|
||||
|
||||
it('should set and get an item with prefix in sessionStorage', () => {
|
||||
sessionStorageCache.setItem('testKey', 'testValue');
|
||||
const value = sessionStorageCache.getItem<string>('testKey');
|
||||
expect(value).toBe('testValue');
|
||||
expect(sessionStorage.getItem('prefix_testKey')).not.toBeNull();
|
||||
});
|
||||
|
||||
it('should return null for expired item in localStorage', () => {
|
||||
localStorageCache.setItem('testKey', 'testValue', 1 / 60); // 1 second expiry
|
||||
vi.advanceTimersByTime(2000); // Fast-forward 2 seconds
|
||||
const value = localStorageCache.getItem<string>('testKey');
|
||||
expect(value).toBeNull();
|
||||
});
|
||||
|
||||
it('should return null for expired item in sessionStorage', () => {
|
||||
sessionStorageCache.setItem('testKey', 'testValue', 1 / 60); // 1 second expiry
|
||||
vi.advanceTimersByTime(2000); // Fast-forward 2 seconds
|
||||
const value = sessionStorageCache.getItem<string>('testKey');
|
||||
expect(value).toBeNull();
|
||||
});
|
||||
|
||||
it('should remove an item with prefix in localStorage', () => {
|
||||
localStorageCache.setItem('testKey', 'testValue');
|
||||
localStorageCache.removeItem('testKey');
|
||||
const value = localStorageCache.getItem<string>('testKey');
|
||||
expect(value).toBeNull();
|
||||
expect(localStorage.getItem('prefix_testKey')).toBeNull();
|
||||
});
|
||||
|
||||
it('should remove an item with prefix in sessionStorage', () => {
|
||||
sessionStorageCache.setItem('testKey', 'testValue');
|
||||
sessionStorageCache.removeItem('testKey');
|
||||
const value = sessionStorageCache.getItem<string>('testKey');
|
||||
expect(value).toBeNull();
|
||||
expect(sessionStorage.getItem('prefix_testKey')).toBeNull();
|
||||
});
|
||||
|
||||
it('should clear all items in localStorage', () => {
|
||||
localStorageCache.setItem('testKey1', 'testValue1');
|
||||
localStorageCache.setItem('testKey2', 'testValue2');
|
||||
localStorageCache.clear();
|
||||
expect(localStorageCache.length()).toBe(0);
|
||||
});
|
||||
|
||||
it('should clear all items in sessionStorage', () => {
|
||||
sessionStorageCache.setItem('testKey1', 'testValue1');
|
||||
sessionStorageCache.setItem('testKey2', 'testValue2');
|
||||
sessionStorageCache.clear();
|
||||
expect(sessionStorageCache.length()).toBe(0);
|
||||
});
|
||||
|
||||
it('should return correct length in localStorage', () => {
|
||||
localStorageCache.setItem('testKey1', 'testValue1');
|
||||
localStorageCache.setItem('testKey2', 'testValue2');
|
||||
expect(localStorageCache.length()).toBe(2);
|
||||
});
|
||||
|
||||
it('should return correct length in sessionStorage', () => {
|
||||
sessionStorageCache.setItem('testKey1', 'testValue1');
|
||||
sessionStorageCache.setItem('testKey2', 'testValue2');
|
||||
expect(sessionStorageCache.length()).toBe(2);
|
||||
});
|
||||
|
||||
it('should return correct key by index in localStorage', () => {
|
||||
localStorageCache.setItem('testKey1', 'testValue1');
|
||||
localStorageCache.setItem('testKey2', 'testValue2');
|
||||
expect(localStorageCache.key(0)).toBe('prefix_testKey1');
|
||||
expect(localStorageCache.key(1)).toBe('prefix_testKey2');
|
||||
});
|
||||
|
||||
it('should return correct key by index in sessionStorage', () => {
|
||||
sessionStorageCache.setItem('testKey1', 'testValue1');
|
||||
sessionStorageCache.setItem('testKey2', 'testValue2');
|
||||
expect(sessionStorageCache.key(0)).toBe('prefix_testKey1');
|
||||
expect(sessionStorageCache.key(1)).toBe('prefix_testKey2');
|
||||
});
|
||||
});
|
||||
@@ -1,145 +0,0 @@
|
||||
import type { IStorageCache, StorageType, StorageValue } from './types';
|
||||
|
||||
class StorageCache implements IStorageCache {
|
||||
protected prefix: string;
|
||||
protected storage: Storage;
|
||||
|
||||
constructor(prefix: string = '', storageType: StorageType = 'localStorage') {
|
||||
this.prefix = prefix;
|
||||
this.storage =
|
||||
storageType === 'localStorage' ? localStorage : sessionStorage;
|
||||
}
|
||||
|
||||
// 获取带前缀的键名
|
||||
private getFullKey(key: string): string {
|
||||
return this.prefix + key;
|
||||
}
|
||||
|
||||
// 获取项之后的钩子方法
|
||||
protected afterGetItem<T>(_key: string, _value: T | null): void {}
|
||||
|
||||
// 设置项之后的钩子方法
|
||||
protected afterSetItem<T>(
|
||||
_key: string,
|
||||
_value: T,
|
||||
_expiryInMinutes?: number,
|
||||
): void {}
|
||||
|
||||
// 获取项之前的钩子方法
|
||||
protected beforeGetItem(_key: string): void {}
|
||||
|
||||
// 设置项之前的钩子方法
|
||||
protected beforeSetItem<T>(
|
||||
_key: string,
|
||||
_value: T,
|
||||
_expiryInMinutes?: number,
|
||||
): void {}
|
||||
|
||||
/**
|
||||
* 清空存储
|
||||
*/
|
||||
clear(): void {
|
||||
try {
|
||||
this.storage.clear();
|
||||
} catch (error) {
|
||||
console.error('Error clearing storage', error);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取存储项
|
||||
* @param key 存储键
|
||||
* @returns 存储值或 null
|
||||
*/
|
||||
getItem<T>(key: string): T | null {
|
||||
const fullKey = this.getFullKey(key);
|
||||
this.beforeGetItem(fullKey);
|
||||
|
||||
let value: T | null = null;
|
||||
try {
|
||||
const item = this.storage.getItem(fullKey);
|
||||
if (item) {
|
||||
const storageValue: StorageValue<T> = JSON.parse(item);
|
||||
if (storageValue.expiry && storageValue.expiry < Date.now()) {
|
||||
this.storage.removeItem(fullKey);
|
||||
} else {
|
||||
value = storageValue.data;
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('Error getting item from storage', error);
|
||||
}
|
||||
|
||||
this.afterGetItem(fullKey, value);
|
||||
return value;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取存储中的键
|
||||
* @param index 键的索引
|
||||
* @returns 存储键或 null
|
||||
*/
|
||||
key(index: number): null | string {
|
||||
try {
|
||||
return this.storage.key(index);
|
||||
} catch (error) {
|
||||
console.error('Error getting key from storage', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取存储项的数量
|
||||
* @returns 存储项的数量
|
||||
*/
|
||||
length(): number {
|
||||
try {
|
||||
return this.storage.length;
|
||||
} catch (error) {
|
||||
console.error('Error getting storage length', error);
|
||||
return 0;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 删除存储项
|
||||
* @param key 存储键
|
||||
*/
|
||||
removeItem(key: string): void {
|
||||
const fullKey = this.getFullKey(key);
|
||||
try {
|
||||
this.storage.removeItem(fullKey);
|
||||
} catch (error) {
|
||||
console.error('Error removing item from storage', error);
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置存储项
|
||||
* @param key 存储键
|
||||
* @param value 存储值
|
||||
* @param expiryInMinutes 过期时间（分钟）
|
||||
*/
|
||||
setItem<T>(key: string, value: T, expiryInMinutes?: number): void {
|
||||
const fullKey = this.getFullKey(key);
|
||||
this.beforeSetItem(fullKey, value, expiryInMinutes);
|
||||
|
||||
const now = Date.now();
|
||||
const expiry = expiryInMinutes ? now + expiryInMinutes * 60_000 : null;
|
||||
|
||||
const storageValue: StorageValue<T> = {
|
||||
data: value,
|
||||
expiry,
|
||||
};
|
||||
|
||||
try {
|
||||
this.storage.setItem(fullKey, JSON.stringify(storageValue));
|
||||
} catch (error) {
|
||||
console.error('Error setting item in storage', error);
|
||||
}
|
||||
|
||||
this.afterSetItem(fullKey, value, expiryInMinutes);
|
||||
}
|
||||
}
|
||||
|
||||
export { StorageCache };
|
||||
130
packages/@vben-core/shared/chche/src/storage-manager.test.ts
Normal file
130
packages/@vben-core/shared/chche/src/storage-manager.test.ts
Normal file
@@ -0,0 +1,130 @@
|
||||
import { beforeEach, describe, expect, it, vi } from 'vitest';
|
||||
|
||||
import { StorageManager } from './storage-manager';
|
||||
|
||||
describe('storageManager', () => {
|
||||
let storageManager: StorageManager<{ age: number; name: string }>;
|
||||
|
||||
beforeEach(() => {
|
||||
vi.useFakeTimers();
|
||||
localStorage.clear();
|
||||
storageManager = new StorageManager<{ age: number; name: string }>({
|
||||
prefix: 'test_',
|
||||
});
|
||||
});
|
||||
|
||||
it('should set and get an item', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' });
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toEqual({ age: 30, name: 'John Doe' });
|
||||
});
|
||||
|
||||
it('should return default value if item does not exist', () => {
|
||||
const user = storageManager.getItem('nonexistent', {
|
||||
age: 0,
|
||||
name: 'Default User',
|
||||
});
|
||||
expect(user).toEqual({ age: 0, name: 'Default User' });
|
||||
});
|
||||
|
||||
it('should remove an item', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' });
|
||||
storageManager.removeItem('user');
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toBeNull();
|
||||
});
|
||||
|
||||
it('should clear all items with the prefix', () => {
|
||||
storageManager.setItem('user1', { age: 30, name: 'John Doe' });
|
||||
storageManager.setItem('user2', { age: 25, name: 'Jane Doe' });
|
||||
storageManager.clear();
|
||||
expect(storageManager.getItem('user1')).toBeNull();
|
||||
expect(storageManager.getItem('user2')).toBeNull();
|
||||
});
|
||||
|
||||
it('should clear expired items', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
|
||||
vi.advanceTimersByTime(1001); // 快进时间
|
||||
storageManager.clearExpiredItems();
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toBeNull();
|
||||
});
|
||||
|
||||
it('should not clear non-expired items', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' }, 10_000); // 10秒过期
|
||||
vi.advanceTimersByTime(5000); // 快进时间
|
||||
storageManager.clearExpiredItems();
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toEqual({ age: 30, name: 'John Doe' });
|
||||
});
|
||||
|
||||
it('should handle JSON parse errors gracefully', () => {
|
||||
localStorage.setItem('test_user', '{ invalid JSON }');
|
||||
const user = storageManager.getItem('user', {
|
||||
age: 0,
|
||||
name: 'Default User',
|
||||
});
|
||||
expect(user).toEqual({ age: 0, name: 'Default User' });
|
||||
});
|
||||
it('should return null for non-existent items without default value', () => {
|
||||
const user = storageManager.getItem('nonexistent');
|
||||
expect(user).toBeNull();
|
||||
});
|
||||
|
||||
it('should overwrite existing items', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' });
|
||||
storageManager.setItem('user', { age: 25, name: 'Jane Doe' });
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toEqual({ age: 25, name: 'Jane Doe' });
|
||||
});
|
||||
|
||||
it('should handle items without expiry correctly', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' });
|
||||
vi.advanceTimersByTime(5000);
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toEqual({ age: 30, name: 'John Doe' });
|
||||
});
|
||||
|
||||
it('should remove expired items when accessed', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
|
||||
vi.advanceTimersByTime(1001); // 快进时间
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toBeNull();
|
||||
});
|
||||
|
||||
it('should not remove non-expired items when accessed', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' }, 10_000); // 10秒过期
|
||||
vi.advanceTimersByTime(5000); // 快进时间
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toEqual({ age: 30, name: 'John Doe' });
|
||||
});
|
||||
|
||||
it('should handle multiple items with different expiry times', () => {
|
||||
storageManager.setItem('user1', { age: 30, name: 'John Doe' }, 1000); // 1秒过期
|
||||
storageManager.setItem('user2', { age: 25, name: 'Jane Doe' }, 2000); // 2秒过期
|
||||
vi.advanceTimersByTime(1500); // 快进时间
|
||||
storageManager.clearExpiredItems();
|
||||
const user1 = storageManager.getItem('user1');
|
||||
const user2 = storageManager.getItem('user2');
|
||||
expect(user1).toBeNull();
|
||||
expect(user2).toEqual({ age: 25, name: 'Jane Doe' });
|
||||
});
|
||||
|
||||
it('should handle items with no expiry', () => {
|
||||
storageManager.setItem('user', { age: 30, name: 'John Doe' });
|
||||
vi.advanceTimersByTime(10_000); // 快进时间
|
||||
storageManager.clearExpiredItems();
|
||||
const user = storageManager.getItem('user');
|
||||
expect(user).toEqual({ age: 30, name: 'John Doe' });
|
||||
});
|
||||
|
||||
it('should clear all items correctly', () => {
|
||||
storageManager.setItem('user1', { age: 30, name: 'John Doe' });
|
||||
storageManager.setItem('user2', { age: 25, name: 'Jane Doe' });
|
||||
storageManager.clear();
|
||||
const user1 = storageManager.getItem('user1');
|
||||
const user2 = storageManager.getItem('user2');
|
||||
expect(user1).toBeNull();
|
||||
expect(user2).toBeNull();
|
||||
});
|
||||
});
|
||||
118
packages/@vben-core/shared/chche/src/storage-manager.ts
Normal file
118
packages/@vben-core/shared/chche/src/storage-manager.ts
Normal file
@@ -0,0 +1,118 @@
|
||||
type StorageType = 'localStorage' | 'sessionStorage';
|
||||
|
||||
interface StorageManagerOptions {
|
||||
prefix?: string;
|
||||
storageType?: StorageType;
|
||||
}
|
||||
|
||||
interface StorageItem<T> {
|
||||
expiry?: number;
|
||||
value: T;
|
||||
}
|
||||
|
||||
class StorageManager<T> {
|
||||
private prefix: string;
|
||||
private storage: Storage;
|
||||
|
||||
constructor({
|
||||
prefix = '',
|
||||
storageType = 'localStorage',
|
||||
}: StorageManagerOptions = {}) {
|
||||
this.prefix = prefix;
|
||||
this.storage =
|
||||
storageType === 'localStorage'
|
||||
? window.localStorage
|
||||
: window.sessionStorage;
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取完整的存储键
|
||||
* @param key 原始键
|
||||
* @returns 带前缀的完整键
|
||||
*/
|
||||
private getFullKey(key: string): string {
|
||||
return `${this.prefix}-${key}`;
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除所有带前缀的存储项
|
||||
*/
|
||||
clear(): void {
|
||||
const keysToRemove: string[] = [];
|
||||
for (let i = 0; i < this.storage.length; i++) {
|
||||
const key = this.storage.key(i);
|
||||
if (key && key.startsWith(this.prefix)) {
|
||||
keysToRemove.push(key);
|
||||
}
|
||||
}
|
||||
keysToRemove.forEach((key) => this.storage.removeItem(key));
|
||||
}
|
||||
|
||||
/**
|
||||
* 清除所有过期的存储项
|
||||
*/
|
||||
clearExpiredItems(): void {
|
||||
for (let i = 0; i < this.storage.length; i++) {
|
||||
const key = this.storage.key(i);
|
||||
if (key && key.startsWith(this.prefix)) {
|
||||
const shortKey = key.replace(this.prefix, '');
|
||||
this.getItem(shortKey); // 调用 getItem 方法检查并移除过期项
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取存储项
|
||||
* @param key 键
|
||||
* @param defaultValue 当项不存在或已过期时返回的默认值
|
||||
* @returns 值，如果项已过期或解析错误则返回默认值
|
||||
*/
|
||||
getItem(key: string, defaultValue: T | null = null): T | null {
|
||||
const fullKey = this.getFullKey(key);
|
||||
const itemStr = this.storage.getItem(fullKey);
|
||||
if (!itemStr) {
|
||||
return defaultValue;
|
||||
}
|
||||
|
||||
try {
|
||||
const item: StorageItem<T> = JSON.parse(itemStr);
|
||||
if (item.expiry && Date.now() > item.expiry) {
|
||||
this.storage.removeItem(fullKey);
|
||||
return defaultValue;
|
||||
}
|
||||
return item.value;
|
||||
} catch (error) {
|
||||
console.error(`Error parsing item with key "${fullKey}":`, error);
|
||||
this.storage.removeItem(fullKey); // 如果解析失败，删除该项
|
||||
return defaultValue;
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 移除存储项
|
||||
* @param key 键
|
||||
*/
|
||||
removeItem(key: string): void {
|
||||
const fullKey = this.getFullKey(key);
|
||||
this.storage.removeItem(fullKey);
|
||||
}
|
||||
|
||||
/**
|
||||
* 设置存储项
|
||||
* @param key 键
|
||||
* @param value 值
|
||||
* @param ttl 存活时间（毫秒）
|
||||
*/
|
||||
setItem(key: string, value: T, ttl?: number): void {
|
||||
const fullKey = this.getFullKey(key);
|
||||
const expiry = ttl ? Date.now() + ttl : undefined;
|
||||
const item: StorageItem<T> = { expiry, value };
|
||||
try {
|
||||
this.storage.setItem(fullKey, JSON.stringify(item));
|
||||
} catch (error) {
|
||||
console.error(`Error setting item with key "${fullKey}":`, error);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
export { StorageManager };
|
||||
Reference in New Issue
Block a user