fix(libass): failed to construct Worker when use cdn (#127)

AlistGo · Dec 31, 2023 · a8866ce · a8866ce
1 parent d88d177
commit a8866ce
Show file tree

Hide file tree

Showing 2 changed files with 44 additions and 13 deletions.
diff --git a/src/components/artplayer-plugin-ass/index.js b/src/components/artplayer-plugin-ass/index.js
@@ -1,27 +1,65 @@
 import SubtitlesOctopus from "libass-wasm"
-import legacyWorkerUrl from "libass-wasm/dist/js/subtitles-octopus-worker-legacy.js?url"
 import workerUrl from "libass-wasm/dist/js/subtitles-octopus-worker.js?url"
+import wasmUrl from "libass-wasm/dist/js/subtitles-octopus-worker.wasm?url"
 
 import TimesNewRomanFont from "./fonts/TimesNewRoman.ttf?url"
 import fallbackFont from "./fonts/SourceHanSansCN-Bold.woff2?url"
 
 let instance = null
 
+function isAbsoluteUrl(url) {
+  return /^https?:\/\//.test(url)
+}
+
+function toAbsoluteUrl(url) {
+  if (isAbsoluteUrl(url)) return url
+
+  // handle absolute URL when the `Worker` of `BLOB` type loading network resources
+  return new URL(url, document.baseURI).toString()
+}
+
+function loadWorker({ workerUrl, wasmUrl }) {
+  return new Promise((resolve) => {
+    fetch(workerUrl)
+      .then((res) => res.text())
+      .then((text) => {
+        let workerScriptContent = text
+
+        workerScriptContent = workerScriptContent.replace(
+          /wasmBinaryFile\s*=\s*"(subtitles-octopus-worker\.wasm)"/g,
+          (_match, wasm) => {
+            if (!wasmUrl) {
+              wasmUrl = new URL(wasm, toAbsoluteUrl(workerUrl)).toString()
+            } else {
+              wasmUrl = toAbsoluteUrl(wasmUrl)
+            }
+
+            return `wasmBinaryFile = "${wasmUrl}"`
+          },
+        )
+
+        const workerBlob = new Blob([workerScriptContent], {
+          type: "text/javascript",
+        })
+        resolve(URL.createObjectURL(workerBlob))
+      })
+  })
+}
+
 function setVisible(visible) {
   if (instance.canvasParent)
     instance.canvasParent.style.display = visible ? "block" : "none"
 }
 
 function artplayerPluginAss(options) {
-  return (art) => {
+  return async (art) => {
     instance = new SubtitlesOctopus({
       // TODO: load available fonts from manage panel
       availableFonts: {
-        "times new roman": TimesNewRomanFont,
+        "times new roman": toAbsoluteUrl(TimesNewRomanFont),
       },
-      fallbackFont,
-      legacyWorkerUrl,
-      workerUrl,
+      workerUrl: await loadWorker({ workerUrl, wasmUrl }),
+      fallbackFont: toAbsoluteUrl(fallbackFont),
       video: art.template.$video,
       ...options,
     })

diff --git a/vite.config.ts b/vite.config.ts
@@ -3,7 +3,6 @@ import { defineConfig } from "vite"
 import solidPlugin from "vite-plugin-solid"
 import legacy from "@vitejs/plugin-legacy"
 import { dynamicBase } from "vite-plugin-dynamic-base"
-import copyPlugin from "rollup-plugin-copy"
 
 export default defineConfig({
   resolve: {
@@ -17,12 +16,6 @@ export default defineConfig({
     legacy({
       targets: ["defaults"],
     }),
-    copyPlugin({
-      targets: [
-        { src: "node_modules/libass-wasm/**/*.wasm", dest: "dist/assets" },
-      ],
-      hook: "writeBundle",
-    }),
     dynamicBase({
       // dynamic public path var string, default window.__dynamic_base__
       publicPath: " window.__dynamic_base__",