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. NYOJ-626-intersection set（二分查找）

    题目链接 /* Name:NYOJ-626-intersection set Copyright: Author: Date: 2018/4/12 21:30:10 Description: 二分查找 ...

  2. 20165210 Java第一周学习总结

    20165210 2018<Java程序设计>第一周总结 教材学习内容总结 第一章知识要点 Java在当代需求量极高 Java程序不依赖平台 Java内置对多线程的支持 重点安装JDK 源 ...

  3. codeforces D. Area of Two Circles' Intersection 计算几何

    D. Area of Two Circles' Intersection time limit per test 2 seconds memory limit per test 256 megabyt ...

  4. php实现二叉树的遍历

  5. tensorflow 学习笔记-1

    http://www.jianshu.com/p/e112012a4b2d 参考的网站 -------------------------------------------------------- ...

  6. 修改vmware中的FreeBSD配置

    在运行虚拟机之前,将操作系统安装文件挂载到CD-ROM中,然后,启动虚拟机,并用root用户进入操作系统.做如下操作: 1:挂载光盘文件: #mount /cdrom 2:运行系统安装程序,就可以显示 ...

  7. COGS1516. 棋盘上的车

    [题目描述] 在n*n(n≤20)的方格棋盘上放置n 个车,求使它们不能互相攻击的方案总数. [输入格式] 一行一个正整数n. [输出格式] 一行一个正整数,即方案总数. [样例输入] 3 [样例输出 ...

  8. CAS单点登录系统简介

    一.cas简介 全名:Central Authentication Service特点: 1.开源的.多协议的 SSO 解决方案: Protocols : Custom Protocol . CAS ...

  9. try catch(java)

    1 try.catch.finally语句中,在如果try语句有return语句,则返回的之后当前try中变量此时对应的值,此后对变量做任何的修改,都不影响try中return的返回值 2 如果fin ...

  10. CentOS 7 安装Percona，Xtrabackup

    CentOS 7 安装Percona 5.7,Xtrabackup 简介 Percona Server为 MySQL 数据库服务器进行了改进,在功能和性能上较 MySQL 有着很显著的提升.该版本提升 ...