好资源导航 » 文章资讯 » Android webview实现拍照的方法

Android webview实现拍照的方法

2023-09-22 15:13:06 53

Androidwebview实现拍照的方法

1.html



PictureofAsset


OpenWebCam







SnapPhoto

$(document).ready(function(){ }); ////Elementsfortakingthesnapshot varcanvasPreview=document.getElementById('canvasPreview'); varcanvasUpload=document.getElementById('canvasUpload'); varcontextPreview=canvasPreview.getContext('2d'); varcontextUpload=canvasUpload.getContext('2d'); //####################VideoSource####################### varvideoElement=document.querySelector('video'); varvideoSelect=document.querySelector('select#videoSource'); navigator.mediaDevices.enumerateDevices() .then(gotDevices).then(getStream).catch(handleError); videoSelect.onchange=getStream; functiongotDevices(deviceInfos){ for(vari=0;i!==deviceInfos.length;++i){ vardeviceInfo=deviceInfos[i]; varoption=document.createElement('option'); option.value=deviceInfo.deviceId; if(deviceInfo.kind==='videoinput'){ option.text=deviceInfo.label||'camera'+ (videoSelect.length+1); videoSelect.appendChild(option); }else{ console.log('Foundomeotherkindofsource/device:',deviceInfo); } } } functiongetStream(){ if(window.stream){ window.stream.getTracks().forEach(function(track){ track.stop(); }); } varconstraints={ video:{ optional:[{ sourceId:videoSelect.value }] } }; navigator.mediaDevices.getUserMedia(constraints). then(gotStream).catch(handleError); } functiongotStream(stream){ window.stream=stream;//makestreamavailabletoconsole videoElement.srcObject=stream; } functionhandleError(error){ console.log('Error:',error); } //########################EndVideoSource################# //Getaccesstothecamera! if(navigator.mediaDevices&&navigator.mediaDevices.getUserMedia){ navigator.mediaDevices.getUserMedia({video:true}).then(function(stream){ videoElement.src=window.URL.createObjectURL(stream); videoElement.play(); }); } else{ document.getElementById("pnlVideo1").style.display="none"; } ////Triggerphototake document.getElementById("snap").addEventListener("click",function(){ contextPreview.drawImage(videoElement,0,0,300,224); contextUpload.drawImage(videoElement,0,0,300,224); document.getElementById("video").style.display="none"; document.getElementById("snap").style.display="none"; document.getElementById("canvasPreview").style.display="block"; varimage=document.getElementById("canvasUpload").toDataURL("image/jpeg"); image=image.replace('data:image/jpeg;base64,',''); $("#imgNric1").val(image); }); ////Triggerphototake document.getElementById("btnOpen1").addEventListener("click",function(){ document.getElementById("vdoOne").style.display="block"; document.getElementById("video").style.display="block"; document.getElementById("snap").style.display="block"; document.getElementById("canvasPreview").style.display="none"; });

2.Androidstudio中权限设置：

3.加载view时需要开启JavaScript和文件访问权限。

...
mWebView=(AdvancedWebView)findViewById(R.id.webview);
WebSettingswebSettings=mWebView.getSettings();
webSettings.setJavaScriptEnabled(true);
webSettings.setBuiltInZoomControls(true);
webSettings.setAllowFileAccess(true);
...

如有疑问请留言或者到本站社区交流讨论，感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

返回顶部
514930285
czq8825@qq.com

Android webview实现拍照的方法

热门推荐

随机推荐