网络摄像头不能在Android /手机上工作

时间:2017-12-17 13:50:33

标签: javascript android html

我正在创建一个使用webcam的网络应用程序 (我跟着这个啧啧:https://www.youtube.com/watch?v=K_NP_a78Jpk), 它的工作原理只适用于PC / windows。当我在我的Android手机上试用它时需要更新帧/(仅当我在屏幕上移动手指或放大时才有效)。 (jsfiddle不允许webcam,将其复制并粘贴到编辑器中

如何在不触摸屏幕的情况下让视频流继续运行,或者如果我在手机上失去焦点,我该怎么办?

<!DOCTYPE html>
<!--
 *  Created somewhere on the Bahama's.
 *    __̴ı̴̴̡̡̡ ̡͌l̡̡̡ ̡͌l̡*̡̡ ̴̡ı̴̴̡ ̡̡͡|̲̲̲͡͡͡ ̲▫̲͡ ̲̲̲͡͡π̲̲͡͡ ̲̲͡▫̲̲͡͡ ̲|̡̡̡ ̡ ̴̡ı̴̡̡ ̡͌l̡̡̡̡.___
 *  By Samir.
-->
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Gezellige Feestdagen!</title>
    <!--<script src="snowstorm.js"></script>-->
    <!--<link rel="stylesheet" href="style.css">-->
</head>
<body>

<video id="video"></video>
<canvas id="canvas"></canvas>
<br>
<button onclick="snap()">Snap</button>

<script>
    var video = document.getElementById('video');
    var canvas = document.getElementById('canvas');
    var context = canvas.getContext('2d');

    navigator.getUserMedia = navigator.getUserMedia || navigator.webKitGetUserMedia || navigator.mozUserMedia ||
            navigator.ogetUserMedia || navigator.msgetUserMedia;

    if (navigator.getUserMedia) {
        navigator.getUserMedia({video:true}, streamWebCam, throwError);
    }

    function streamWebCam(stream) {
        video.src = window.URL.createObjectURL(stream);
        video.play();
    }

    function throwError(e) {
        alert(e.name);
    }

    function snap() {
        canvas.width = video.clientWidth;
        canvas.height = video.clientHeight;
        context.drawImage(video, 0, 0);
    }
</script>

</body>
</html>

0 个答案:

没有答案