Electron主进程导入WASM报错及运行进程选择咨询

嘿，我来帮你搞定这两个问题！先从你遇到的具体错误说起，再聊聊主进程vs渲染进程跑WASM的选择。

一、解决"Only absolute URLs are supported"错误 #

你在主进程里用fetch("test.wasm")触发这个错误，核心原因有两个：

1. node-fetch不支持相对路径：主进程里的fetch是node-fetch包提供的，它不像浏览器环境的fetch那样能自动解析相对路径，必须传入绝对URL。
2. 主进程无DOM环境：你代码里的document.getElementById("runButton")会直接报错——主进程是Node.js环境，根本没有document对象！

修复后的主进程代码示例： #

const { ipcMain } = require('electron')
const path = require('path');
const { fileURLToPath } = require('url');
require('/Users/devuser/development/electron-api-demos/script/wasm_exec.js')
const fetch = require("node-fetch");

ipcMain.on('asynchronous-message', async (event, arg) => {
  if (!WebAssembly.instantiateStreaming) { // 兼容旧环境的polyfill
    WebAssembly.instantiateStreaming = async (resp, importObject) => {
      const source = await (await resp).arrayBuffer();
      return await WebAssembly.instantiate(source, importObject);
    };
  }

  // 把相对路径转成绝对file://协议URL
  const wasmAbsolutePath = path.join(__dirname, 'test.wasm');
  const wasmUrl = fileURLToPath(`file://${wasmAbsolutePath}`);

  const go = new Go();
  let mod, inst;
  try {
    const result = await WebAssembly.instantiateStreaming(fetch(wasmUrl), go.importObject);
    mod = result.module;
    inst = result.instance;
    // 主进程不能操作DOM，把初始化完成的信号发回渲染进程处理UI
    event.sender.send('wasm-init-done');
    // 执行WASM逻辑
    await go.run(inst);
    inst = await WebAssembly.instantiate(mod, go.importObject); // 重置实例
    // 把执行结果返回给渲染进程
    event.sender.send('asynchronous-reply', 'WASM执行完成');
  } catch (err) {
    console.error(err);
    event.sender.send('wasm-error', err.message);
  }
})

对应的渲染进程UI处理代码：

// 渲染进程代码
const { ipcRenderer } = require('electron');
ipcRenderer.on('wasm-init-done', () => {
  document.getElementById("runButton").disabled = false;
});

二、WASM该放主进程还是渲染进程？ #

你提到现在WASM在渲染进程里能正常运行，那咱直接分析两者的适用场景：

优先选渲染进程的情况： #

• 需要和UI交互：渲染进程有完整的浏览器环境，DOM操作、相对路径fetch这些都不用额外适配，你已经验证过能跑，没必要折腾主进程。
• 稳定性要求高：渲染进程崩溃只会影响当前页面，主进程崩溃会直接导致整个Electron应用退出，渲染进程的隔离性更安全。
• CPU密集型任务：可以把WASM放到渲染进程的Web Worker里，避免阻塞UI线程，用户体验更流畅。

考虑主进程的情况： #

• 需要系统级权限：WASM要直接读写本地文件、调用系统API时，主进程有Node.js的完整权限，不用额外申请权限。
• 后台离线任务：比如批量处理本地文件这类不需要和UI交互的场景，可以放在主进程，但要注意：
  • 主进程不能被长时间阻塞，否则整个应用会卡死，长时间任务建议用Node.js的worker_threads或child_process来跑WASM。
  • 必须处理环境差异（无DOM、fetch需绝对URL等）。

总结 #

• 先把主进程里的DOM操作移到渲染进程，把WASM路径转成绝对file URL，就能解决当前的错误。
• 如果你现在在渲染进程里跑WASM一切正常，继续用渲染进程就好，除非有必须用主进程的特殊场景。

完整错误信息：
TypeError: Only absolute URLs are supported at parseURL (/Users/devuser/development/electron-api-demos/node_modules/node-fetch/dist/index.cjs:897:8) at new Request (/Users/devuser/development/electron-api-demos/node_modules/node-fetch/dist/index.cjs:922:17) at /Users/devuser/development/electron-api-demos/node_modules/node-fetch/dist/index.cjs:1175:19 at new Promise (<anonymous>) at fetch (/Users/devuser/development/electron-api-demos/node_modules/node-fetch/dist/index.cjs:1173:9) at IpcMainImpl.<anonymous> (/Users/cbourne/development/electron-api-demos/main-process/communication/async-msg.js:20:36) at IpcMainImpl.emit (events.js:223:5) at WebContents.<anonymous> (electron/js2c/browser_init.js:4093:15) at WebContents.emit (events.js:223:5)

内容的提问来源于stack exchange，提问作者user1513388