CSDN-Ada助手: 不知道 CS入门 技能树是否可以帮到你：https://edu.csdn.net/skill/gml?utm_source=AI_act_gml

网名1234: 只能适用本地环境，部署服务器还是有问题的

网名1234: const uploadHandle = async () => { console.log(1111111); loading.value = true try { const firstIndex = imgSrc.value.indexOf('base64,') const url = imgSrc.value.substr(firstIndex + 7) const params = { photo: url } // 发送接口 await xxx(params) loading.value = false } catch (error) { loading.value = false } } onUnmounted(() => { if (photoVideo.value && photoVideo.value.srcObject) { // 停止视频流 photoVideo.value.srcObject.getTracks()[0].stop(); } })

网名1234: const takePhotoHandle = () => { // canvas画图 photoContext.value.drawImage(photoVideo.value, 0, 0, videoWidth.value, videoHeight.value) // 获取图片base64链接 imgSrc.value = photoCancas.value.toDataURL('image/png') } const openCamera = async () => { photoVideo.value = document.getElementById('videoCamera') photoCancas.value = document.getElementById('canvasCamera') photoContext.value = photoCancas.value.getContext('2d') try { const constraints = { audio: false, video: { width: videoWidth.value, height: videoHeight.value } } const stream = await navigator.mediaDevices.getUserMedia(constraints) photoVideo.value.srcObject = stream photoVideo.value.play() } catch (error) { proxy?.$modal.msgSuccess('操作成功'); } }

网名1234: 拍照 上传 import { ref, onMounted, onUnmounted } from 'vue'; const loading = ref(false)// 上传照片的loading const imgSrc = ref('')// 照片地址 const photoVideo = ref(null)// 拍照框 const photoContext = ref(null)// canvas绘图环境 const photoCancas = ref(null)// 预览框 const videoWidth = ref(306)// 拍照框宽度 const videoHeight = ref(378)// 拍照框高度 onMounted(() => { openCamera() })