el-upload上传图片的大小如何设置？

Question

我是用el-upload实现上传图片的功能，目前可以上传较小的图片，但是当上传一幅20多M的图片时，大小根本没有任何数据传递到后端……请问应该如何设置？

Answer 1

上传大文件时，可能会出现连接超时、内存不足、上传失败等问题，因为默认情况下，服务器和客户端对上传文件的大小都有限制。为此，您可以尝试以下一些解决方案：

1. 增加服务器的最大上传文件大小：在应用程序的配置文件中，您需要增加对应的配置项，以允许更大的上传文件大小。比如，在 Apache 的配置文件 httpd.conf 中，您可以增加以下内容：

LimitRequestBody 0  # 允许上传的最大文件大小，0表示无大小限制

1. 增加客户端的最大上传文件大小：在客户端的配置中，您需要在上传组件中增加对应的属性，以允许更大的上传文件。比如，在 el-upload 中，您可以增加以下属性：

<el-upload
  ...
  :on-exceed="handleExceed"  # 限制文件上传大小
  :before-upload="handleBeforeUpload"  # 上传前的回调，可处理文件
  >
</el-upload>

methods: {
  handleBeforeUpload: function (file) {
    if (file.size > 1024 * 1024 * 20) {  // 限制文件上传大小为20M
      this.$message.error('上传文件大小不能超过20MB');
      return false;
    }
  },
  handleExceed: function (files, fileList) {
    this.$message.warning(`当前限制上传一张图片`);
  }
}

1. 使用分块上传：对于大文件，您可以使用分块上传的方式，将文件分为多个块，并将每个块独立上传，以避免上传失败或超时等问题。Vue.js 有许多分块上传组件可供选择，比如 vue-simple-upload 等。您可以选择适合您应用场景的组件进行尝试。

希望这些解决方案对您有所帮助。如果您仍然无法解决问题，您可以提供更多的信息和代码，以便我们提供更具体的帮助。