直接上代码 ：整体代码
uni.chooseImage({
success: (res) => {
console.log('res:',res);
const tempFilePaths = res.tempFilePaths;
console.log('tempFilePaths[0]:',tempFilePaths[0]);
if(!uni.getStorageSync('token')){
uni.showToast({
title: '上传失败，请重新登录再尝试',
icon:'none',
duration: 2000
});
setTimeout(() => {
uni.reLaunch({
url:'./setupaccount'
})
},2000)
return false;
}
uni.uploadFile({
url: this.upload,
//#ifdef H5
header: {
// 'Content-Type': 'application/x-www-form-urlencoded',
// 'Access-Control-Allow-Origin':'*',
// "Content-Type": "multipart/form-data",
'accessToken': uni.getStorageSync('token'),
},
files:[
{
name:'file',
file:res.tempFiles[0],
uri:tempFilePaths[0],
}
],
//#endif
//#ifdef MP
header: {
"Content-Type": "multipart/form-data",
'accessToken': uni.getStorageSync('token')
},
filePath: tempFilePaths[0],
name: 'file',
formData: {
'project': 'hrj',
'host': '127'
},
//#endif
success: (uploadFileRes) => {
console.log(JSON.parse(uploadFileRes.data));
let res = JSON.parse(uploadFileRes.data);
if(res.code == 0){
uni.showToast({
title: '上传成功',
duration: 2000
});
this.cartakepictureslist[index].img = res.fileId;
console.log(this.cartakepictureslist[index].fileId);
}else {
uni.showToast({
title: res.msg,
icon:'none',
duration: 2000
});
setTimeout(()=>{
uni.navigateTo({
url:'./login'
})
},2000)
}
},
fail:(e) => {
uni.showToast({
title: '网络出错',
icon:'none',
duration: 2000
});
}
});
}
});第一步：uni.chooseImage
从本地相册选择图片或使用相机拍照。 官方文档：https://uniapp.dcloud.io/api/media/image?id=chooseimage
第二步： 得到图片信息后可以直接掉接口了：
这里用的 uni.uploadFile 官方文档： https://uniapp.dcloud.io/api/request/network-file?id=uploadfile
本章重点：小程序和H5 上传参数不同之处
参数：
首先小程序 ：必传的
| url : 开发者服务器 filepath : 要上传文件资源的路径。 name : 文件对应的 key , 开发者在服务器端通过这个 key 可以获取到文件二进制内容 (默认file) 。
扫描二维码关注公众号，回复：
11891962 查看本文章
|
uni.uploadFile（{
url : 'www.xxxxxx.com' //
header: {
"Content-Type": "multipart/form-data",
'accessToken': uni.getStorageSync('token')
},
filePath: tempFilePaths[0],
name: 'file',
formData: {
'project': 'hrj',
'host': '127'
},
success:(uploadFileRes) => {
}
}）小程序上传图片跟着官方示例基本没问题；
H5端的 ： 
官方既然给了这个参数 ， 说明还是有其用途的。本次困扰了我很久，在网上各种查资料，也有其他解决方法，但是都太片面了。然后仔细看了一下文档， 就着手试了一试，就成功了：
H5 端用 files 来传图片，注意：使用files 了后，filepath 和 name 两参数就失效了，这也是必然的。
files 里面 也包括了这两参数 ：
这里注意，需要仔细点看 ， 文件的本地地址 参数 是 uri uri uri ！！！
并不是 u r l ，这地方很多人栽坑了里头了，错吧 U R I 当做 U R L 。