是否有用于带有数据 uri 的链接下载的 Polyfill?

2024-04-04

我有一些代码应该由服务器生成:

<a download="test.csv" href="data:text/plain;charset=utf-8;base64,w4FydsOtenTFsXLFkXTDvGvDtnJmw7p0w7Nnw6lwLg==">
    teszt
</a>

它适用于当前的 chrome、firefox、opera。我希望它支持 MSIE11。 AFAIKmsSaveBlob是解决方案。是否有我可以使用的现有 js polyfill,或者我应该编写它?


好吧,我根据我在 SO 答案中找到的代码做了一个简单的填充here https://github.com/rndme/download。我在MSIE11上测试过,可以用。它不支持文件下载XHR,只是数据 URI。我建议使用Content-Disposition如果您想强制下载文件,请改为响应标头。在我的例子中,服务器只是创建文件,但不应该存储它,而且我还需要 HTML 响应,所以这就是要走的路。另一种解决方案是通过电子邮件发送文件,但我发现通过小文件发送文件更好。

(function (){

    addEvent(window, "load", function (){
        if (isInternetExplorer())
            polyfillDataUriDownload();
    });

    function polyfillDataUriDownload(){
        var links = document.querySelectorAll('a[download], area[download]');
        for (var index = 0, length = links.length; index<length; ++index) {
            (function (link){
                var dataUri = link.getAttribute("href");
                var fileName = link.getAttribute("download");
                if (dataUri.slice(0,5) != "data:")
                    throw new Error("The XHR part is not implemented here.");
                addEvent(link, "click", function (event){
                    cancelEvent(event);
                    try {
                        var dataBlob = dataUriToBlob(dataUri);
                        forceBlobDownload(dataBlob, fileName);
                    } catch (e) {
                        alert(e)
                    }
                });
            })(links[index]);
        }
    }

    function forceBlobDownload(dataBlob, fileName){
        window.navigator.msSaveBlob(dataBlob, fileName);
    }

    function dataUriToBlob(dataUri) {
        if  (!(/base64/).test(dataUri))
            throw new Error("Supports only base64 encoding.");
        var parts = dataUri.split(/[:;,]/),
            type = parts[1],
            binData = atob(parts.pop()),
            mx = binData.length,
            uiArr = new Uint8Array(mx);
        for(var i = 0; i<mx; ++i)
            uiArr[i] = binData.charCodeAt(i);
        return new Blob([uiArr], {type: type});
    }

    function addEvent(subject, type, listener){
        if (window.addEventListener)
            subject.addEventListener(type, listener, false);
        else if (window.attachEvent)
            subject.attachEvent("on" + type, listener);
    }

    function cancelEvent(event){
        if (event.preventDefault)
            event.preventDefault();
        else
            event.returnValue = false;
    }

    function isInternetExplorer(){
        return /*@cc_on!@*/false || !!document.documentMode;
    }

})();
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

是否有用于带有数据 uri 的链接下载的 Polyfill? 的相关文章

