使用elementui 的文件上传时候POST请求错误代码400。但是文件已经上传到leanclou控制台。并且文件上传的url 与直接从控制台添加的url不一样。上传的url三分钟之后再次刷新请求就会报错。其他信息显示正常就是url没有了图片不显示。

使用element-ui upload 想法是

:on-progress="uploaduploadImg"
:on-success="uploadsuccess"
:on-error="uploaderror"
:before-upload="beforeupload"
:on-remove="uploadremove"
class="upload-demo"
:data="uploadData"
:headers="uploadHeaders"
:action="uploadAction"
:file-list="fileAllList"


我在return uploadData (上传的额外参数)定义一个空对象 在上传是把上传的文件url,name拿到并且返回给uploadData 对象。然后element-ui 连带着uploadAction(必传地址)带上uploadHeaders(请求头id,key)然后再发给leancloud 但是leancloud报错400 。但是文件已经上传到了控制台。

return {
imageUrl: '',
//请求头
uploadHeaders:{
"X-LC-Id": 'SweekfGYbKJzTDTi03v9zVqT-gzGzoHsz',
"X-LC-Key": 'nRtOhSBFvooOAPHEcdJPez41',
"Content-Type": "Content-Type: image/gif"
},
//上传额外参数
uploadData:{},
//上传地址
uploadAction:'https://leancloud.cn/1.1/classes/_File',
//全部列表
fileAllList:[],
};
//上传时操作
uploaduploadImg:function (event, file, fileList) {
this.uploadData = {
name:file.name,
url:file.url,
};
var file = AV.File.withURL(this.uploadData.name,this.uploadData.url);
file.save()
},

withURL 方法并不真正上传文件,只是把文件的 url 保存在 File 表里,如果原始地址失效了(比如微信的临时图片)则会无法访问。

文件不是直接通过 form 请求 _File 表来上传的,需要使用 SDK 来上传文件的 blob 数据。建议参考 SDK 文档的上传部分。

我用的是element-ui组件 的upload 格式就是这个样子。。。上传的文件也能获取到。就是在leancloud api调试工具创建的时候body 老是加不上去。才有了错误代码400 参数不对。。