Uniapp chooseImage 选择图片 & 自定义上传

背景:

uniApp 开发过程中, 需要上传图片到自己的后端服务

按照官方文档上的写法, 取 tempFilePaths 获取到的是一个 blob:xxx 的文件流, 我们的后端服务不支持这样传参, 报错;

uni.chooseImage(OBJECT) | uni-app官网

步骤:

注意点:

- uni.uploadFile 的 file 参数为自己后端服务定义的参数名

- uni.uploadFile 的 filePath 为文件的实际路径

methods: {
			chooseImg() {
				uni.chooseImage({
					success: function (res) {
						console.log(res.tempFiles[0]);
						uni.uploadFile({
							url: 'http://xxxxx/api/dp/file/uploads', 
							header: {
								Authorization: 'eyJhbGb1xgiUrTPqXx5nkJg7hdw',
								"Content-Type": "application/x-www-form-urlencoded"
							},
							name: 'files',
							filePath: res.tempFiles[0].path,
							formData: {
								dirId: 145605211059456,
								appId: 1,
								// files: res.tempFiles[0],
							},
							success: (uploadFileRes) => {
								console.log(uploadFileRes.data);
							},
							
						});
					}
				})
			},
		}

最终效果: