Anchor的下载媒体资源在某些网页（Gmail）上无法使用？ [英] Anchor's Download Property is not working on some pages (Gmail)?

问题描述

我想在某些网页中插入此HTML元素：

I want to insert this HTML element in some pages:

<a download="somedata.csv"
   id="downloadLink"
   href="data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333"
>
    Click Me
</a>

在所有页面中，当我通过插件或在元素检查器中手动更改dom时，到页面的dom，它工作伟大！

但是，如果我在Gmail页面中执行相同操作，则生成的文件不会命名为 somedata.csv ，扩展名会丢失 csv ！

In all pages, when I change the dom via plugin or manually in elements inspector, to include this element to page's dom, it works great !
But, if I do the same in Gmail pages, the file generated is not named "somedata.csv" and the extension is lost "csv" !

我在本地文件中尝试过，在上传到localhost的文件中，适用于除Gmail页面之外的所有版本。

I tried this in local file, in file uploaded to localhost, and in many external website pages, it works in all except for Gmail pages.

为什么在Gmail页面中无法使用？

Why it doesn't work in Gmail pages ? And how to fix this ?

推荐答案

对于那些有兴趣的人，我使用Javascript / Ajax解决了这个问题，解决方案：

For those who are interested, I solved it using Javascript/Ajax, here's the solution:

以下是函数：

var downloadDataURI = function($, options) {
    if(!options)
        return;
    $.isPlainObject(options) || (options = {data: options});
    if(!$.browser.webkit) 
        window.location = options.data;
    options.filename || (options.filename = "download." + options.data.split(",")[0].split(";")[0].substring(5).split("/")[1]);
    options.url || (options.url = "http://download-data-uri.appspot.com/");
    $('<form method="post" action="'+options.url+'" style="display:none"><input type="hidden" name="filename" value="'+options.filename+'"/><input type="hidden" name="data" value="'+options.data+'"/></form>').submit().remove();
}

以下是如何调用它：

downloadDataURI($, {filename: "test.csv",data:"data:application/csv;charset=utf-8,Col1%2CCol2%2CCol3%0AVal1%2CVal2%2CVal3%0AVal11%2CVal22%2CVal33%0AVal111%2CVal222%2CVal333"});

这篇关于Anchor的下载媒体资源在某些网页（Gmail）上无法使用？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！