ant design vue 手动上传（上传成功）但后台无法获取文件

  • Z时代
  • 2024-02-13
  • 分类：IT

跟后台同事调试了半天，前台这块能打出一个日期一个上传文件。

 console.log(formData.get('file'))       //能打印出上传文件
 console.log(formData.get('acctMonth'))  //能打印出日期

上传是反馈200成功，但后台就是显示找不到上传文件。

handleUpload() {
  if (this.acctMonth == "") {
    this.$message.error("请选择账期！")
    return false;
  }
  if (this.fileList == "") {
    this.$message.error("请选择上传文件！")
    return false;
  }
  const { fileList } = this;
  const formData = new FormData();
  let token = Vue.ls.get(ACCESS_TOKEN);
  fileList.forEach((file) => {
    formData.append("file", file);
  });
  formData.append("acctMonth", this.acctMonth);
  this.uploading = true;
  console.log(formData.get('file'))       //能打印出上传文件
  console.log(formData.get('acctMonth'))  //能打印出日期
  reqwest({
    url: apiUrl.upload,                  //后台上传接口
    method: 'post',
    data: formData,
    headers: {                           //框架需要支持token才能上传
      "content-type": "multipart/form-data",
      "X-Access-Token": token
    },
    success: () => {
      console.log(formData.getall())
      this.fileList = [];
      this.acctMonth = '';
      this.uploading = false;
      this.$message.success('文件上传成功.');
    },
    error: () => {
      this.uploading = false;
      this.$message.error('文件上传失败.');
    },
  });
},

回答：

两个可能。

  1. 前端发的并不是 form-data
  2. 发送的时候把文件丢了。或者名字（文件名）不对。有的框架会要求文件名。

可以考虑把 network 搞出来看看

百度都怀疑我搜索错了
ant design vue 手动上传（上传成功）但后台无法获取文件

看上去是你写的不对。

reqwest({
      url: '/safe/face/faceCompareForSavePic',   //这块是你项目的接口
      method: 'post',
      processData: false,
      data: formData,
      success: () => {
        this.setState({
          fileList,
          uploading: false,
        });
        message.success('upload successfully.');
      },
      error: () => {
        this.setState({
          uploading: false,
        });
        message.error('upload failed.');
      },
    });

回答：

后台加@Anonymous注解即可解决，接口没有权限所以后台接收不到

以上是 ant design vue 手动上传（上传成功）但后台无法获取文件 的全部内容， 来源链接： utcz.com/p/935978.html

回到顶部