使用 Phonegap 在画布/视频中显示相机流答案

【问题标题】：Show Camera stream in Canvas / Video using Phonegap使用 Phonegap 在画布/视频中显示相机流
【发布时间】：2014-08-31 18:32:27
【问题描述】：

对于 Phonegap (Android)，我们目前正在研究将 Android 设备的摄像头流设置为视频元素来源的可能性。有点像网络浏览器上的 gUM 行。

我们想用 Phonegap 构建一个视频聊天应用。

文档只显示了调用本机相机应用程序的函数，这不是我们要寻找的。p>

是否可以在带有 Phonegap 的 HTML 元素中显示 Android 移动设备的摄像头流？

【问题讨论】：

我们参与了人行横道项目 (crosswalk-project.org/#documentation/cordova) 以获得对 gUM 的完全访问权限。

标签： cordova camera cordova-plugins

【解决方案1】：

你有没有看过 getUserMedia https://developer.mozilla.org/en-US/docs/NavigatorUserMedia.getUserMedia

和https://github.com/HenrikJoreteg/getUserMedia

【讨论】：

您好，感谢您抽出宝贵时间回答这个问题。我们尝试在 Phonegap 框架中使用 gUM 和其他与相机相关的 API，但没有提供我们正在寻找的东西。我们在一个项目中找到了一个解决方案，它将 Chromium Webview 的更高版本与 Cordova 相结合。 (crosswalk-project.org/#documentation/cordova)

【解决方案2】：

插件名称：phonegap-plugin-media-stream.

使用此插件并在 HTML 中添加视频标签并使用 JS 代码。它对我有用。

HTML : 视频标签

JS：

var constraints = navigator.mediaDevices.getSupportedConstraints();
alert(constraints);

navigator.mediaDevices.getUserMedia({
    'video': {
        'facingMode': 'environment'
    }
}).then(function(mediaStream) {
    var mediaControl = document.querySelector('video');
    mediaControl.srcObject = mediaStream;
    mediaControl.src = URL.createObjectURL(mediaStream);
});

【讨论】：