/** * 获取应用缓存大小的组合式函数 */ export function useCacheSize() { const cacheSize = ref("计算中..."); const isLoading = ref(false); /** * 计算当前应用使用的缓存大小 */ async function calculateCacheSize() { isLoading.value = true; try { if ("storage" in navigator && "estimate" in navigator.storage) { // 使用 Storage API 获取精确的存储使用量 const estimate = await navigator.storage.estimate(); const usageInMB = ((estimate.usage || 0) / (1024 * 1024)).toFixed(2); cacheSize.value = `${usageInMB} MB`; } else { // 降级方案:计算 localStorage 大小 let totalSize = 0; for (const key in localStorage) { if (Object.prototype.hasOwnProperty.call(localStorage, key)) { totalSize += localStorage[key].length + key.length; } } const sizeInKB = (totalSize / 1024).toFixed(2); cacheSize.value = `${sizeInKB} KB`; } } catch (error) { console.error("计算缓存大小失败:", error); cacheSize.value = "未知"; } finally { isLoading.value = false; } } /** * 获取缓存大小的原始字节数 */ async function getCacheSizeInBytes(): Promise { try { if ("storage" in navigator && "estimate" in navigator.storage) { const estimate = await navigator.storage.estimate(); return estimate.usage || 0; } else { let totalSize = 0; for (const key in localStorage) { if (Object.prototype.hasOwnProperty.call(localStorage, key)) { totalSize += localStorage[key].length + key.length; } } return totalSize; } } catch (error) { console.error("获取缓存大小失败:", error); return 0; } } /** * 清除应用缓存 */ async function clearCache(): Promise { isLoading.value = true; try { // 清除 localStorage localStorage.clear(); // 清除 sessionStorage sessionStorage.clear(); // 清除 Service Worker 缓存 if ("serviceWorker" in navigator) { const registrations = await navigator.serviceWorker.getRegistrations(); for (const registration of registrations) { await registration.unregister(); } } // 清除 Cache API 缓存 if ("caches" in window) { const cacheNames = await caches.keys(); await Promise.all( cacheNames.map(cacheName => caches.delete(cacheName)), ); } // 清除 IndexedDB(如果需要) if ("indexedDB" in window) { const databases = await indexedDB.databases(); await Promise.all( databases.map((db) => { if (db.name) { return new Promise((resolve, reject) => { const request = indexedDB.deleteDatabase(db.name!); request.onsuccess = () => resolve(); request.onerror = () => reject(request.error); }); } return Promise.resolve(); }), ); } // 重新计算缓存大小 await calculateCacheSize(); } catch (error) { console.error("清除缓存失败:", error); throw error; } finally { isLoading.value = false; } } return { cacheSize, isLoading, calculateCacheSize, getCacheSizeInBytes, clearCache, }; }