Javascript 在使用data:URI时，有没有办法指定建议的文件名？_Javascript_Html_Url_Data Uri_Save As

Javascript 在使用data:URI时，有没有办法指定建议的文件名？

javascript html url

Javascript 在使用data:URI时，有没有办法指定建议的文件名？,javascript,html,url,data-uri,save-as,Javascript,Html,Url,Data Uri,Save As,例如，如果您遵循以下链接：数据：应用程序/八位字节流；base64，SGVsbG8= 浏览器将提示您下载一个文件，该文件包含超链接本身中作为base64保存的数据。有没有办法在标记中建议默认名称？如果没有，是否有JavaScript解决方案？根据，没有在元素上似乎也没有任何属性，尽管在编写本文时支持不是通用的（例如没有MSIE支持）否整个目的是它是一个数据流，而不是一个文件。数据源不应该知道用户代理将其作为文件处理。。。但事实并非如此。这有点老套，但我以前也遇到过同样的情况。我正在用jav

例如，如果您遵循以下链接：

数据：应用程序/八位字节流；base64，SGVsbG8=

浏览器将提示您下载一个文件，该文件包含超链接本身中作为base64保存的数据。有没有办法在标记中建议默认名称？如果没有，是否有JavaScript解决方案？

根据，没有

在

元素上似乎也没有任何

属性，尽管在编写本文时支持不是通用的（例如没有MSIE支持）
否
整个目的是它是一个数据流，而不是一个文件。数据源不应该知道用户代理将其作为文件处理。。。但事实并非如此。
这有点老套，但我以前也遇到过同样的情况。我正在用javascript动态生成一个文本文件，并希望通过使用数据URI对其进行编码来提供下载
这在minormajor用户干预下是可能的。生成链接
。正如我所说的，这是不雅观的，但如果你不需要专业的解决方案，它是有效的
首先使用flash将名称复制到剪贴板中，可以减少痛苦。当然，如果您允许自己使用Flash或Java（我想现在浏览器支持越来越少了？），您可能会找到另一种方法来实现这一点。请查看以下链接：

引述：
它甚至可以工作（如，不会引起问题）；末尾的base64

像这样（至少在歌剧中）：
数据：文本/纯文本；字符集=utf-8；headers=内容处置%3A%20attachment%3B%20filename%3D%22with%20spaces.txt%22%0D%0a内容语言%3A%20en；base64,4oiaDQo%3D
在讨论的其余消息中也有一些信息。
我在netwerk/protocol/data/nsDataHandler.cpp中查看了一些firefox源代码
数据处理程序只解析内容/类型和字符集，并查看是否存在“base64”
串连
rfc没有指定任何文件名，至少firefox没有为其处理任何文件名，
该代码生成一个随机名称加“.part”
我还检查了firefox日志
[b2e140]：DOCSHELL 6e5ae00内部加载数据：应用程序/八位字节流；base64，SGVsbG8=
[b2e140]：找到扩展名“”（文件名为“”，处理附件：0）
[b2e140]：HelperAppService:：DocContent:mime“应用程序/八位字节流”，扩展名“”
[b2e140]：从类型“应用程序/八位字节流”ext“”获取mimeinfo
[b2e140]：在“”上找到扩展查找：0x0
[b2e140]：找到“”的外部查找0x0
[b2e140]：操作系统返回0x43609a0-找到：0
[b2e140]：搜索的附加项（按类型），rv 0x80004005
[b2e140]：MIME信息摘要：键入“应用程序/八位字节流”，主Ext“”
[b2e140]：找到类型/外部查找0x43609a0

如果您想查看mozilla源代码，请查看有趣的文件：
数据uri处理程序：netwerk/protocol/data/nsDataHandler.cpp
其中由mozilla决定文件名：uriloader/exthandler/nsExternalHelperAppService.cpp
日志中的内部加载字符串：docshell/base/nsDocShell.cpp

我认为您现在可以停止搜索解决方案，因为我怀疑没有：）
正如在这个线程中注意到的，html5具有download
属性，它也可以在firefox 20上工作使用download
属性：
<a download='FileName' href='your_url'>

Chrome、Firefox、Edge、Opera、桌面Safari 10+、iOS Safari 13+，而不是IE11。
谷歌代码上有一个很小的解决方案脚本，对我很有用：

它添加一个包含数据的表单，提交该表单，然后再次删除该表单。哈奇，但它帮了我的忙。需要jQuery
该线程在Google代码页之前出现在Google中，我认为在这里也有链接可能会有所帮助。
您可以向锚元素添加下载属性
样本：
<a download="abcd.cer"
    href="data:application/stream;base64,MIIDhTC......">down</a>

