Cloudflare Worker通过Fetch下载文件时自定义文件名问题

有两种可行方案，无需读取完整二进制响应即可实现带文件名的下载：

方案1：修改响应头添加下载文件名 #

Cloudflare Worker中原始响应的Header不可直接修改，你需要克隆响应体并添加Content-Disposition头，这个头会告知浏览器文件名与下载方式。

代码示例： #

let file_response = await fetch(url);
// 从原URL提取文件名（若URL包含文件名）
const urlObj = new URL(url);
const fileName = urlObj.pathname.split('/').pop() || 'default-file.bin';

// 克隆响应并添加自定义头
const modifiedResponse = new Response(file_response.body, {
  status: file_response.status,
  statusText: file_response.statusText,
  headers: new Headers(file_response.headers)
});
// 添加Content-Disposition头，指定文件名
modifiedResponse.headers.set('Content-Disposition', `attachment; filename="${fileName}"`);

return modifiedResponse;

若原URL不含文件名，可直接手动指定，比如filename="my-custom-file.pdf"。

方案2：手动构建带文件名的响应（适需自定义处理二进制的场景） #

如果确实需要读取二进制内容（比如修改文件内容），可先将响应转为ArrayBuffer，再构建新响应并添加头：

代码示例： #

let file_response = await fetch(url);
const buffer = await file_response.arrayBuffer();
const fileName = 'custom-name.zip'; // 自定义文件名

const modifiedResponse = new Response(buffer, {
  headers: {
    'Content-Type': 'application/octet-stream',
    'Content-Disposition': `attachment; filename="${fileName}"`
  }
});

return modifiedResponse;

注意事项 #

• 优先使用方案1，直接传递响应流（file_response.body）比读取整个二进制文件更节省内存、性能更优，适合大文件场景。
• 若原响应已有Content-Disposition头但不符合需求，直接用set方法覆盖即可。

内容的提问来源于stack exchange，提问作者Rafael Spessotto