使用< audio>用于播放原始音频的元素 [英] Using <audio> element for playback of raw audio

查看:96
本文介绍了使用< audio>用于播放原始音频的元素的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我正在开发一个解密(使用openpgp.js)并使用Web Audio API解码服务器端音频文件的小项目。解密的文件作为原始音频到达客户端。目前我可以使用 source.start(0)播放音频文件,但似乎没有一种简单的方法可以将音频转储到允许用户使用的GUI做一些事情,比如调整音量和搜索音频。

I'm working on a little project that decrypts (using openpgp.js) and decodes a server-side audio file using the Web Audio API. The decrypted file arrives to the client as raw audio. Currently I can play back audio files using source.start(0) but there doesn't seems to be an easy way to dump the audio to a GUI that would allow users to do things like adjust volume and seek through the audio.

我有一个 AudioContext 对象,用<解码和缓冲 createBufferSource

function playSound(decodedAudio) {
  var source = context.createBufferSource();
  source.buffer = decodedAudio;
  source.connect(context.destination);
  source.start(0);
}

因为收到原始音频我不能简单地使用像 audio.src = ... 带有音频元素。或者我可能忽略了一些明显的东西?

有没有办法在Web Audio API中使用这个解码后的音频很好地与目的地< audio> 元素?

Because it's raw audio being received I can't simple use something like audio.src = ... with an audio element. Or maybe I'm overlooking something obvious?
Is there a way to have this decoded audio within the Web Audio API play nicely with a destination <audio> element?

理想的流程看起来像...

1)用户点击以吸引播放音频片段

2)音频在服务器端解密并作为原始音频发送到客户端

3)音频已解码且可播放,可搜索...等。

The ideal flow would look something like...
1) User clicks to engage the playback of an audio clip
2) The audio is decrypted server side and sent to the client as a raw audio
3) The audio is decoded and playable, seekable...etc.

我喜欢的可能解决方案


- 因为音频文件的范围可以是1分钟到60分钟,使用FileSystem API将音频写入文件,然后使用< audio> 元素进行实际播放

- 写我自己的用于在Web Audio API之上暂停,清理和调整音量的控制系统

Possible solutions that I'd love thoughts on
- Because the audio files can range anywhere from 1 minute to 60 minutes, write the audio to a file using the FileSystem API and then use an <audio> element for actual playback
- Write my own control system for pausing, scrubbing, and volume on top of the Web Audio API

推荐答案

好问题!最简单的解决方案是将解码的内容存储在 中Blob

Nice question! The simplest solution would be storing the decoded content in a Blob.

这将允许您设置 src 属性。

var blob = new Blob(decodedData, {type: "correct-mimetype/here"});
var url = URL.createObjectURL(blob);
audio.src = url;

这篇关于使用&lt; audio&gt;用于播放原始音频的元素的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