web-dev-qa-db-ja.com

JavaScriptでウェブカメラにアクセスする方法

JavaScriptでウェブカメラを開く必要があります。<video>しかし、純粋なJavaScriptでウェブカメラにアクセスする必要がある

誰かが私を助けたり、アイデアをくれたりできますか？

JavaScriptを使用してウェブカメラにアクセスするだけで済みます。英語で申し訳ありませんが、Google翻訳を使用しています。

タグ「<video>」を使用できません

javascripthtml5webcam
15
Leonardo Lacerda

コメントとして述べたように、私はあなたの言葉遣いについて混乱しています。あなたは、「HTML5」がウェブカメラにアクセスできることを知っていますが、純粋なJavascriptでそれを必要とします。

さて、あなたが知らない場合、HTML5は、WebRTCReal-Time Communicationsの略です。その一部は、と呼ばれる新しいものです navigator.getUserMedia（） navigator.mediaDevices.getUserMedia(constraints)も導入されました。つまり、ECMAscriptオブジェクトを使用すると、ユーザーのマシンWebCamおよびMicrophoneデバイス。

ご覧のとおり、ショー全体がHTML5ロールアウト/仕様に埋め込まれているため、ここでは実際にJavascriptとHTML5を分離することはできません。

参考文献：

26
jAndy

HTML5フォールバックの状況でのみフラッシュを使用するjsライブラリは次のとおりです。

https://github.com/jhuckaby/webcamjs

コードサンプルから：

<script src="webcam.js"></script>

<div id="my_camera" style="width:320px; height:240px;"></div>
<div id="my_result"></div>

<script language="JavaScript">
    Webcam.attach( '#my_camera' );

    function take_snapshot() {
        Webcam.snap( function(data_uri) {
            document.getElementById('my_result').innerHTML = '<img src="'+data_uri+'"/>';
        } );
    }
</script>

<a href="javascript:void(take_snapshot())">Take Snapshot</a>
13
Luke Cummings

HTML5rocksのこの素晴らしいチュートリアル があります。

基本的に、 getUserMedia を使用すると、ブラウザーは許可を求めてから、カメラを使用できます。

特にインターネット経由でこれらのストリームを送信する場合は、サポートがまだ不十分であり、APIが再び変更される可能性があることに注意する必要があります。

4
Denys Séguret

現在、これを行うためのJavaScriptライブラリがいくつかあります。

3
o2bjang