Ionic v5网络媒体捕捉电容器-cordova_not_available

Question

我正在用Ionic 5、Capacitor 2和Angular 11构建一个应用程序。我需要使用媒体捕获cordova插件捕获视频和音频。

我安装了以下模块：

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

并将MediaCapture添加到我的应用程序模块的提供商中。然后我调用mediaCapture.captureVideo((来检索视频；不幸的是，在浏览器上测试时抛出了一个异常：cordova_not_available

github repo声明该插件与网络兼容，其源代码具有浏览器实现。然而，window.navigator.device.capture缺失，无法使该插件正常工作。

从我的角度来看，这是一个糟糕的配置吗？或者这个cordova插件与电容器不兼容

我责备道：https://stackblitz.com/edit/ionic-v5-media-capture-capacitor?file=src/app/app.component.ts

感谢您的帮助

Answer 1

我为web编写了一个常规的Angular版本，如果有人需要的话：

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 (event.data && event.data.size > 0) {
chunks.push(event.data);
this.zone.run(() => {
this.recordChunks = [...chunks];
this.cd.markForCheck();
});
}
};
this.recorder.onstop = () => {
this.zone.run(() => {
stream.getTracks().forEach(t => t.stop());
if (chunks?.length) {
this.upload(new Blob(chunks, {type: 'ogg'})); // use the blob result
}
});
};
recorder.start(500);
}