20211109

3 years ago · 38fdc57c18
parent c8236e4db9
commit 38fdc57c18
1 changed files with 78 additions and 0 deletions
--- a/code/dpro/templates/vedio.html
+++ b/code/dpro/templates/vedio.html
@ -0,0 +1,78 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <title>Vedio</title>
+    <style>
+        body{
+            background-color:#98b7c4;
+        }
+
+        video{
+            width: 70%;
+            height: 50%;
+            margin: 50px auto;
+            background-color: aquamarine;
+            display: block;
+        }
+        h3{
+            margin-left:50px auto;
+        }
+    </style>
+</head>
+<body>
+<div>
+<h3><label id="time" style="color: #000; "></label></h3>
+<video id="video"></video>
+</div>
+
+<script>
+    var video = document.getElementById('video');
+
+
+    if (navigator.mediaDevices.getUserMedia) {
+        //最新的标准API
+        navigator.mediaDevices.getUserMedia({video : {width: 1000, height: 1000}}).then(success).catch(error);
+    } else if (navigator.webkitGetUserMedia) {
+        //webkit核心浏览器
+        navigator.webkitGetUserMedia({video : {width: 1000, height: 1000}},success, error)
+    } else if (navigator.mozGetUserMedia) {
+        //firfox浏览器
+        navigator.mozGetUserMedia({video : {width: 1000, height: 1000}}, success, error);
+    } else if (navigator.getUserMedia) {
+        //旧版API
+        navigator.getUserMedia({video : {width: 1000, height: 1000}}, success, error);
+    }
+        function success(stream) {
+        //兼容webkit核心浏览器
+        // let CompatibleURL = window.URL || window.webkitURL;
+
+        //将视频流设置为video元素的源
+        console.log(stream);
+
+        //video.src = CompatibleURL.createObjectURL(stream);
+        video.srcObject = stream;
+        video.play();
+    }
+
+    function error(error) {
+        console.log(`访问用户媒体设备失败${error.name}, ${error.message}`);
+    }
+    function mytime(){
+
+    var a = new Date();
+
+    var b = a.toLocaleTimeString();
+
+    var c = a.toLocaleDateString();
+
+    document.getElementById("time").innerHTML = c+"&nbsp"+b;
+
+    }
+
+    setInterval(function() {mytime()},1000);
+
+</script>
+
+</body>
+</html>