Using <audio> element for playback of raw audio

纵然是瞬间 提交于 2019-12-21 05:14:13

问题


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.

I have a AudioContext object that's decoded and buffered with createBufferSource

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

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?

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.

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


回答1:


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

That would allow you to set the src attribute.

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


来源:https://stackoverflow.com/questions/17245178/using-audio-element-for-playback-of-raw-audio

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!