1 <video autoplay></video>
2
3 <script>
4 const constraints = {
5 video: true,
6 };
7
8 const video = document.querySelector("video");
9
10 navigator.mediaDevices.getUserMedia(constraints).then((stream) => {
11 video.srcObject = stream;
12 });
13 </script>
14
1<html>
2 <head>
3 <meta charset="utf-8" />
4 <title>camera test.com</title>
5
6 <style>
7 #container {
8 margin: 0px auto;
9 width: 500px;
10 height: 375px;
11 border: 10px #333 solid;
12 }
13 #videoElement {
14 width: 500px;
15 height: 375px;
16 background-color: #666;
17 }
18 </style>
19 </head>
20
21 <body>
22 <div id="container">
23 <video autoplay="true" id="videoElement"></video>
24 </div>
25 <script>
26 var video = document.querySelector("#videoElement");
27 if (navigator.mediaDevices.getUserMedia) {
28 navigator.mediaDevices
29 .getUserMedia({ video: true })
30 .then(function(stream) {
31 video.srcObject = stream;
32 })
33 .catch(function(err0r) {
34 console.log("Something went wrong!");
35 });
36 }
37 </script>
38 </body>
39