11

我正在开发一个使用电子构建的应用程序，它应该与 wavesurfer.js 一起显示代表音频文件的波形。但是，我无法使用fs模块打开文件并通过 Blob 将文件内容推送到 wavesurfer。文件加载，一切似乎都正常，但在解码 wavesurfer 时说Error decoding audiobuffer。

我认为可能会影响这一点的两件事：

  • 该fs.readFile函数将编码作为第二个参数
  • typeBlob 构造函数将选项对象作为第二个参数，在此您可以通过属性定义 mimetype

然而，到目前为止，这两种方法都未能解决问题。

我希望有人有解决方案。（也可能是该fs.readFile功能完全是错误的方法，并且有更好的方法；我只是在寻找一种相对高效的打开文件的方法，感谢您的帮助）干杯！

这是代码……</p>

（我省略了所有的电子样板，你可以通过这样做轻松获得它git clone https://github.com/sindresorhus/electron-boilerplate/） - 在 中包含一个脚本标签，main.js在html 中的某处index.html添加一个带有 id 的 divwave-area并将一个脚本标签添加到wavesurfer.js 库. 此外，您还需要演示 wav-file的本地副本。

然后在main.js文件中……</p> 

var fs = require('fs');

var wavesurfer = Object.create(WaveSurfer);
wavesurfer.init({
  container: '#wave-area'
});

fs.readFile('/path/to/demo.wav', function(err, data) {
  if (data && !err) {
    console.log('has data and no error!');
  }
  var file = new window.Blob([data]);
  wavesurfer.loadBlob(file);
}

wavesurfer.on('loading', function(e) {
  console.log('loading', e);
});

wavesurfer.on('error', function(err) {
  console.log(err);
});
4

1 回答 1

12

我终于找到了解决方案！通过该loadBlob方法传递给 wavesurfer 的 blob 需要转换为Uint8Array

工作代码如下所示

fs.readFile('/path/to/demo.wav', function(err, buffer) {
  // …
  var blob = new window.Blob([new Uint8Array(buffer)]);
  wavesurfer.loadBlob(blob);
}
于 2015-07-11T18:31:14.277 回答