uniapp 调用手机相机拍照实现图片上传

uniapp 调用手机相机拍照实现图片上传

参考资料:https://blog.csdn.net/weixin_46391646/article/details/108450898

调用相机相册

uni.chooseImage({
  	count: 1,
    sizeType: ['original', 'compressed'],
    sourceType: ['camera','album'], //这要注意,camera掉拍照,album是打开手机相册
    success: (res)=> {
		console.log(res);
		const tempFilePaths = res.tempFilePaths;
    }
});

这个api调完之后,会返还一个数组,带着照片的信息

在这里插入图片描述
在这里插入图片描述

随后就可以调用上传API

uni.uploadFile({
	url: 'https://xxxx/api/v1/qiniu/upload/img', //服务器地址
	fileType:"image",//ZFB必填,不然报错
	filePath: tempFilePaths[0],//这个就是我们上面拍照返回或者先中照片返回的数组
	name: 'imgFile',
	success: (uploadFileRes) => {
		let imgData = JSON.parse(uploadFileRes.data)
		console.log(imgData.data.imgUrl);
		console.log(this);
		this.imgDataUrl = imgData.data.imgUrl
	}
});

调用上传接口,把我们拍的照片,或者手机相册选择的相册发送给对应的服务器,然后服务器会返回一个在线的图片地址给我,在html中写一个img标签 把url写给对应的src即可。

扫码

uni.scanCode({
 	onlyFromCamera: true,//只允许拍照,不允许本地相册
	scanType:["qrCode"],//扫码类型 以为 二位 xxx
    success:  (res)=> {
        console.log('条码内容:' + res);
    }
});

亲测管用!扫码没测...

posted @   叫我+V  阅读(12247)  评论(0编辑  收藏  举报
编辑推荐:
· AI与.NET技术实操系列:基于图像分类模型对图像进行分类
· go语言实现终端里的倒计时
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
阅读排行:
· 25岁的心里话
· 闲置电脑爆改个人服务器(超详细) #公网映射 #Vmware虚拟网络编辑器
· 基于 Docker 搭建 FRP 内网穿透开源项目(很简单哒)
· 零经验选手,Compose 一天开发一款小游戏!
· 一起来玩mcp_server_sqlite,让AI帮你做增删改查!!
点击右上角即可分享
微信分享提示