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. Redis简单示例

    1.Redis是一个开源的使用ANSI C语言编写.支持网络.可基于内存亦可持久化的日志型.Key-Value数据库,并提供多种语言的API. 从2010年3月15日起,Redis的开发工作由VMwa ...

  2. [C#] .NET Core/Standard 1.X 项目中如何使用XmlIgnoreAttribute等标准范围外的内容，兼谈如何解决“violation of security transparency rules failed”（违反安全透明规则失败）异常

    作者: zyl910 一.缘由 XML序列化是一个很常用的功能,但对于.NET Core/Standard,其直到2.0版才内置支持XML序列化.具体来说, .NET Core 2.0 或 .NET ...

  3. Java驱动远程连接mongoDB(简明易懂版)

    mongodb默认是不能远程连接的,而且在linux安装完你会发现,它的目录极其简单,连个配置文件都没有. 我的mongodb的版本是3.6,目前最新的.https://www.mongodb.com ...

  4. [转]Ubuntu18.04搜狗拼音输入法候选栏乱码解决方法

    经常碰到安装完搜狗拼音输入法后候选栏是乱码的情况,解决方法如下: 输入如下命令: cd ~/.config sudo rm -rf SogouPY* sogou* 1 2 之后重启即可. 安装过程可参 ...

  5. Win10 15063 开始运行不保存历史记录原因和解决方法

    http://www.ampc8.com/thread-23421-1-1.html 在Win10 1703的时候你也许会发现开始运行以后,再次打开就没有任何历史记录了,常规方法是桌面-右键-个性化- ...

  6. H3C Comware V3 端口聚合

    通常链路聚合有三种模式:手工汇聚.静态LACP汇聚和动态LACP汇聚. 但是V3版本下只提供了 手工聚合模式 manual 和 静态LACP聚合模式 static 两种 V3版本配置链路聚合 1,创建 ...

  7. 【GMT43智能液晶模块】例程十三：FATFS实验——文件操作

    实验原理: STM32F429上带有SDIO控制器,GMT43液晶模块上将SDIO连接到TF卡座.本实验 将Micro SD卡插入TF卡座上即可.通过FATFS创建test.txt文件,并且写入数据0 ...

  8. Http url MVC Request Query Form 传参专贴

    一.工具区 [参考]postman中 form-data.x-www-form-urlencoded.raw.binary的区别--转 二..net MVC 三..net WebForm 四.Java ...

  9. maven报 Failed to execute goal org.apache.maven.plugins:maven-compiler-plugin:3.0:compile(defalut-compile) on project 项目名称:No such compile 'javac'

    这个问题纠结了一天,在另外一个电脑是正常的,但是从服务器下载下来到另外一个电脑的时候却出现了如下图问题 看到javac大家都会想到是编译出现问题,而本地的配置如下图所示: 看着配置都是一致的,会是哪里 ...

  10. sql知识点记录

    order by就是排序. group by就是分组. WHERE语句在GROUP BY语句之前:SQL会在分组之前计算WHERE语句.    HAVING语句在GROUP BY语句之后:SQL会在分 ...