javascript - 不可读错误 : Could not start source

Question

我已经在我的项目中添加了这段代码

if (navigator.mediaDevices === undefined) {
  navigator.mediaDevices = {};
}

if (navigator.mediaDevices.getUserMedia === undefined) {
  navigator.mediaDevices.getUserMedia = function (constraints) {

    var getUserMedia = (
      navigator.getUserMedia ||
      navigator.webkitGetUserMedia ||
      navigator.mozGetUserMedia
    );

    if (!getUserMedia) {
      return Promise.reject(new Error('getUserMedia is not implemented in this browser'));
    }

    return new Promise(function (resolve, reject) {
      getUserMedia.call(navigator, constraints, resolve, reject);
    });

  };
}

然后我尝试使用 getUserMedia 访问视频流

navigator.mediaDevices.getUserMedia({
    video: true,
    audio: false
}).then(stream => {
    // do stuff
}).catch(error => {
    console.log(error.name + " " + error.message);
});

当我在我的模拟器中测试它时它适用于 android 版本 5 和更高版本，但是当我在实际设备上运行它时我得到这个错误

NotReadableError Could not start source

我已经添加了 cordova-plugin-media-capture 插件以确保我的应用程序将请求适当的权限，但是我不想使用该插件我宁愿使用 getUserMedia API。

到目前为止，我的研究表明这个错误的原因是其他一些应用程序已经在使用相机但事实并非如此，我什至更进一步并重新启动设备，然后打开我的应用程序，确保有没有其他正在运行的应用程序，我仍然遇到错误。

有人遇到过这个问题吗？

Answer 1

更新 - 2020 年 11 月 19 日

WKWebView 可以在 iOS 14.3 beta 1 中使用 getUserMedia。

• https://bugs.webkit.org/show_bug.cgi?id=208667
• https://bugs.chromium.org/p/chromium/issues/detail?id=752458

更新 - 2020 年 4 月 6 日

另一个错误票据专门针对 WKWebView 提交。没有支持。 https://bugs.webkit.org/show_bug.cgi?id=208667

更新独立模式，在 iOS 13.4 中获取 getUserMedia 访问权限 https://bugs.webkit.org/show_bug.cgi?id=185448#c6

更新 - 2019 年 9 月 14 日

iOS 13 和 Safari 13 上的 Safari 发生了变化:https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes

SFSafariViewController 已获得 getUserMedia 功能(!!!，但是我需要确认这一点，请参阅下面的报告以获取它的工作情况)

https://bugs.webkit.org/show_bug.cgi?id=183201

但是 WKWebView 似乎没有获得 getUserMedia 功能:

https://bugs.chromium.org/p/chromium/issues/detail?id=752458 https://bugs.webkit.org/show_bug.cgi?id=185448

iOS 13 和 Safari 13 发行说明:

https://developer.apple.com/documentation/ios_ipados_release_notes/ios_13_release_notes https://developer.apple.com/documentation/safari_release_notes/safari_13_release_notes

更新 - 04/11/2018 - 工作 Ionic、Cordova 和 Native android 示例的链接以及说明

GitHub link to working Cordova example

GitHub link to working Android example

GitHub link to a working Ionic example

在Android上通过Cordova框架实现getUserMedia访问的步骤是:

• 按照 Cordova Android 安装说明 ( link )
• 将权限添加到 AndroidManifiest.xml ( link )
• 保存 WebRTC Adapter.js文件到 ./www/js/adapter.js 并包含在 ./www/index.html
• 添加 cordova 插件添加 cordova-plugin-android-permissions
• 在./www/js/index.js 文件中添加插件权限代码和必要的getUserMedia 代码。确保使用 getUserMedia 适配器。请将此文件作为示例 (link)。

请在 GitHub 项目中查看完整的逐行说明以及成功和错误图像。

---

我不确定这有多少与 Cordova 相关...但是，当我制作自己的 Android getUserMedia 测试应用程序 (link) 时，我遇到了这个错误。它主要取决于 native 应用程序的用户权限，然后是父应用程序如何创建 webview，您的应用程序中打包了哪个版本的 webrtc，以及您如何调用 getUserMedia。

应用程序的 JavaScript 端:与其自己编写浏览器 shim 代码，不如确保使用 WebRTC 适配器 ( link )。这消除了很多常见问题。您可以在此处查看示例 (link)。我还建议您查看此处的 WebRTC 示例 (link)。

应用程序的 native 端:您将需要视频和音频的麦克风和摄像头用户权限。这是罪魁祸首。您需要确保在创建 WebView 之前它们已被接受。因此，所有权限检查、弹出窗口等都需要在创建 WebView 之前发生。如果在您很可能需要重启 App 等之后授予权限。

当您构建和部署应用程序时，如果您尚未收到提示，请转至应用程序设置并手动启用权限。那么它应该可以工作。

我无法让视频/音频模拟仅在实际设备上的模拟器中工作。在接受权限之前，我也只在使用 WebChromeView 的 Android 上遇到了 NotReadableError。最后，Android 的最低 API 版本是 21 (Lollipop)，因为父应用程序需要通过 WebView onPermissionRequest (link) 允许运行时权限。

由于许多应用内浏览器(Facebook、Pinterest 等)不处理 Android 上的 onPermissionRequest，通过网站的 WebRTC 通常不起作用。在 iOS 上，它保证(截至 2018 年 4 月)不起作用，因为 Apple 只允许通过 Safari 访问 WebRTC。因此，Cordova 仅限于 Android API 21 如果它正确处理了权限。