el-upload组件上传文件，接口报500

朋友们，今天使用了el-upload组件上传文件，然后接口状态码200，但是预览哪里报错500，我看了下载荷，只显示二进制，是什么原因呀

img

img

控制台 打印一下传过去的值

  • 这个问题的回答你可以参考下: https://ask.csdn.net/questions/7402602
  • 这篇博客也不错, 你可以看下简单谈谈el-upload文件上传问题
  • 除此之外, 这篇博客: el-upload上传文件中的 上传前获取签名再上传 部分也许能够解决你的问题, 你可以仔细阅读以下内容或跳转源博客中阅读:

  • 有时候并不是直接上传就可以的，比如一开始并没有上传路径，需要调用获取签名接口来获取上传路径。这个时候就可以使用我们的上传文件之前的钩子before-upload。在上传前调用获取签名的接口，用拿到的url去修改，上传路径，就能够上传了。

    <template>
  <el-upload :action="url" :before-upload="getPolicy">
    <el-button type="primary">上传图片</el-button>
  </el-upload>
</template>
​
<script setup>
import axios from "axios";
import { reactive, ref } from "vue";
​
const url = ref("");
​
const getPolicy = () => {
  return new Promise((resolve, reject) => {
    axios
      .get("http://localhost:8088/policy")
      .then((res) => {
        const { data } = res;
​
        if (data.code === 200) {
          url.value = `http://localhost:8088${data.url}`;
​
          resolve();
        }
      })
      .catch((error) => {
        reject(error);
      });
  });
};
</script>
​
<style lang="less" scoped>
</style>

    image-20220508134523663