内容分发网络（CDN）旨在将内容缓存到离终端用户更近的位置，以减少延迟并提升性能。然而，一些CDN服务可能对上传文件的大小有限制。这就需要一种策略来绕过这些限制，而分块传输编码（Transfer-Encoding: chunked）正是一种可以用于上传大文件的技术。
突破限制原理
分块传输编码允许客户端将大文件分成多个部分（或“块”），并逐个发送这些块，而不是一次性发送整个文件。这样做的优点是，既可以绕过CDN对单个上传大小的限制，也可以提高大文件传输的可靠性。
实现方法及代码
下面是实现分块上传大文件的JavaScript示例代码，以及相应的Nginx服务器配置。
请注意，这些示例仅用于说明目的，实际部署时可能需要更复杂的逻辑来处理错误、重新上传失败的块以及验证上传的完整性。此外，如果CDN或服务端对分块传输编码的支持有限制，也可能导致上传失败。
客户端代码（JavaScript）
代码语言：js复制function uploadFileInChunks(file) {
// 设置每个块的大小为 1MB
const chunkSize = 1024 * 1024;
// 用于递归地上传每个块
let offset = 0;
function uploadNextChunk() {
const xhr = new XMLHttpRequest();
xhr.open('POST', 'https://example.com/upload', true);
xhr.setRequestHeader('Content-Type', 'application/octet-stream');
// 选择文件的下一个块
const chunk = file.slice(offset, offset chunkSize);
// 当前块上传成功后，上传下一个块
xhr.onload = function () {
if (xhr.status === 200) {
offset = chunkSize;
if (offset < file.size) {
uploadNextChunk();
} else {
console.log('Upload complete!');
}
} else {
console.error('Upload failed:', xhr.responseText);
}
};
// 发送当前块
xhr.send(chunk);
}
// 开始上传第一个块
uploadNextChunk();
}
// 使用方法
uploadFileInChunks(
document.getElementById('fileInput').files[0]
);服务端配置（Nginx）
要配置Nginx以支持分块传输编码，需要确保client_max_body_size足够大，或者设置为0以禁用检查。同时，确保使用支持分块传输的模块处理请求。
http {
server {
listen 80;
server_name example.com;
location /upload {
# 设置为足够大的值
client_max_body_size 0;
# 中间代理服务器配置
proxy_http_version 1.1;
proxy_request_buffering off;
# 其他服务器配置...
}
# 其他服务器配置...
}
# 其他服务器配置...
}这种方法的缺点
尽管分块传输编码提供了一种绕过CDN限制上传大文件的方法，但也存在一些缺点：
- 复杂性增加：维护分块上传的客户端和服务器代码比普通上传更复杂。
- 性能影响：每个块的传输可能增加额外的网络延迟。
- 重试机制：需要为上传失败的块实现重试机制，增加了客户端的复杂度。
- 安全性考虑：如果没有适当的验证，分块上传可能被用于恶意目的。
- 服务器负载增加：服务器端需要处理更多的并发连接和数据重组。
- CDN服务违规：可能违反CDN服务条款，带来服务中断或法律问题。
在考虑使用这种方法时，应仔细权衡这些缺点，并考虑是否有更好的替代方案。在必要时与CDN服务提供商协商，寻找更合适的解决方案。
文章同步自 若海の技术写真 https://www.rehiy.com/post/568/
