From 61700dd24bd6ec10f788d501afbe4357d38e517f Mon Sep 17 00:00:00 2001
From: hzj <1304805162@qq.com>
Date: Fri, 24 Apr 2026 17:16:09 +0800
Subject: [PATCH] =?UTF-8?q?feat(=E5=9B=BE=E7=89=87=E7=BC=93=E5=AD=98?=
 =?UTF-8?q?=E5=B7=A5=E5=85=B7):=20=E5=B1=80=E5=9F=9F=E7=BD=91=E9=93=BE?=
 =?UTF-8?q?=E6=8E=A5=EF=BC=8C=E5=BD=93=E6=B5=8F=E8=A7=88=E5=99=A8=E6=B2=A1?=
 =?UTF-8?q?=E6=9C=89=20window.caches=20=E6=97=B6=EF=BC=8C=E4=B8=8D?=
 =?UTF-8?q?=E5=86=8D=E6=8A=A5=E9=94=99=EF=BC=8C=E8=80=8C=E6=98=AF=E9=99=8D?=
 =?UTF-8?q?=E7=BA=A7=E6=88=90=E6=99=AE=E9=80=9A=20fetch=20+=20blob=20+=20o?=
 =?UTF-8?q?bject=20URL=EF=BC=8C=E7=9B=B4=E6=8E=A5=E4=BD=BF=E7=94=A8?=
 =?UTF-8?q?=E7=BD=91=E7=BB=9C=E5=8A=A0=E8=BD=BD?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/utils/image/imageCacheManager.js | 39 ++++++++++++++++++++--------
 1 file changed, 28 insertions(+), 11 deletions(-)

diff --git a/src/utils/image/imageCacheManager.js b/src/utils/image/imageCacheManager.js
index a75412e..0fa9f2c 100644
--- a/src/utils/image/imageCacheManager.js
+++ b/src/utils/image/imageCacheManager.js
@@ -49,6 +49,11 @@ class ImageCacheManager {
     return currentMajor > cachedMajor
   }
 
+  getCacheStorage() {
+    if (typeof window === 'undefined') return null
+    return window.caches || null
+  }
+
   // 返回对应的缓存
   async getCacheForUrl(url) {
     // 规范化 URL
@@ -67,8 +72,12 @@ class ImageCacheManager {
       cacheName = this.imageCacheName
     }
 
+    if (!this.getCacheStorage()) {
+      return { cache: null, cacheName }
+    }
+
     try {
-      const cache = await caches.open(cacheName)
+      const cache = await this.getCacheStorage().open(cacheName)
       return { cache, cacheName } // 返回包含缓存和名称的对象
     } catch (error) {
       console.error(`打开缓存失败: ${cacheName}`, error)
@@ -233,17 +242,18 @@ class ImageCacheManager {
 
   // 清除旧的OSS图片缓存
   async clearOldImageCaches() {
-    if (!('caches' in window)) return
+    const cacheStorage = this.getCacheStorage()
+    if (!cacheStorage) return
 
     try {
-      const cacheNames = await caches.keys()
+      const cacheNames = await cacheStorage.keys()
       const oldImageCaches = cacheNames.filter(
         (name) =>
           name.startsWith('likei-images-v') && !name.includes(`v${this.currentImageVersion}`), // 排除当前版本的缓存
       )
 
       console.log('正在清除旧的OSS图片缓存:', oldImageCaches)
-      await Promise.all(oldImageCaches.map((name) => caches.delete(name)))
+      await Promise.all(oldImageCaches.map((name) => cacheStorage.delete(name)))
       this.currentImageCacheSize = 0 // 重置计数器
     } catch (error) {
       console.warn('清理旧的OSS图片缓存失败:', error)
@@ -252,17 +262,18 @@ class ImageCacheManager {
 
   // 清除旧的本地assets缓存
   async clearOldAssetCaches() {
-    if (!('caches' in window)) return
+    const cacheStorage = this.getCacheStorage()
+    if (!cacheStorage) return
 
     try {
-      const cacheNames = await caches.keys()
+      const cacheNames = await cacheStorage.keys()
       const oldAssetCaches = cacheNames.filter(
         (name) =>
           name.startsWith('likei-assets-v') && !name.includes(`v${this.currentImageVersion}`), // 排除当前版本的缓存
       )
 
       console.log('正在清除旧的本地assets缓存:', oldAssetCaches)
-      await Promise.all(oldAssetCaches.map((name) => caches.delete(name)))
+      await Promise.all(oldAssetCaches.map((name) => cacheStorage.delete(name)))
       this.currentAssetCacheSize = 0 // 重置计数器
     } catch (error) {
       console.warn('清理旧的本地assets缓存失败:', error)
@@ -271,16 +282,17 @@ class ImageCacheManager {
 
   // 清除所有图片缓存（OSS图片、本地assets图片）
   async clearAllCaches() {
-    if (!('caches' in window)) return
+    const cacheStorage = this.getCacheStorage()
+    if (!cacheStorage) return
 
     try {
-      const cacheNames = await caches.keys()
+      const cacheNames = await cacheStorage.keys()
       const allCaches = cacheNames.filter(
         (name) => name.startsWith('likei-images-v') || name.startsWith('likei-assets-v'),
       )
 
       console.log('正在清除所有图片缓存:', allCaches)
-      await Promise.all(allCaches.map((name) => caches.delete(name)))
+      await Promise.all(allCaches.map((name) => cacheStorage.delete(name)))
       // 重置计数器
       this.currentImageCacheSize = 0
       this.currentAssetCacheSize = 0
@@ -328,7 +340,7 @@ class ImageCacheManager {
 
   // 从缓存获取图片
   async getCachedImage(url) {
-    if (!('caches' in window)) return null
+    if (!this.getCacheStorage()) return null
 
     try {
       // 规范化 URL
@@ -337,6 +349,7 @@ class ImageCacheManager {
       // 只从缓存获取本地资源
       if (this.isBuildAsset(normalizedUrl)) {
         const { cache, cacheName } = await this.getCacheForUrl(normalizedUrl) // 选中对应缓存
+        if (!cache) return null
 
         // 尝试多种匹配方式
         // 带配置的 Request 对象匹配：严格匹配具有特定 CORS 配置和凭证策略的缓存响应，确保请求模式一致
@@ -460,6 +473,10 @@ class ImageCacheManager {
 
         if (this.isBuildAsset(src)) {
           const { cache, cacheName } = await this.getCacheForUrl(src)
+          if (!cache) {
+            const blob = await response.blob()
+            return URL.createObjectURL(blob)
+          }
           const clonedResponse = response.clone() // 克隆响应用于缓存
           await cache.put(src, clonedResponse) // 写入缓存