如何html5在浏览器里访问手机后置摄像头
html5需要使用接口chrome30+ for android 已经实现了利用webcam，调用手机后置摄像头，代码如下：
<!DOCTYPEhtml>
<htmlxmlns="http://www.w3 .org/1999/xhtml">
<head>
<title>HTML5GetUserMediaDemo</title>
<metaname="viewport"content="width=device-width,initial-scale=1.0,maximum-scale=1.0"/>
</head>
<body>
<inputtype="button"title="开启摄像头"value="开启摄像头"onclick="getMedia();"/><br/>
<videoheight="120px"autoplay="autoplay"></video><hr/>
<inputtype="button"title="拍照"value="拍照"onclick="getPhoto();"/><br/>
<canvasid="canvas1"height="120px"></canvas><hr/>
<inputtype="button"title="视频"value="视频"onclick="getVedio();"/><br/>
<canvasid="canvas2"height="120px"></canvas>
<scripttype="text/javascript">
varvideo=document.querySelector('video');
varaudio,audioType;
varcanvas1=document.getElementById('canvas1');
varcontext1=canvas1.getContext('2d');
varcanvas2=document.getElementById('canvas2');
varcontext2=canvas2.getContext('2d');
navigator.getUserMedia=navigator.getUserMedia||navigator.webkitGetUserMedia||navigator.mozGetUserMedia||navigator.msGetUserMedia;
window.URL=window.URL||window.webkitURL||window.mozURL||window.msURL;
varexArray=[];//存储设备源ID
MediaStreamTrack.getSources(function(sourceInfos){
for(vari=0;i!=sourceInfos.length;++i){
varsourceInfo=sourceInfos[i];
//这里会遍历audio,video，所以要加以区分
if(sourceInfo.kind==='video'){
exArray.push(sourceInfo.id);
});
functiongetMedia(){
if(navigator.getUserMedia){
navigator.getUserMedia({
'video':{
'optional':[{
'sourceId':exArray[1]//0为前置摄像头，1为后置
}]
},
'audio':true
},successFunc,errorFunc);//success是获取成功的回调函数
else{
alert('Nativedevicemediastreaming(getUserMedia)notsupportedinthisbrowser.');
functionsuccessFunc(stream){
//alert('Succeedtogetmedia!');
if(video.mozSrcObject!==undefined){
//Firefox中，video.mozSrcObject最初为null，而不是未定义的，我们可以靠这个来检测Firefox的支持
video.mozSrcObject=stream;
else{
video.src=window.URL&&window.URL.createObjectURL(stream)||stream;
//video.play();
//音频
audio=newAudio();
audioType=getAudioType(audio);
if(audioType){
audio.src='polaroid.'+audioType;
audio.play();
functionerrorFunc(e){
alert('Error！'+e);
//将视频帧绘制到Canvas对象上,Canvas每60ms切换帧，形成肉眼视频效果
functiondrawVideoAtCanvas(video,context){
window.setInterval(function(){
context.drawImage(video,0,0,90,120);
},60);
//获取音频格式
functiongetAudioType(element){
if(element.canPlayType){
if(element.canPlayType('audio/mp4;codecs="mp4a.40.5"')!==''){
return('aac');
}elseif(element.canPlayType('audio/ogg;codecs="vorbis"')!==''){
return("ogg");
returnfalse;
//vedio播放时触发，绘制vedio帧图像到canvas
//video.addEventListener('play',function(){
//drawVideoAtCanvas(video,context2);
//},false);
//拍照
functiongetPhoto(){
context1.drawImage(video,0,0,90,120);//将video对象内指定的区域捕捉绘制到画布上指定的区域，实现拍照。
//视频
functiongetVedio(){
drawVideoAtCanvas(video,context2);
</script>
</body>
</html>
HTML5 The Media Capture API提供了对摄像头的可编程访问，用户可以直接用getUserMedia获得摄像头提供的视频流。但实际上用html5调用手机摄像头存在很多问题：
1）谷歌的发布的Chrome到了21版本后，才新增了一个用于高质量视频音频通讯的getUserMedia API，该API允许Web应用程序访问摄像头和麦克风,其他手机浏览器只有opera支持html5调用本地拍照功能
2）两个浏览器均不支持访问多个摄像头：chrome不支持访问后置摄像头，pera支持访问后置摄像头的
在浏览器中调用本地摄像头实现视频监控
是可以的，在你的电脑ie浏览器输入你的硬盘录像机ip地址，就OK了！！
chrome怎么打开摄像头
如果你用谷歌Chrome浏览器
1. 在Chrome浏览器中输入：
把chrome://plugins
键入地址栏
2. 点击右边的“+ Details （+细节）”
3. 找出“Adobe Flash Player”
4. 在“Adobe Flash Player”中您很可能会看到“2”个文件
5. 您必须找到文件“Pepperflash” (PepperFlash\pepflashplayer.dll)
6. 一旦您找到“Pepperflash”，点击它后面的禁用并确认。
7. 然后重新启动您的浏览器和摄像头…..
在w7里打开摄像头的步骤/方法
打开开始菜单，右键“计算机”选择“管理”。
在“计算机管理”窗口左边一栏，双击“设备管理器”。然后，从右边栏中找到“图像设备”，点开。在摄像头设备上右键鼠标，选择“属性”。
在“驱动程序”选项卡上，单击“驱动程序详细信息”，可以看到.exe 文件的详细路径（通常位于系统盘 Windows 文件夹下）。
在系统盘中，循路径找到这个程序文件，右键鼠标，选择“创建快捷方式”，存放到桌面上。
回到桌面，右键单击快捷方式，“复制”。然后打开如下文件夹：
系统盘:\Users\用户名\AppData\Roaming\Microsoft\Windows\Network Shortcuts
例如 C:\Users\xiaoyi\AppData\Roaming\Microsoft\Windows\Network
Shortcuts （AppData 是隐藏文件夹。如果看不到，请点击“组织”-〉“文件夹和搜索选项”。在“查看”选项卡上点选“显示隐藏的文件、文件夹和驱动器”。）
将快捷方式“粘贴”进来。
打开“计算机”，现在就可以看到摄像头图标了。
我想在浏览器里面开启摄像头
如果你用谷歌Chrome浏览器
1. 在Chrome浏览器中输入：
把chrome://plugins
键入地址栏
2. 点击右边的“+ Details （+细节）”
3. 找出“Adobe Flash Player”
4. 在“Adobe Flash Player”中您很可能会看到“2”个文件
5. 您必须找到文件“Pepperflash” (PepperFlash\pepflashplayer.dll)
6. 一旦您找到“Pepperflash”，点击它后面的禁用并确认。
7. 然后重新启动您的浏览器和摄像头…..
在w7里打开摄像头的步骤/方法
打开开始菜单，右键“计算机”选择“管理”。
在“计算机管理”窗口左边一栏，双击“设备管理器”。然后，从右边栏中找到“图像设备”，点开。在摄像头设备上右键鼠标，选择“属性”。
在“驱动程序”选项卡上，单击“驱动程序详细信息”，可以看到.exe 文件的详细路径（通常位于系统盘 Windows 文件夹下）。
在系统盘中，循路径找到这个程序文件，右键鼠标，选择“创建快捷方式”，存放到桌面上。
回到桌面，右键单击快捷方式，“复制”。然后打开如下文件夹：
系统盘:\Users\用户名\AppData\Roaming\Microsoft\Windows\Network Shortcuts
例如 C:\Users\xiaoyi\AppData\Roaming\Microsoft\Windows\Network
Shortcuts （AppData 是隐藏文件夹。如果看不到，请点击“组织”-〉“文件夹和搜索选项”。在“查看”选项卡上点选“显示隐藏的文件、文件夹和驱动器”。）
将快捷方式“粘贴”进来。
打开“计算机”，现在就可以看到摄像头图标了。
原创文章，作者：聚禄鼎，如若转载，请注明出处：https://www.xxso.cn/159956.html
