keyboard_backspace wifi_off

Audio recording

This demo captures audio through the device's microphone and enables recording using the MediaRecorder API.

It provides real-time frequency analysis and displays the recording audio as a waveform using the Web Audio API.

The recorded file can be downloaded or saved to the device's file system using the Native File System API when supported.

On iOS, you may need to enable MediaRecorder in:
Settings > Safari > Advanced > Experimental Features > MediaRecorder

This feature is not (yet) supported on your device

Code

Check the audio-recorder repo for the source code of the Web Component that was used in this demo:

https://github.com/DannyMoerkerke/audio-recorder

Documentation

getUserMedia on MDN

MediaRecorder on MDN

Web Audio API on MDN

Browser support

getUserMedia on caniuse.com

MediaRecorder on caniuse.com

Web Audio API on caniuse.com

No access to media

Your device does not have permission to access the microphone. Please enable this in your device's settings.

What PWA Can Do Today A showcase of what is possible with Progressive Web Apps today