如何解决Express.js管道文件时Windows下载文件名带引号问题？

嘿，这个问题我之前帮同事排查过！问题根源就在你设置的Content-Disposition响应头里——你用了单引号包裹文件名，而Windows下的浏览器对单引号的解析逻辑和OSX不一样，会把这些引号当成文件名的一部分保留下来。

问题出在哪？ #

你的代码里是这么写的：

.set("Content-Disposition", "inline; filename='" + file + "'")

OSX的浏览器（比如Chrome、Safari）会自动忽略单引号，但Windows的浏览器（Edge、IE甚至Windows版Chrome）会严格解析这部分，把'filename.zip'当成完整的文件名，导致下载后文件名带引号。

修复方案 #

按照HTTP标准（RFC规范），filename参数如果需要包裹，应该用双引号，而不是单引号。修改你的响应头设置即可：

方案1：用模板字符串（ES6+）

const file = "filename.zip";
request(`https://s3.us-east-2.amazonaws.com/bucketname/${file}`)
  .pipe(
    res
      .set("Content-Type", "application/zip")
      .set("Content-Disposition", `inline; filename="${file}"`)
  );

方案2：转义双引号（兼容ES5及以下）

var file = "filename.zip";
request("https://s3.us-east-2.amazonaws.com/bucketname/" + file)
  .pipe(
    res
      .set("Content-Type", "application/zip")
      .set("Content-Disposition", "inline; filename=\"" + file + "\"")
  );

额外提示 #

如果你的文件名里包含空格、中文或者特殊字符，双引号包裹是必须的，这能保证跨所有系统和浏览器的兼容性，单引号在很多场景下都不符合标准解析逻辑，所以尽量统一用双引号来包裹文件名参数。

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