getUserMedia API

特别有趣的一个 API，能够调用电脑的摄像头，未来这个 API 将被广泛用来让浏览器和用户之间互动。

如果 <video> 标签和 Canvas 现结合 就能在浏览器中拍摄照片了。（你不是在说废话吧  ）

直接看代码  ：

 <html>

 <body onload="load()">

     <video id="video" style="background: darkblue; width: 500px;height: 500px;"></video>

 </audio>

 <script>

   window.addEventListener("DOMContentLoaded",function(){

         var v = document.getElementById("video");

       var vobj = {"video" : true}

         ///监听

           if(navigator.getUserMedia){

               navigator.getUserMedia(vobj , function(Mstream){

                   v.src =  Mstream ;

                   v.play();

               },function(error){

                   console.log(error.code)

               })

       }else if(navigator.webkitGetUserMedia){

           navigator.webkitGetUserMedia(vobj , function(Mstream){

               v.src = window.webkitURL.createObjectURL(Mstream);

               v.play()

           },function(error){

                   console.log(error.code)

               })

       }

   },false)

 </script>

 </body>

 </html>

getUserMedia API的更多相关文章

  1. getUserMedia API及HTML5 调用摄像头和麦克风

    getUserMedia API简介 HTML5的getUserMedia API为用户提供访问硬件设备媒体(摄像头.视频.音频.地理位置等)的接口,基于该接口,开发者可以在不依赖任何浏览器插件的条件 ...

  2. Safari支不支持HTML5录音？ 现在浏览器中最好的解决方案是WebRTC下的 navigator.getUserMedia API。

    先放结论:Safari支不支持HTML5录音? ——据我调查,不支持. 现在浏览器中最好的解决方案是WebRTC下的 navigator.getUserMedia API. 可是当使用Can I us ...

  3. getUserMedia API及HTML5 调用手机摄像头拍照

    getUserMedia API简介 HTML5的getUserMedia API为用户提供访问硬件设备媒体(摄像头.视频.音频.地理位置等)的接口,基于该接口,开发者可以在不依赖任何浏览器插件的条件 ...

  4. 使用 getUserMedia API获取麦克风和相机等流媒体

    概览 mediaDevices 是 Navigator 对象的只读属性,一个单列对象,可以连接访问相机和麦克风,屏幕共享等媒体输入设备 方法 enumerateDevices 请求一个可用的媒体输入和 ...

  5. 另5个你不知道的HTML5接口API

    原文地址: 5 More HTML5 APIs You Didn’t Know Existed 演示地址: 全屏API Demo 原文日期: 2012年11月08日 翻译日期: 2013年08月13日 ...

  6. Web开发者的最爱 5个超实用的HTML5 API

    摘要:毫无疑问,HTML5已经成为当今最流行的一门技术,尤其是Web开发者们对HTML5的兴趣是日趋渐浓.HTML5的许多功能也都能在现代浏览器中得以实现.然而,作为开发者,除了关注HTML5的功能和 ...

  7. WebRTC开发基础（WebRTC入门系列1：getUserMedia）

    什么是WebRTC WebRTC由IETF(Internet Engineering Task Force——互联网工程任务组)和W3C(World Wide Web Consortium——万维网联 ...

  8. 你可能不知道的5 个强大的HTML5 API 函数

    HTML5提供了一些非常强大的JavaScript和HTML API,来帮助开发者构建精彩的桌面和移动应用程序.本文将介绍5个新型的API,希望对你的开发工作有所帮助. 1.  全屏API(Fulls ...

  9. 全屏API接口

    HTML5的诞生给我们提供了很多精彩的JavaScript和HTML新功能和新特征.有些新特征我们已知多年并大量的使用,而另外一些主要是用在前沿的手机移动技术上,或者桌面应用中起辅助作用.不管这些HT ...

随机推荐

  1. Codeforces Round #263 (Div. 2)C(贪心，联想到huffman算法)

    数学家伯利亚在<怎样解题>里说过的解题步骤第二步就是迅速想到与该题有关的原型题.(积累的重要性!) 对于这道题,可以发现其实和huffman算法的思想很相似(可能出题人就是照着改编的).当 ...

  2. SQL多表联查总结

    交叉连接:(不常用)返回两个表的笛卡尔乘积(也即全组合排列)中符合查询条件的数据行. 内连接返回连接表中符合连接条件和查询条件的数据行. 左外连接返回符合连接条件和查询条件(即:内连接)的数据行,且还 ...

  3. linux大于2T的磁盘格式化

    fdisk默认只能格式小于2T的磁盘,我们经常会碰到大于2T的磁盘,我们不能fdisk 格式化. 我们得用parted 来的格式化 parted 命令可能没有,yum install -y parte ...

  4. storm 学习教程

    转自:http://blog.csdn.net/hrn1216/article/details/51538962 翻译太累了,再也不想去翻译了,真的太累了: 在这个教程中, 你将学到如何创建一个Sto ...

  5. Milking Time（DP）

    个人心得:一开始自己找状态,是这么理解的,只要前面一个满足就等于此时的值加上d(n-1),否则就是不挖此时的比较d(n-1)和 d(n-2)+cost,不过仔细一想忽略了很多问题,你无法确定n-2和此 ...

  6. [UOJ171][WC2016]挑战NPC

    uoj luogu bzoj sol 你可以列一个表格. 一个框子里放球的数量 0 1 2 3 对"半空框子"数量的贡献 1 1 0 0 把一个框子拆三个点.两两之间连边. 会发现 ...

  7. 学习动态性能表(22)V$resource_limit

    学习动态性能表 第20篇--V$resource_limit  2007.6.15 就一条SQL语句供你参考: select * from V$RESOURCE_LIMIT where resourc ...

  8. Js里头的对象字面量

    JavaScript 对象字面量 在编程语言中,字面量是一种表示值的记法.例如,"Hello, World!" 在许多语言中都表示一个字符串字面量(string literal ) ...

  9. PyCharm 2017.2.2+PyQt5+Python3.6.0

    PyCharm注册地址 http://idea.imsxm.com/ 安装的是miniconda激活虚拟环境执行pip install PyQt5pip install PyQt5-tools 从官网 ...

  10. Day2-Python基础2---集合和文件操作

    一.集合操作 集合是一个无序的,不重复的数据组合,它的主要作用如下: 去重,把一个列表变成集合,就自动去重了 关系测试,测试两组数据之前的交集.差集.并集等关系 s = set([1,4,5,7,3, ...