随机推荐

  • 如何向 WordPress 添加简单的 jQuery 脚本?

    我阅读了 Codex 和一些关于在 WordPress 中使用 jQuery 的博客文章 这非常令人沮丧 我已经加载了 jQueryfunctions php文件 但所有的指南都很糟糕 因为他们假设你已经有大量的 WordPress 经验
  • 如何在 gradle 中获取当前选择的构建变体?

    我正在使用带有 gradle 2 2 的 Android Studio RC 我的构建变体部分中有一些变体 我可以选择我想要构建的变体 例如 为匈牙利或德国构建的一个 我在 gradle 脚本中启动了一些任务 例如根据风味 变体更改名称 但
  • Backbone.js 中的分页

    我知道有一个组件可以实现此目的 但根据我所看到的 您必须创建一个扩展组件的新集合 还有另一种方法可以在主干中进行分页吗 我所需要的只是一个上一个和下一个按钮 将每页的项目限制为 12 个 我一直在 javascript 上创建它 对于生产环
  • 尝试在 slack 上为 laravel-botman 启用事件订阅时,如何响应正确的质询值

    这不是我之前的问题的重复here https stackoverflow com questions 52850571 connecting slack to botman in laravel on localhost 我正在使用botm
  • 未找到图像或类型未知 Dompdf 0.8.1 和 CodeIgniter

    我想从生成的图像将图像加载到 PDF 我已经设置了isRemoteEnabled 为 true和 生成的 QRCode 工作正常 这是我的代码 this gt load gt library array pdf ciqrcode data
  • 如何解码包含无效字节的字节对象,Python3

    在python2中 我可以整天生成以字符串格式表示的这些十六进制字节 x00 xaa xff gt gt gt 00 decode hex aa decode hex ff decode hex gt gt gt x00 xaa xff 同
  • 为什么 2 和 4 在 b 之前打印?

    function first return new Promise resolve gt console log 2 resolve 3 console log 4 async function f console log 1 let r
  • 如何使用用户提供的 Hadoop 正确配置 Spark 2.4

    我想使用 Spark 2 4 5 当前稳定的 Spark 版本 和 Hadoop 2 10 2 x 系列中当前稳定的 Hadoop 版本 此外 我需要访问 HDFS Hive S3 和 Kafka http spark apache org
  • 引导多个 angular2 模块时出错

    当我们更新应用程序的某些部分时 我们开始将当前的应用程序转换为 Angular2 所以我们正在尝试用 Angular2 模块 组件替换应用程序的某些部分 第一部分是创建两个不同的搜索组件并将它们放置在 asp net mvc 中的不同视图中
  • grails 更改 gsp 视图中的日期格式

    当我尝试在 gsp 视图中使用日期格式标记来更改日期格式时 但它不起作用 这是我的代码 class MyDate Date date 我的日期控制器 def unixSeconds params date replaceAll as lon
  • 我可以使用Treetop来解析IO吗?

    我有一个文件想要用 Treetop 解析 如果我想解析整个事情 我会使用 rule document category listing end 我真的不想立即将整个文件读入内存 我知道我可以设置解析器来解析一个category listin
  • MySQL 中的行版本控制

    我想在表中包含一个整数版本字段 在每次更新行时自动递增 在 MySQL 中可以做到这一点吗 请注意 我不是在谈论TIMESTAMP 这是不可靠的 因为同一秒内可能会发生两个并发更新 是的 更一般的问题称为缓慢改变尺寸 http en wik
  • 在强类型 MVC 视图用户控件中使用值类型

    我有一个具有以下基本结构的 MVC 用户控件 当我使用它时 它给出了这个错误消息 编译器错误消息 CS0452 类型 decimal 必须是引用 输入以便将其用作参数 泛型类型或方法中的 TModel System Web Mvc View
  • 如何使用 Nokogiri 访问属性

    我有一个访问某些属性的值的简单任务 这是一个简单的脚本 使用Nokogiri XML Builder创建一个简单的 XML 文档 require nokogiri builder Nokogiri XML Builder new encod
  • 如何在子线程中继续ThreadLocal的对象?

    我在 ThreadLocal 中传递了一个对象 现在我当前的线程将创建新的子线程 我希望 ThreadLocal 中的对象也应该继续使用子线程 有什么办法可以做到这一点吗 先感谢您 你需要的是一个InheritableThreadLocal
  • 这个计算 a^n 的算法是如何重写以在 O(log n) 时间内运行的?

    Suppose you want to compute an A simple algorithm would multiply a n times as follows result 1 for int i 1 i lt n i resu
  • TypeScript - 是否可以根据模式匹配甚至长度来验证字符串类型?

    考虑以下组件 它使用一个名为的库styled components创建一个预样式Text成分 const StyledText styled Text font family Roboto color props ITextProps gt
  • 通过 os.system('') 激活 VT100?

    在 Win10 conhost 获得 VT100 支持后 我尝试了一下它 最终我发现os system 激活Python中的支持并得到以下结果 import os print 033 36mTest 033 0m os system pri
  • 将逗号分隔的记录放入字符串数组中?

    我正在尝试读取一个 BufferedReader 它读取包含用逗号分隔的记录的文件 我想将每个字符串 或记录 拆分在两个逗号之间 去掉双引号 然后将每个字符串放入字符串数组的索引中 例如 假设我的文件中有这一行 0001 00203 824
  • 是否有用于带有数据 uri 的链接下载的 Polyfill?

    我有一些代码应该由服务器生成 a href teszt a 它适用于当前的 chrome firefox opera 我希望它支持 MSIE11 AFAIKmsSaveBlob是解决方案 是否有我可以使用的现有 js polyfill 或者