Question

我试图在我的电子应用程序中使用AudioWorklet进行计量等，当在开发模式下执行时，该工作正常，而工作模式由http://localhost:3000/processor.js之类的快速开发服务器提供服务。但是，如果我尝试以生产模式运行该应用程序，则该文件将在本地提供，例如file：//tmp/etc/etc/build/processor.js，并且在开发人员控制台中，我什至可以看到文件已正确预览，但是我收到此错误消息：

未捕获（承诺）的DOMException：用户中止了请求。

我看到在over here之前还有其他人遇到类似的问题，但是不幸的是，我在堆栈溢出方面的声誉还不够高，无法直接发表评论。那里的将mime类型更改为application / javascript或text / javascript的建议听起来不错，但我不知道如何强制电子对特定文件使用特定的mime类型。此外，在“网络”标签中的开发人员控制台中，看来铬实际上已经在为我的processor.js假定一个javascript文件。

我已经尝试用这样的自定义协议加载工作表

protocol.registerStandardSchemes(['worklet']);

app.on('ready', () => {
  protocol.registerHttpProtocol('worklet', (req, cb) => {
    fs.readFile(req.url.replace('worklet://', ''), (err, data) => {
      cb({ mimeType: 'text/javascript', data });
    });
  });
});

然后添加工作项时

await ctx.audioWorklet.addModule('worklet://processor.js');

不幸的是，这只会导致这些错误，然后是第一个错误

GET worklet：//processor.js/ 0（）
未捕获的错误：您提供的错误不包含堆栈跟踪。
...

Answer 1

如果有人感兴趣，我发现了一个骇人听闻的解决方案。为了使mime-type电子/铬满意，我用文件api作为字符串加载了worklet文件，将其转换为带有mime-type text / javascript的blob，然后从中创建对象url

const processorPath = isDevMode ? 'public/processor.js' : `${global.__dirname}/processor.js`;
const processorSource = await readFile(processorPath); // just a promisified version of fs.readFile
const processorBlob = new Blob([processorSource.toString()], { type: 'text/javascript' });
const processorURL = URL.createObjectURL(processorBlob);
await ctx.audioWorklet.addModule(processorURL);

希望这可以帮助遇到相同问题的任何人...

Answer 2

如果您正在使用Webpack编译源代码，则应该能够将web-worker loader用于自定义工作程序脚本。

在电子内部使用AudioWorklet（DOMException：用户中止请求）

2 个答案: