uniapp uni.chooseImage+uni.uploadFile使用方法与详解

uni.chooseImage+uni.uploadFile使用方法与详解

一、uni.chooseImage

实现从本地相册选择图片或使用相机拍照，从手机选择图片后会生成一个临时本地路径（该路径只在本次启动期间可以正常使用）

uni.chooseImage({count: 6, //选择可上传图片数量，默认9sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有sourceType: ['album'], //从相册选择success: function (res) {console.log(JSON.stringify(res.tempFilePaths));}
});

uniapp官网参数说明

success返回参数说明

二、uni.uploadFile

由于uni.chooseImage生成的路径是一个临时路径，所以需要通过uploadFile将该图片上传到后端，并由后端生成一个服务器路径使其可以随时随地（永久、非本地）访问。

注：一定要让后端将接口method写为POST

uni.chooseImage({success: (chooseImageRes) => {const tempFilePaths = chooseImageRes.tempFilePaths;uni.uploadFile({url: 'https://www.example.com/upload', //后端接口地址filePath: tempFilePaths[0],name: 'file', //后端定义的keyformData: {'user': 'test'},success: (uploadFileRes) => {console.log(uploadFileRes.data);}});}
});

uniapp官网参数说明

success返回数据说明

最后要将后端返回给的服务器地址拼接上域名才能真正访问图片