Example access Camera with getUserMedia WebRTC


Here is quick example to access camera from browser using getUserMedia(). Make sure you have latest Firefox / Chrome version and have getUserMedia enabled.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
<html>
    <head>
        <title>Getting started with RTC</title>
    </head>
    <body>
        <video id="video" width="320" height="400"></video>

        <script type="text/javascript">
            navigator.getUserMedia = navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia;
            window.URL = window.URL || window.webkitURL || window.mozURL || window.msURL;

            function initialize() {
                // The source video.
                video = document.getElementById("video");
                width = video.width;
                height = video.height;

                // Get the webcam’s stream.
                navigator.getUserMedia({
                    video : true
                }, startStream, function() {
                });
            }

            function startStream(stream) {
                video.src = URL.createObjectURL(stream);
                video.play();

            }

            initialize();
        </script>

    </body>
</html>

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.