最近项目有新的需求,做一个类似朋友圈的功能。其中发布动态时就涉及到了图片的上传。
## 1.所用的API ##
采用HTML5提供的formData和网络框架axios实现
## 2.具体代码 ##
// 创建一个formData(虚拟表单)
const formData = new FormData();
// 需要上传的文件
const file = { uri: fileUri, type: 'multipart/form-data', name: filenAME }; // 这里的key(uri和type和name)不能改变,
formData.append('file', file); // 这里的files就是后台需要的key
此时含有待上传文件的虚拟表单就创建好了。接下来就是上传文件了
// 请求头文件
const config = {
Accept: 'Application/json',
'Content-Type': 'multipart/form-data',
};
// 使用post上传文件(httpuri为文件上传的地址)
await axios.post(httpuri, formData, config)
.then((response) => {
// 上传成功
}).catch((e) => {
// 上传失败
});
整个上传过程就完成了。其实还是很简单的