如何使用javascript在下载时更改文件名？

Question

该脚本在特定网站上添加了一个视频下载链接。我如何在下载时更改文件名为其他名称？

Example URL:
"http://website.com/video.mp4"

Example of what I want the filename to be saved as during download:
"The_title_renamed_with_javascript.mp4"

- supercoolville

---

由于JavaScript无法更改文件名，因此此问题是以下问题的精确重复：https://dev59.com/UkXRa4cB1Zd3GeqPrWef - Rob W

@Rob W，这个问题完全不是Q 168173的重复。那个问题是关于Web应用程序的，而这个问题是关于客户端脚本的。OP无法控制目标页面或服务器。 - Brock Adams

@Brock Adams，OP所要求的在客户端是不可能实现的。因此，问题转向“如何更改特定文件的文件名”，这个问题已经被其他用户多次提出过了。 - Rob W

@Rob W，那没有任何意义。无论如何，这在客户端是可能的，只是不能仅使用Greasemonkey JS。 - Brock Adams

我非常确定这是可能的。这个脚本可以做到，我只是想不出如何做到： http://userscripts.org/scripts/show/62634 - supercoolville

@supercoolville，那个脚本使用了仅由Youtube服务器提供的特殊功能。 - Brock Adams

Answer 1

虽然浏览器支持有时会有问题，但是这实际上可以使用JavaScript实现。您可以使用XHR2将文件作为Blob从服务器下载到浏览器中，创建一个指向该Blob的URL，创建一个具有href属性设置为该URL的锚点，将下载属性设置为您想要的任何文件名，然后单击链接即可。这在Google Chrome中可以工作，但我没有验证其他浏览器的支持。

window.URL = window.URL || window.webkitURL;

var xhr = new XMLHttpRequest(),
      a = document.createElement('a'), file;

xhr.open('GET', 'someFile', true);
xhr.responseType = 'blob';
xhr.onload = function () {
    file = new Blob([xhr.response], { type : 'application/octet-stream' });
    a.href = window.URL.createObjectURL(file);
    a.download = 'someName.gif';  // Set to whatever file name you want
    // Now just click the link you created
    // Note that you may have to append the a element to the body somewhere
    // for this to work in Firefox
    a.click();
};
xhr.send();

- Micah Henning

---

我无法让它工作。在Chrome中，文件以正确的名称保存，但长度为零。在Firefox中，长度是正确的，但名称为dsQ9lPaj.bin.part等。 - marlar

Firefox正在进行修复工作。预计今年第一季度发布修复版本。 - Micah Henning

Answer 2

你不能使用客户端JavaScript来完成这个任务，你需要设置响应头部...。

.NET

Response.AddHeader("Content-Disposition", "inline;filename=myname.txt")

或PHP

header('Content-Disposition: inline;filename=myname.txt')

此外，还可以选择其他服务器端语言。

- Fenton

Answer 3

下载文件的文件名是在头部设置的（查看“Content-Disposition”），这个头部是在服务器端创建的。

除非你有服务器端访问权限（这样你就可以传递一个额外的参数给文件名，并更改服务器端行为以匹配它...但这也可以使用纯html实现，无需javascript），否则你无法通过纯javascript更改链接到的文件的文件名。结论：Javascript对于实现你想要的功能绝对是无用的。

- oezi

Answer 4

你可以使用Chrome的用户脚本可能实现这个功能, 但是目前还无法使用Greasemonkey（Firefox）的JavaScript实现。

解决方法（从简单到困难）：

1. 使用Greasemonkey添加链接，但使用优秀的DownThemAll!插件下载并重命名视频。

2. 按原样下载视频，并使用批处理文件、shell脚本、Python程序等对其进行重命名。

3. 使用Greasemonkey的GM_xmlhttpRequest()^文档函数将文件发送到您自己控制的服务器上的自己的Web应用程序。
   这个服务器可以是您自己运行的XAMPP（或类似软件）的PC。

4. 编写自己的Firefox插件，而不是Greasemonkey脚本。插件具有所需的权限，而Greasemonkey没有。

- Brock Adams

---

谢谢您的建议，您知道这个脚本如何只使用JavaScript重命名YouTube上的文件吗：http://userscripts.org/scripts/show/62634 - supercoolville

那个脚本使用了类似方法3的东西；利用Youtube在其服务器中刻意提供的一个功能。请注意，所有的下载链接都像这样：<a href="... youtube.com/videoplayback?sparams= ...title=Fancy Rename"...> 低清晰度MP4...</a>。title参数告诉服务器当用户点击链接时要发送回什么文件名。大多数网站不会这么好心地提供这种服务。 - Brock Adams

Answer 5

如果你正在寻找一种解决办法来处理下载Chrome扩展的问题，那么你应该研究chrome.downloads API。它需要额外的权限（“downloads”），并允许你指定文件名。https://developer.chrome.com/extensions/downloads

然而，我现在面临的一个问题是，我正在重构的Chrome扩展程序已经拥有超过600,000个用户，并且添加新的权限将会禁用所有用户的扩展程序。所以这对我来说不是可行的解决方案，但如果你正在开发一个新的扩展程序，你绝对应该使用它。

- Boris Mossounov

Answer 6

据我所知，你无法直接从客户端完成这个操作。你可以先将文件上传到服务器并使用所需的名称，然后再将其提供给最终用户（在这种情况下，将使用你的文件名）。

- Saket