以下Javascript代码片段在Chrome中工作，使用链接的新“下载”属性并模拟单击
function downloadWithName(uri, name) {
  var link = document.createElement("a");
  link.download = name;
  link.href = uri;
  link.click();
}

下面的示例显示了它的用途：
downloadWithName("data:,Hello%2C%20World!", "helloWorld.txt")

如今，Chrome让这一切变得非常简单：
function saveContent(fileContents, fileName)
{
    var link = document.createElement('a');
    link.download = fileName;
    link.href = 'data:,' + fileContents;
    link.click();
}

这是一个基于Holf版本的jQuery版本，可用于Chrome和Firefox，而他的版本似乎只适用于Chrome。在身体上添加一些东西来做这件事有点奇怪，但如果有人有更好的选择，我完全赞成
var exportFileName = "export-" + filename;
$('<a></a>', {
    "download": exportFileName,
    "href": "data:," + JSON.stringify(exportData, null,5),
    "id": "exportDataID"
}).appendTo("body")[0].click().remove();

var exportFileName=“导出-”+文件名；
$('', {
“下载”：exportFileName，
“href:”数据：，“+JSON.stringify（exportData，null，5），
“id”：“exportDataID”
}).appendTo（“正文”）[0]。单击（）.remove（）；
仅HTML:使用下载属性：
<a download='FileName' href='your_url'>


使用，这最终在最真实的意义上是可能的
创建一个假URL。例如/saveAs/myPrettyName.jpg
在中使用URL此选项适用于Firefox 43.0（未测试旧版本）：
dl.js:
function download() {
  var msg="Hello world!";
  var blob = new File([msg], "hello.bin", {"type": "application/octet-stream"});

  var a = document.createElement("a");
  a.href = URL.createObjectURL(blob);

  window.location.href=a;
}

dl.html
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>
    <meta charset="utf-8"/>
    <title>Test</title>
    <script type="text/javascript" src="dl.js"></script>
</head>

<body>
<button id="create" type="button" onclick="download();">Download</button>
</body>
</html>


测验
下载

若点击按钮，它会提供一个名为hello.bin的文件供下载。诀窍是使用File而不是Blob
参考资料：
您实际上可以在Chrome和FireFox中实现这一点
尝试以下url，它将下载所使用的代码
data:text/html;base64,PGEgaHJlZj0iZGF0YTp0ZXh0L2h0bWw7YmFzZTY0LFBHRWdhSEpsWmowaVVGVlVYMFJCVkVGZlZWSkpYMGhGVWtVaUlHUnZkMjVzYjJGa1BTSjBaWE4wTG1oMGJXd2lQZ284YzJOeWFYQjBQZ3BrYjJOMWJXVnVkQzV4ZFdWeWVWTmxiR1ZqZEc5eUtDZGhKeWt1WTJ4cFkyc29LVHNLUEM5elkzSnBjSFErIiBkb3dubG9hZD0idGVzdC5odG1sIj4KPHNjcmlwdD4KZG9jdW1lbnQucXVlcnlTZWxlY3RvcignYScpLmNsaWNrKCk7Cjwvc2NyaXB0Pg==


它适用于左键单击、右键单击->将链接另存为..、右键单击->将图像另存为
您必须编写两次数据uri（href和src），因此对于大型图像文件，最好使用javascript复制uri
使用Chrome/Edge 88进行测试
遗憾的是，此版本未下载。此讨论是针对数据URI格式的拟议扩展-尚未实施。无论是否实施，有了对任意参数的现有支持，这将是一个很好的选择。数据：的目的是将内部数据块伪造成URL格式，而不必从基于协议的源读取。@silex的答案中的链接显示了建议编写首选名称的能力
data:text/html;base64,PGEgaHJlZj0iZGF0YTp0ZXh0L2h0bWw7YmFzZTY0LFBHRWdhSEpsWmowaVVGVlVYMFJCVkVGZlZWSkpYMGhGVWtVaUlHUnZkMjVzYjJGa1BTSjBaWE4wTG1oMGJXd2lQZ284YzJOeWFYQjBQZ3BrYjJOMWJXVnVkQzV4ZFdWeWVWTmxiR1ZqZEc5eUtDZGhKeWt1WTJ4cFkyc29LVHNLUEM5elkzSnBjSFErIiBkb3dubG9hZD0idGVzdC5odG1sIj4KPHNjcmlwdD4KZG9jdW1lbnQucXVlcnlTZWxlY3RvcignYScpLmNsaWNrKCk7Cjwvc2NyaXB0Pg==