Audio recording with HTML5 Web Audio Api

问题

Does anyone know if the Web Audio API provides the ability to save audio played using the WebAudioContext?

回答1:

I actually wrote a small utility called RecorderJS that might help.

回答2:

There is a startRendering function in Chrome at least (haven't checked Safari). I think it's undergoing some rework and thus isn't included in the spec, but might be added at a later stage (or not). If you want to check out the current implementation, have a look at the answer at Is there a way to use the Web Audio API to sample audio faster than real-time?

回答3:

There is a W3C specification for a recording API http://www.w3.org/TR/mediastream-recording/ , but as of now it is being implemented only in Firefox.

Client side there is available only the ScriptProcessorNode hack (which is what Record.js is based on).

Alternatively, for some use cases it might make sense to stream the audio to a server using WebRTC and write a server side recorder using Libjingle.

回答4:

This library work fine, web audio api only (meaning no i.e users): https://github.com/higuma/web-audio-recorder-js

But we can fairly use it now: http://caniuse.com/#feat=audio-api

Anyway like you said your sound is already in an audiocontext, so I think you are looking for how to use the AudioDestinationNode, the final node of the web audio api. As soon as you can playing your audio through a regular html audio player, you will gain the record function on right click, like playDataUri do. You need to add the attribute "controls" to the player, or you can make a special link with download attribute. I made a small enhancement of the Mdn script to send the data to an player, it should give you a good idea:



    var audioCtx = new AudioContext();
    var source = audioCtx.createMediaElementSource(myMediaElement);
        myMediaElement = document.createElement("audio");
        myMediaElement.setAttribute("autoplay", true);
        myMediaElement.setAttribute("src", uri);
        myMediaElement.setAttribute("controls", "controls");
        document.getElementById('player').appendChild(myMediaElement);
    source.connect(audioCtx.destination);


来源：https://stackoverflow.com/questions/13003852/audio-recording-with-html5-web-audio-api

标签

web-audio-api