[插件 - 下载视频 - WASM 混流输出] 持久缓存相关文件

registry/lib/plugins/video/download/wasm-output/database.ts

@@ -0,0 +1,66 @@
+import { meta } from '@/core/meta'
+
+const DB_NAME = 'bilibili-evolved-wasm-output'
+const DB_VERSION = parseInt(meta.compilationInfo.version.replaceAll('.', ''))
+
+export const storeNames = {
+  cache: 'cache',
+} as const
+
+async function database() {
+  return new Promise((reslove: (db: IDBDatabase) => void, reject) => {
+    const req = unsafeWindow.indexedDB.open(DB_NAME, DB_VERSION)
+    req.onerror = reject
+    req.onupgradeneeded = () => {
+      const db = req.result
+      for (const name of db.objectStoreNames) {
+        db.deleteObjectStore(name)
+      }
+      Object.values(storeNames).forEach(v => {
+        db.createObjectStore(v)
+      })
+    }
+    req.onsuccess = () => reslove(req.result)
+  })
+}
+
+async function objectStore(name: string, mode?: IDBTransactionMode) {
+  return database().then(
+    db =>
+      new Promise((reslove: (db: IDBObjectStore) => void, reject) => {
+        const tr = db.transaction(name, mode)
+        reslove(tr.objectStore(name))
+        tr.onerror = reject
+      }),
+  )
+}
+
+async function get(store: IDBObjectStore, key: IDBValidKey | IDBKeyRange) {
+  return new Promise((reslove: (db: any) => void, reject) => {
+    const res = store.get(key)
+    res.onerror = reject
+    res.onsuccess = () => reslove(res.result)
+  })
+}
+
+async function put(store: IDBObjectStore, value: any, key?: IDBValidKey) {
+  return new Promise((reslove: (db: IDBValidKey) => void, reject) => {
+    const res = store.put(value, key)
+    res.onerror = reject
+    res.onsuccess = () => reslove(res.result)
+  })
+}
+
+export async function getOrLoad<K extends keyof typeof storeNames, V>(
+  storeName: K,
+  key: IDBValidKey,
+  loader: (key: IDBValidKey) => V,
+) {
+  const value: V = await objectStore(storeName).then(store => get(store, key))
+  if (value) {
+    return value
+  }
+  const newValue = await loader(key)
+  await objectStore(storeName, 'readwrite').then(store => put(store, newValue, key))
+  return newValue
+}

registry/lib/plugins/video/download/wasm-output/handler.ts

@@ -2,26 +2,35 @@ import { DownloadPackage } from '@/core/download'
 import { meta } from '@/core/meta'
 import { Toast } from '@/core/toast'
 import { FFmpeg } from './ffmpeg'
-import { httpGet, toBlobUrl, toastProgress } from './utils'
+import { getCacheOrGet, httpGet, toastProgress, toBlobUrl } from './utils'
 
 const ffmpeg = new FFmpeg()
 
 async function load(toast: Toast) {
   await ffmpeg.load({
-    workerLoadURL: await toBlobUrl(
-      meta.compilationInfo.altCdn.library.ffmpeg.worker,
+    workerLoadURL: toBlobUrl(
+      await getCacheOrGet(
+        'ffmpeg-worker',
+        meta.compilationInfo.altCdn.library.ffmpeg.worker,
+        toastProgress(toast, '正在加载 FFmpeg Worker'),
+      ),
       'text/javascript',
-      toastProgress(toast, '正在加载 FFmpeg Worker'),
     ),
-    coreURL: await toBlobUrl(
-      meta.compilationInfo.altCdn.library.ffmpeg.core,
+    coreURL: toBlobUrl(
+      await getCacheOrGet(
+        'ffmpeg-core',
+        meta.compilationInfo.altCdn.library.ffmpeg.core,
+        toastProgress(toast, '正在加载 FFmpeg Core'),
+      ),
       'text/javascript',
-      toastProgress(toast, '正在加载 FFmpeg Core'),
     ),
-    wasmURL: await toBlobUrl(
-      meta.compilationInfo.altCdn.library.ffmpeg.wasm,
+    wasmURL: toBlobUrl(
+      await getCacheOrGet(
+        'ffmpeg-wasm',
+        meta.compilationInfo.altCdn.library.ffmpeg.wasm,
+        toastProgress(toast, '正在加载 FFmpeg WASM'),
+      ),
       'application/wasm',
-      toastProgress(toast, '正在加载 FFmpeg WASM'),
     ),
   })
 }

registry/lib/plugins/video/download/wasm-output/utils.ts

@@ -1,5 +1,6 @@
 import { Toast } from '@/core/toast'
 import { formatFileSize, formatPercent } from '@/core/utils/formatters'
+import { getOrLoad, storeNames } from './database'
 
 type OnProgress = (received: number, length: number) => void
 
@@ -47,8 +48,11 @@ export async function httpGet(url: string, onprogress: OnProgress) {
   return chunksAll
 }
 
-export async function toBlobUrl(url: string, mimeType: string, onprogress: OnProgress) {
-  const buffer = await httpGet(url, onprogress)
+export async function getCacheOrGet(key: string, url: string, loading: OnProgress) {
+  return getOrLoad(storeNames.cache, key, async () => httpGet(url, loading))
+}
+
+export function toBlobUrl(buffer: Uint8Array, mimeType: string) {
   const blob = new Blob([buffer], { type: mimeType })
   return URL.createObjectURL(blob)
 }