一. input
这种方式是文件录入的方式需要做二次操作,相当于上传文件,所以界面可能会有很多选择方式,摄像头不是唯一,如果我们想直接点击调取摄像头这种方式行不通
<input type="file" accept="video/*"/> // 摄像
<input type="file" accept="image/*"/> // 图片
<input type="file" accept="radio/*"/> // 音频
二. HTML5(Camera)
Camera模块管理设备的摄像头,可用于拍照、摄像操作,通过plus.camera获取摄像头管理对象。
这个方式可以点击直接调取摄像头
1.index.html
document.addEventListener( "plusready", onPlusReady, false );
function onPlusReady() {
console.log("plusready");
}
2.在调取的页面:
<template>
<div class="home">
<div class="page-header">
拍摄
</div>
<div class="content">
<button @click="captureImage">摄像</button>
</div>
</div>
</template>
<script>
export default {
name: 'home',
data() {
return {
}
},
components: {
},
created() {
},
mounted() {
},
methods: {
captureImage(){
var cmr = plus.camera.getCamera();
var res = cmr.supportedImageResolutions[0];
var fmt = cmr.supportedImageFormats[0];
console.log("Resolution: "+res+", Format: "+fmt);
// 摄像
// cmr.startVideoCapture( function( path ){
// alert( "Capture video success: " + path );
// },
// function( error ) {
// alert( "Capture video failed: " + error.message );
// },
// {resolution:res,format:fmt}
// );
// 拍照
cmr.captureImage( function( path ){
alert( "Capture image success: " + path );
},
function( error ) {
alert( "Capture image failed: " + error.message );
},
{resolution:res,format:fmt}
);
},
}
}
</script>