HTML调用PC摄像头【申明:来源于网络】 ———- 地址:http://www.oschina.net/code/snippet_2440934_55195


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>HTML5调用电脑摄像头实例</title>
<script type="text/javascript">
window.addEventListener("DOMContentLoaded", function() {
// Grab elements, create settings, etc.
var canvas = document.getElementById("canvas"),
context = canvas.getContext("2d"),
video = document.getElementById("video"),
videoObj = { "video": true },
errBack = function(error) {
console.log("Video capture error: ", error.code);
}; // Put video listeners into place
if(navigator.getUserMedia) { // Standard
//alert("支持navigator.getUserMedia");
navigator.getUserMedia(videoObj, function(stream) {
video.src = stream;
video.play();
}, errBack);
} else if(navigator.webkitGetUserMedia) { // WebKit-prefixed
//alert("支持navigator.webkitGetUserMedia");
navigator.webkitGetUserMedia(videoObj, function(stream){
video.src = window.webkitURL.createObjectURL(stream);
video.play();
}, errBack);
}
else if(navigator.mozGetUserMedia) { // Firefox-prefixed
//alert("支持navigator.mozGetUserMedia");
navigator.mozGetUserMedia(videoObj, function(stream){
video.src = window.URL.createObjectURL(stream);
video.play();
}, errBack);
}
// 触发拍照动作
document.getElementById("snap").addEventListener("click", function() {
context.drawImage(video, 0, 0, 640, 480);
}); }, false);
</script>
</head>
<body>
<video id="video" width="640" height="480" autoplay></video><br>
<button id="snap" >点击拍照</button> <br>
<canvas id="canvas" width="640" height="480"></canvas>
</body>
</html>

HTML调用PC摄像头【申明:来源于网络】的更多相关文章

  1. myEclipse导入现成项目出现错误 【申明来源于网络】

    myEclipse导入现成项目出现错误 [申明来源于网络] 原地址:http://blog.sina.com.cn/s/blog_6d7703400100znh6.html file–>impo ...

  2. 微信小程序(微信应用号)组件讲解[申明:来源于网络]

    微信小程序(微信应用号)组件讲解[申明:来源于网络] 地址:http://www.cnblogs.com/muyixiaoguang/p/5902008.html

  3. AngularJS资源合集[备忘]【申明:来源于网络】

    AngularJS资源合集[备忘][申明:来源于网络] 地址:http://blog.csdn.net/allgis/article/details/44646597

  4. Unity调用PC摄像头

    转载于Unity3d圣典里面,具体哪位大侠写的我忘咯. using UnityEngine; using System.Collections; public class CameraTest : M ...

  5. Android基础总结+SQlite数据库【申明:来源于网络】

    Android基础总结+SQlite数据库[申明:来源于网络] 基础总结篇之一:Activity生命周期:http://blog.csdn.net/liuhe688/article/details/6 ...

  6. Hibernate 的hql查询简介【申明:来源于网络】

    Hibernate 的hql查询简介[申明:来源于网络] Hibernate 的hql查询简介:http://blog.csdn.net/leaf_130/article/details/539329 ...

  7. 第二天(就业班) html的引入、html常用标签、实体标签、超链接标签、图片标签、表格、框架标签、表单[申明:来源于网络]

    第二天(就业班) html的引入.html常用标签.实体标签.超链接标签.图片标签.表格.框架标签.表单[申明:来源于网络] 第二天(就业班) html的引入.html常用标签.实体标签.超链接标签. ...

  8. Maven的安装、配置及使用入门+maven安装报错:JAVA_HOME【申明:来源于网络】

    Maven的安装.配置及使用入门+maven安装报错:JAVA_HOME[申明:来源于网络] Maven的安装.配置及使用入门:http://www.cnblogs.com/dcba1112/arch ...

  9. Android总结之json解析(FastJson Gson 对比)[申明:来源于网络]

    Android总结之json解析(FastJson Gson 对比)[申明:来源于网络] 地址:http://blog.csdn.net/u014031072/article/details/5392 ...

随机推荐

  1. 【C++】C++中的迭代器

    目录结构: contents structure [-] 迭代器运算符 迭代器类型 begin和end运算符 迭代器的算术运算 可以使用下标来访问string对象或vector对象的元素,还有另外一种 ...

  2. 分析轮子(一)-ArrayList.java

    前言:之前也看过一些JDK源码,不过没有留下痕迹,经久年月就淡忘了,现在的时机也差不多了,想再看一次,并且记录下来自己的感想,于是从自己使用最多最熟悉的地方开始!并且看的过程中,我希望自己思考一下如下 ...

  3. MySQL和Mongodb的区别与应用场景对比

    MySQL是关系型数据库 优势: 在不同的引擎上有不同 的存储方式. 查询语句是使用传统的sql语句,拥有较为成熟的体系,成熟度很高. 开源数据库的份额在不断增加,mysql的份额页在持续增长. 缺点 ...

  4. mac 下 通过 brew 安装 MariaDB

    其实在两年多前,我就推荐大家使用MariaDB了,其实真的很好用,性能高,也可以完全替代mysql 主要是这oracle实在是太**了,java都收费了,mysql迟早的事... 安装MariaDB之 ...

  5. MySQL字符集详解

    Reference:  https://www.cnblogs.com/wcwen1990/p/6917109.html MySQL字符集详解   一.字符集和校验规则 字符集是一套符合和编码,校验规 ...

  6. windows安装centos7子系统

    Windows的Linux子系统(wsl ) 自从有了wsl后,基本上虚拟机都省了,对于离不开Windows的便捷,Linux对开发的友好的人来说,真是一大利器.可惜默认的系统没有centos,幸运的 ...

  7. mysql使用自增Id为什么存储比较快

    转自:https://blog.csdn.net/bigtree_3721/article/details/73151028 InnoDB引擎表的特点 1.InnoDB引擎表是基于B+树的索引组织表( ...

  8. quartz与spring boot-最简模式

    多年前使用过quartz,今天又需要再用,而且是在spring boot框架下.很神奇,spring也是十年前用过的. 这里仅记录下完成的最快速和简单的操作,高级的使用以后有空弄明白了再写: 1.增加 ...

  9. Linux服务器重启后MySQL启动失败

    Redirecting to /bin/systemctl start  mysql.service Job for mysqld.service failed because the control ...

  10. could not resolve property: leader_id of: pojo.Project

    https://www.cnblogs.com/zhaocundang/p/9211270.html hibernate 双向1对多 出现问题 外键解析错误! log4j:WARN No append ...