请求实体太大快递 - Javascript

当我们在使用 Ajax 进行 POST 请求发送数据时，有时候会出现错误提示“请求实体太大”。这是因为服务器限制了请求体大小，而我们要发送的数据超过了这个限制。

此时，需要对发送数据进行压缩或分块发送，或者调整服务器的请求体大小限制，以解决这个问题。

下面是一个通过分块发送数据的示例代码，来解决请求实体太大的问题：

function chunkedRequest(url, data, chunkSize, successCallback, errorCallback) {
  // 用 Blob 对象分块并上传数据
  var CHUNK_SIZE = chunkSize || 1024 * 1024;
  var offset = 0;
  var totalSize = data.size; // 要上传的数据的总大小
  var currentChunk;

  var reader = new FileReader();

  reader.onload = function(e) {
    var xhr = new XMLHttpRequest();
    xhr.open("POST", url, true);
    xhr.setRequestHeader("Content-Type", "application/octet-stream");
    xhr.upload.onprogress = function(event) {
      if (event.lengthComputable) {
        var percentComplete = ((event.loaded + offset) / totalSize) * 100;
        console.log(percentComplete + "% uploaded");
      }
    };
    xhr.onreadystatechange = function(event) {
      if (xhr.readyState === 4) {
        if (xhr.status === 200 || xhr.status === 201) {
          successCallback(xhr.responseText);
        } else {
          errorCallback(xhr.statusText);
        }
      }
    };

    currentChunk = data.slice(offset, offset + CHUNK_SIZE);
    offset += CHUNK_SIZE;

    xhr.send(currentChunk);
  };

  reader.readAsArrayBuffer(data);
}

使用这段代码的方式是：

var file = document.querySelector('input[type=file]').files[0];

chunkedRequest('/upload', file, 1024 * 1024, function(response) {
  console.log('文件上传成功！');
}, function(error) {
  console.error('文件上传失败: ' + error);
});

这是一种较为简单的解决方法，但是并不是万能的。如果客户端网络环境较差，或者数据量非常大，仍然可能出现“请求实体太大”的错误提示。此时，需要再深入研究并调整服务器端设置。

代码片段中使用了 FileReader 和 Blob 对象来分块读取和上传数据，这两个对象是 HTML5 标准中提供的对象，用于对二进制数据进行处理。读者可以参考 MDN 上的文档进一步了解这两个对象的使用方法。

参考资料：

• Stack Overflow: “413 Request Entity Too Large” error in PHP
• MDN: FileReader
• MDN: Blob