我想写一个从网页调用摄像头的页面,然后用IE跑不起来
如题,在chrome里面倒是成功地跑起来了,以下是我从其他地方找到的代码 ,求指点该怎么改让它也支持IE?
!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<video id="video" autoplay=""style='width:640px;height:480px'></video>
<div><button id='picture' style="align:center">PICTURE</button></div>
<canvas id="canvas" width="640" height="480"></canvas>
<script type="text/javascript">
var video = document.getElementById("video");
var context = canvas.getContext("2d");
var errocb = function () {
console.log('sth wrong!');
}
if (navigator.getUserMedia) { // 标准的API
navigator.getUserMedia({ "video": true }, function (stream) {
video.src = stream;
video.play();
}, errocb);
} else if (navigator.webkitGetUserMedia) { // WebKit 核心的API
navigator.webkitGetUserMedia({ "video": true }, function (stream) {
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errocb);
}
document.getElementById("picture").addEventListener("click", function () {
context.drawImage(video, 0, 0, 640, 480);
});
</script>
</body>
</html>
!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
</head>
<body>
<video id="video" autoplay=""style='width:640px;height:480px'></video>
<div><button id='picture' style="align:center">PICTURE</button></div>
<canvas id="canvas" width="640" height="480"></canvas>
<script type="text/javascript">
var video = document.getElementById("video");
var context = canvas.getContext("2d");
var errocb = function () {
console.log('sth wrong!');
}
if (navigator.getUserMedia) { // 标准的API
navigator.getUserMedia({ "video": true }, function (stream) {
video.src = stream;
video.play();
}, errocb);
} else if (navigator.webkitGetUserMedia) { // WebKit 核心的API
navigator.webkitGetUserMedia({ "video": true }, function (stream) {
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errocb);
}
document.getElementById("picture").addEventListener("click", function () {
context.drawImage(video, 0, 0, 640, 480);
});
</script>
</body>
</html>
...全文
相关推荐
大华ocx插件,完美嵌入web页面,百分百ie可用,web端完美调用大华摄像头
web页面完美调用大华摄像头demo,可实现对摄像头视频采集、显示、操作,demo支持ie,完美运行无bug,非其他无法运行ocx插件可比。
vue网页调用手机摄像头,webview如何实现
近期有个需求,通过vue的网页调用手机摄像头,拍摄完成后,传回照片给vue。 作为刚开始接触安卓的小白,看了非常多的案例,都是新建camera类,处理拍照、拍视频、查看照片等操作。而我的需求非常简单,就是点击按钮,拍照,给网页返回照片而已,不需要如此复杂的操作,于是尝试着用简单的方式完成调用摄像头的功能。 (1)vue端,增加一个a标签,设置跳转关键字camera,这个是安卓识别要调用摄像头的...
IE+Flash+vue项目调用摄像头拍照
代码是vue的项目,先用npm install初始化,再用npm run dev指令即可
大华摄像头网页播发插件--IE, 谷歌38以下可以用
大华摄像头网页播发插件,支持IE,谷歌38版本以下,高版本谷歌不支持
海康摄像头OCX控件(2015)exe安装集成版+网页demo
海康威视的摄像头在网页中进行集成时候需要安装OCX控件,此资源为exe版本,安装之后打开index.html这个demo文件。会提示下载安装cab,再次点击安装,即可使用。index.html这个demo中提供了海康摄像头集成的大部分功能,为大家提供参考。


