javascript - 使用 Add-On SDK 加载音频文件并使用 Aurora.js 播放

Question

我目前正在尝试使用附加组件 SDK 为 Mozilla Firefox 编写音乐播放器附加组件。我正在使用 Aurora.js ( Wiki ) 处理音频文件的加载/解复用/解码

我目前已经让附加组件正常工作，因此您可以选择带有 HTML 文件输入的音频文件，这非常简单。

    <input type="file" id="file-selector" />
    <script>
        var fileSelector = document.getElementById("file-selector");

        fileSelector.onchange = function() {
            var audioFile = fileSelector.files[0];

            var audioPlayer = AV.Player.fromFile(audioFile);

            audioPlayer.play();
        };
    </script>

虽然我目前正在尝试做的是读取从附加 SDK 返回的文件而不是从 HTML 页面上的输入文件，并创建一个 AV.Player。使用 sdk/io/file 读取文件非常简单和 sdk/io/byte-streams 模块。

问题是我不知道如何根据这些数据正确构建 AV.Player。从外观上看:

1. AV.Player.fromFile(x)通过构建一个 AV.Asset 来工作来自 AV.Asset.fromFile(x)
2. AV.Asset.fromFile(x)构造一个 AV.Asset与 AV.FileSource(x)
3. AV.FileSource通过创建 FileReader 构建和以 Blob 的形式从文件中读取数据

我一直在尝试弄清楚如何使用 io/file.read(filePath, "br") 返回的字节数组创建一个 Blob，但没有成功。我尝试创建一个类似于具有大小、类型和切片方法的 Blob 的对象，但这似乎也不起作用。

Answer 1

由于您将(或至少应该)在某些内容脚本(小部件、面板等)中使用 Aurora，因此事情会稍微复杂一些。

1. 读取 main.js 中的数据，例如通过您已经提到的 file 模块。
2. 通过消息传递该数据到内容脚本。

3. 在内容脚本中，接收消息，将字节包装在 Uint8Array 中并执行您的 Aurora 操作:

   addon.port.on("bytes-loaded", function(stream) {
     var data = new Uint8Array(stream.length);
     for (var i = 0; i < stream.length; ++i) {
         data[i] = String.charCodeAt(stream[i]) & 0xff;
     }
     avPlayer = AV.Player.fromBuffer(data);
   });
   

file 模块不是很好，因为它是一个同步 API，会在读取文件时阻塞，但至少有 one alternative .

NetUtil 异步文件读取的完整示例，无需将字符串转换为 Javascript 领域的数组，可在 this builder 中找到。 ，但请确保替换硬编码路径。 ;)