微信小程序实现文件上传功能

//选择上传文件的按钮和提交文件上传按钮
<button  @click="onUpload">选择上传的文件</button>
<button  @click="submitUpload">上传</button>
//onUpload-------wx.chooseMessageFile先将文件上传到微信的 暂存区，打印res可以看到一个暂存的路径

//	let headers = {
//		 'Content-Type': "multipart/form-data"
//	};这个是为了小程序在真机测试校验协议时能够被通过，
//	我之前没加这个的时候不能通过真机的校验，但是在电脑本地测试没有问题。

onUpload(){
	let that =this;
	let headers = {
		 'Content-Type': "multipart/form-data"
	};
	wx.chooseMessageFile({
			success: function (res) {				       					
			that.tempFilePaths = res.tempFiles[0].path
			that.filename = res.tempFiles[0].name
		 },				
	});			
},

//将保存在微信暂存区的文件上传到你项目的保存地址
submitUpload(){
	 uni.uploadFile({
	 url: '',//这里的url是你项目文件上传的接口
	 filePath: this.tempFilePaths,//这是你上传文件到微信暂存区的 路径
	 name: 'file',
		//这里也是为小程序在真机测试校验协议时能够被通过，
		//你可以直接在 data里面定义这个变量，上面那个方法里面的headers可以不定义。
		header:{
		   ...headers
		},
		//这个是上传文件 需要的参数，具体看你们项目接口需要提交的参数
		formData: {
		    file_mis_id:this.contractList.mis_id,
			file_name:this.filename
		},
		success (res){
			 const data = res.data
			 if(res.statusCode==200){
				uni.showToast({
				    title: '上传成功', 
				    icon: "success"
			    })						 
			 }else{
				 uni.showToast({
					title: '上传失败', 
			     	icon: "none"
				 })
			 }
		}
	})
}
}

//技术不够，研究了两天才解决的功能，也是在看了很多博客之后才完成的，希望能够帮助到你，还请点个赞，谢谢