uni-app web端使用getUserMedia，摄像头拍照

本文主要是介绍uni-app web端使用getUserMedia，摄像头拍照，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

<template><view><video id="video"></video></view>
</template>	

摄像头显示在video标签上

var opts = {audio: false,video: true
}navigator.mediaDevices.getUserMedia(opts).then((stream)=> {video = document.querySelector('video');video.srcObject = streamvideo.play();
}).catch((err)=>{console.log(err)
});

拍照 npm i html2canvas

cxBackToBlank() {uni.showLoading({});html2canvas(document.querySelector('video'), {backgroundColor: null,useCORS: true}).then(async (canvas) => {let url = canvas.toDataURL('image/jpeg');})
},

<style scoped>#video {position: absolute;left: 100rpx;top: 100rpx;width: 1000rpx;height: 1000rpx;}
</style>	

这篇关于uni-app web端使用getUserMedia，摄像头拍照的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---