Ⅰ 手机web页面怎么调用摄像头执行扫描,获取数据
可以用手机中的微信扫一扫或是下载一些其它的扫描二维码软件。
Ⅱ 用webview做的android客户端怎样调用摄像头拍照
在web操作的话,这个只能调用flash的方式来启用客户端摄像头了
Ⅲ 如何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支持访问后置摄像头的
Ⅳ html5或者JS怎样调用手机摄像头或者相册
你给的网页用的是 <input accept="image/*" type="file">,在IOS端点击时会提示选择图片或相机,安卓端要看浏览器对这两个属性的优化,部分浏览器会直接跳转到资源管理器,优化做得好的可以直接提示选择相册或相机。
Ⅳ 手机网页(html5) 如何调用手机的摄像头和相册
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>web RTC 测试</title>
<style>
.booth {
width:400px;
background:#ccc;
border: 10px solid #ddd;
margin: 0 auto;
}
</style>
</head>
<body>
<div>
<video id="video" width="400" height="300"></video>
<button id='tack'> snap shot</button>
<canvas id='canvas' width='400' height='300'></canvas>
<img id='img' src=''>
</div>
<script>
var video = document.getElementById('video'),
canvas = document.getElementById('canvas'),
snap = document.getElementById('tack'),
img = document.getElementById('img'),
vendorUrl = window.URL || window.webkitURL;
//媒体对象
navigator.getMedia = navigator.getUserMedia ||
navagator.webkitGetUserMedia ||
navigator.mozGetUserMedia ||
navigator.msGetUserMedia;
navigator.getMedia({
video: true, //使用摄像头对象
audio: false //不适用音频
}, function(strem){
console.log(strem);
video.src = vendorUrl.createObjectURL(strem);
video.play();
}, function(error) {
//error.code
console.log(error);
});
snap.addEventListener('click', function(){
//绘制canvas图形
canvas.getContext('2d').drawImage(video, 0, 0, 400, 300);
//把canvas图像转为img图片
img.src = canvas.toDataURL("image/png");
})
</script>
</body>
</html>
Ⅵ Hbuilder web页面在手机里能调用摄像头吗
如果是在手机端用浏览器运行的那种,那还是web只不过是在移动端运行,这种不能调用摄像头。
如果开发的的webApp打包成的APP,是可以调用的。
Hbuilder打包有两种,一种源生APP一种webApp