<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<title>GetUserMedia实例</title>
</head>
<body>
<video id="video" autoplay><ideo>
</body>
<script type="text/javascript">
var getUserMedia = (navigator.getUserMedia || navigator.webkitGetUserMedia || navigator.mozGetUserMedia || navigator.msGetUserMedia);
getUserMedia.call(navigator, {
video: true,
audio: true
}, function(localMediaStream) {
var video = document.getElementById('video');
video.src = window.URL.createObjectURL(localMediaStream);
video.onloadedmetadata = function(e) {
console.log("Label: " + localMediaStream.label);
console.log("AudioTracks" , localMediaStream.getAudioTracks());
console.log("VideoTracks" , localMediaStream.getVideoTracks());
};
}, function(e) {
console.log('Reeeejected!', e);
});
</script>
<html>

h5调用摄像头的更多相关文章

  1. 摄像头调用,h5调用摄像头进行扫一扫插件备份

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  2. 移动端H5调用摄像头(选择上传图片)

    <label>照相机</label> <input type="file" id='image' accept="image/*" ...

  3. H5 调用摄像头

    WebRTC(Web Real-Time Communication,网页实时通信),是一个支持网页浏览器进行实时语音对话或视频对话的API. 1.getUserMedia 要播放摄像头的影像,首先需 ...

  4. JavaScripts调用摄像头【MediaDevices.getUserMedia()】

    h5调用摄像头(允许自定义界面)[MediaDevices.getUserMedia()] <!DOCTYPE html> <html lang="en"> ...

  5. Unity 3D 调用摄像头捕获照片 录像

    1,要想调用摄像头首先要打开摄像头驱动,如果用户允许则可以使用. 2,定义WebCamTexture的变量用于捕获单张照片. 3,连续捕获须启用线程. 实现代码: using UnityEngine; ...

  6. 基于H5的摄像头视频数据流采集

    最近,为了支持部门团队的项目,通过H5实现摄像头的视频流数据的捕获,抓取到视频流后,传输到视频识别服务器进行后续的逻辑处理. 视频数据的采集过程,其实是比较没有谱的过程,因为之前没有研究过HTML5操 ...

  7. h5调用底层接口的一些知识

    之前接触过这方面的知识,一直想写一些关于代码的文字,但考虑到浪费时间,又不具备大神的实力,也不想去把别人的代码照搬过来,所以一直都是空白着的,今天敲代码的时候,有了一个比较好的想法,第一,定位在学习这 ...

  8. vue实现PC端调用摄像头拍照人脸录入、移动端调用手机前置摄像头人脸录入、及图片旋转矫正、压缩上传base64格式/文件格式

    进入正题 1. PC端调用摄像头拍照上传base64格式到后台,这个没什么花里胡哨的骚操作,直接看代码 (canvas + video) <template> <div> &l ...

  9. 谷歌使用navigator.mediaDevices.getUserMedia 调用摄像头拍照功能，不兼容IE

    <template>     <div>       <!--canvas截取流-->       <canvas ref="canvas" ...

随机推荐

  1. 用PowerMock mock final类

    mock final类相对简单,直接贴代码 被测方法: public class FinalEmployeeService { public void insertEmployee(Employee ...

  2. Ruby Cucumber环境

    1.http://rubyinstaller.org/downloads 下载rubyinstaller以及developmentkit(注意版本号要对应) 2.安装rubyinstaller以及解压 ...

  3. 同上！ 下拉复选框 点击当前的checkbox 选中后面li 添加到指定区域

    (function() { $(".cxbtntj").click(function(){ console.log($("#jsLi1").attr(" ...

  4. convertdate

    sample date 2015-09-10 00:00:00 2015-09-09 00:00:00.000 expect iso date, add time zone 2015-09-10T00 ...

  5. 去除 UINavigationController.navigationBar下方的横线

    self.navigationController.navigationBar.clipsToBounds=YES;

  6. svn回滚版本

    1.本地修改了内容,但是没有commit可以通过Revert-来覆盖当前版本. 2.已经commit了.首先第一步,应该知道需要回滚的版本编号, 第二步,选择 updata to revision

  7. ueditor工具栏更改按钮的默认操作

    ueditor 上的 image 按钮,默认有一个图片选择工具. 但是我想把他去掉,用上自己写的图片选择功能. 原来使用cleditor 是可以给按钮自定义一个函数.但是在ueditor就没有找到可以 ...

  8. View通用

    1.计算view尺寸 ViewTreeObserver vto = view.getViewTreeObserver(); vto.addOnPreDrawListener(new ViewTreeO ...

  9. Android深度探索--HAL与驱动开发----第七章读书笔记

    首先创建led驱动的设备文件,可以使用cdev_init,register_chrdev_region,cdev_add等建立主设备号的设备文件.步骤如下: 1使用cdev_init初始化cdev 2 ...

  10. 安卓性能测试工具-GT,安测试

    GT: 是腾讯出品的一款APP的随身调测平台,它是直接运行在手机上的“集成调测环境”(IDTE,  Integrated  Debug&Test  Environment).利用GT,仅凭一部 ...