Ionic v5 web media capture with capacitor – cordova_not_available


I am building an app with Ionic 5, Capacitor 2 and Angular 11.
I need to capture video and audio using the media capture cordova plugin.

I installed the following modules:

npm install cordova-plugin-media-capture
npm install @ionic-native/media-capture

And added MediaCapture to the providers of my app module.
Then I call mediaCapture.captureVideo() to retrieve a video ; unfortunately an exception is thrown when testing on a browser: cordova_not_available

The github repo states this plugin is web-compatible, and its sources have a browser implementation. However the window.navigator.device.capture is missing to make this plugin work.

Is it a bad configuration from my side? Or this cordova plugin wouldn’t be compatible with capacitor?

I made a repro :

Thank you for your help


I wrote a regular Angular version for the web, if anyone need it:

async browserCapture() {
  const stream: MediaStream = await navigator.mediaDevices.getUserMedia(this.constraints);
  const recorder = new MediaRecorder(stream, {mimeType: 'ogg'});
  const chunks: Blob[] = [];
  recorder.ondataavailable = (event: BlobEvent) => {
    if ( && > 0) {
      chunks.push(; => {
        this.recordChunks = [...chunks];;
  this.recorder.onstop = () => { => {
      stream.getTracks().forEach(t => t.stop());
      if (chunks?.length) {
        this.upload(new Blob(chunks, {type: 'ogg'})); // use the blob result

Answered By – Alexis Deprez

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0

Leave a Reply

(*) Required, Your email will not be published