例如,如果你点击链接:

数据:应用程序/八进制;base64 SGVsbG8 =

浏览器将提示您下载一个文件,该文件由超链接本身中base64所包含的数据组成。是否有办法在标记中建议一个默认名称?如果不是,是否有JavaScript解决方案?


当前回答

这一个适用于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。

参考:https://developer.mozilla.org/de/docs/Web/API/File

其他回答

var isIE = /*@cc_on!@*/false || !!document.documentMode; // At least IE6
var sessionId ='\n';
var token = '\n';
var caseId = CaseIDNumber + '\n';
var url = casewebUrl+'\n';
var uri = sessionId + token + caseId + url;//data in file
var fileName = "file.i4cvf";// any file name with any extension
if (isIE)
    {
            var fileData = ['\ufeff' + uri];
            var blobObject = new Blob(fileData);
            window.navigator.msSaveOrOpenBlob(blobObject, fileName);
    }
    else //chrome
    {
        window.requestFileSystem = window.requestFileSystem || window.webkitRequestFileSystem;
         window.requestFileSystem(window.TEMPORARY, 1024 * 1024, function (fs) {
            fs.root.getFile(fileName, { create: true }, function (fileEntry) { 
                fileEntry.createWriter(function (fileWriter) {
                    var fileData = ['\ufeff' + uri];
                    var blob = new Blob(fileData);
                    fileWriter.addEventListener("writeend", function () {
                        var fileUrl = fileEntry.toURL();
                        var link = document.createElement('a');
                        link.href = fileUrl;
                        link.download = fileName;
                        document.body.appendChild(link);
                        link.click();
                        document.body.removeChild(link);
                    }, false);
                    fileWriter.write(blob);
                }, function () { });
            }, function () { });
         }, function () { });
    }

使用download属性:

<a download='FileName' href='your_url'>

下载属性适用于Chrome、Firefox、Edge、Opera、桌面版Safari 10+、iOS Safari 13+,但不适用于IE11。

根据RFC 2397,没有。

<a>元素似乎也没有任何可以使用的属性。

然而,HTML5随后在<a>元素上引入了下载属性,尽管在编写时支持并不普遍(例如,没有MSIE支持)。

使用服务工作者,这最终在真正意义上成为可能。

创建一个假URL。例如/saveAs/myPrettyName.jpg 在<a href, <img src,窗口中使用URL。open(url),绝对可以用“真正的”url做任何事情。 在worker内部,捕获fetch事件,并用正确的数据进行响应。

浏览器现在会建议myPrettyName.jpg,即使用户在一个新的选项卡打开文件,并试图保存它。这将完全像文件来自服务器一样。

// In the service worker
self.addEventListener( 'fetch', function(e)
{
    if( e.request.url.startsWith( '/blobUri/' ) )
    {
        // Logic to select correct dataUri, and return it as a Response
        e.respondWith( dataURLAsRequest );
    }
});

No.

整个目的是它是一个数据流,而不是一个文件。数据源不应该知道用户代理将其作为文件处理……事实并非如此。