openimsdk / open-im-sdk-web-wasm

JS SDK for OpenIM Web use by Webassembly of go
https://openim.io
Apache License 2.0
33 stars 43 forks source link

[BUG] WebAssembly.instantiateStreaming Execution error here #95

Open gortonlau opened 2 months ago

gortonlau commented 2 months ago

OpenIM Server Version

最新版本

Operating System and CPU Architecture

Linux (AMD)

Deployment Method

Source Code Deployment

Bug Description and Steps to Reproduce

我在main.js当中执行

import { getSDK } from '@/modules/open-im-sdk-web-wasm';

const IMSDK = getSDK({ coreWasmPath: "/public/openIM.wasm", sqlWasmPath: "/public/sql-wasm.wasm", });

浏览器控制台输出

index.es.js:953 Failed to initialize WASM: TypeError: WebAssembly.instantiate(): Import #0 "gojs": module is not an object or function

我确定将wasm文件放入了public文件夹,同时的确也发现wasm的代码被缓存到了caches

我尝试最小化代码测试,在控制台运行以下代码 var initialized = false; var CACHE_KEY = "openim-wasm-cache";

async function fetchWithCache(url) { if (!("caches" in window)) { return fetch(url); } const cache = await caches.open(CACHE_KEY); const cachedResponse = await cache.match(url); const isResourceUpdated = async () => { const serverResponse = await fetch(url, { method: "HEAD" }); const etag = serverResponse.headers.get("ETag"); const lastModified = serverResponse.headers.get("Last-Modified"); return serverResponse.ok && (etag !== (cachedResponse === null || cachedResponse === void 0 ? void 0 : cachedResponse.headers.get("ETag")) || lastModified !== (cachedResponse === null || cachedResponse === void 0 ? void 0 : cachedResponse.headers.get("Last-Modified"))); }; if (cachedResponse && !await isResourceUpdated()) { return cachedResponse; } return fetchAndUpdateCache(url, cache); }

async function fetchAndUpdateCache(url, cache) { const response = await fetch(url, { cache: "no-cache" }); await cache.put(url, response.clone()); return response; }

async function initializeWasm(url) { if (initialized) { return null; } if (typeof window === "undefined") { return Promise.resolve(null); } go = new Go(); console.log(go.importObject); let wasm; try { if ("instantiateStreaming" in WebAssembly) { wasm = await WebAssembly.instantiateStreaming(fetchWithCache(url), go.importObject); } else { const bytes = await fetchWithCache(url).then((resp) => resp.arrayBuffer()); wasm = await WebAssembly.instantiate(bytes, go.importObject); } go.run(wasm.instance); } catch (error) { console.error("Failed to initialize WASM:", error); return null; } await wait(100); initialized = true; return go; }

initializeWasm("/openIM.wasm")

结果依然是报错

image image

package.json依赖如下

{ "name": "vue-project", "version": "0.0.0", "private": true, "type": "module", "scripts": { "dev": "vite", "build": "vite build", "preview": "vite preview" }, "dependencies": { "open-im-sdk-wasm": "^3.8.0-rc.0", "pinia": "^2.1.7", "vue": "^3.4.29", "vue-router": "^4.3.3" }, "devDependencies": { "@vitejs/plugin-vue": "^5.0.5", "vite": "^5.3.1", "vite-plugin-vue-devtools": "^7.3.1" } }

Screenshots Link

No response

cipchk commented 1 month ago

升级到 3.8.0-rc.0 会产生相同情况,但是在 3.5.3-alpha.7 是正常的。

Bloomingg commented 1 month ago

you can try again with latest version and replace assets folder.

cipchk commented 1 month ago

如果 assets 文件都是最新的话,也可能是因为使用了旧版的 worker.js