js调用设备摄像头的方法
更新时间：2018年07月19日 11:35:34 作者：东都花神
这篇文章主要为大家详细介绍了js调用设备摄像头的方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
本文实例为大家分享了js调用设备摄像头的具体代码，供大家参考，具体内容如下
使用getUserMedia这个API来获取摄像头的权限
兼容chrome和火狐，IOS不兼容
下面是源码：
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Document</title>
</head>
<body>
<video src=""></video>
<script type="text/javascript">
var opt = {
audio: true,
video: {
width: 375,
height: 603
}
};
navigator.mediaDevices.getUserMedia(opt)
.then(function(mediaStream) {
var video = document.querySelector('video');
video.srcObject = mediaStream;
video.onloadedmetadata = function(e) {
video.play();
};
})
.catch(function(err) {
console.log(err.name + ": " + err.message);
}); // always check for errors at the end.
</script>
</body>
</html>
注意，如果使用chrome查看代码需要在https协议下才能生效，建议使用火狐查看。
以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了javascript强制点击广告的方法,可用于下载站或文档显示站,实现点击后才能出现相应显示的功能,非常具有实用价值,需要的朋友可以参考下2015-02-02
本篇文章主要介绍了详解JS获取HTML DOM元素的8种方法，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧2017-06-06
JavaScript语言中的Literal Syntax特性分析
JavaScript语言中的Literal Syntax特性分析...2007-03-03
这次为大家带来的小游戏是：打飞机。呃。。。我本人就写不出什么惊天大作的游戏的了，只能写写小游戏，代码量小，又可以学习，主要是想法思路，代码量大，估计也没啥人会去研究学习。。。2010-10-10
这篇文章主要分享了js获取标签元素data-*属性值的4种方法，标签上有两个属性data-id 和 data-user-name, 需要通过js去获取，下面文章具体介绍需要的小伙伴可以参考一下2022-06-06
理解javascript中try...catch...finally
这篇文章主要帮助大家理解javascript中try...catch...finally，从浅入深，一步步掌握javascript中try...catch...finally的使用方法，感兴趣的小伙伴们可以参考一下2015-12-12
这篇文章主要介绍了JavaScript数据结构之二叉树的遍历算法,简单介绍了javascript实现数据结构中二叉树的中序遍历、先序遍历及后序遍历方法与相关使用技巧,需要的朋友可以参考下2017-04-04
这篇文章主要给大家介绍了关于ECharts数据可视化基本使用之常用图表类型的相关资料,echarts是一款基于JavaScript的数据可视化图表库,提供直观,生动,可交互,可个性化定制的数据可视化图表,需要的朋友可以参考下2023-11-11
这篇文章主要为大家详细介绍了JavaScript实现随机数生成器，生成不重复的随机数，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-10-10
javascript操作cookie的文章(设置，删除cookies)
一篇javascript处理cookie的文章,脚本之家之前发布过很多这样的文章。2010-04-04
最新评论