单击数据URI锚点链接时,强制Chrome / Safari中的“另存为”框

时间:2011-02-15 21:33:58

标签: dialog cross-browser anchor data-uri save-as

<a href="data:text/csv;base64,CiJpZCIsInJlcXVlc3RfaWQiLCJkYXRlIiwiY29tcGFueV9uYW1lIiwiYWRkcmVzcyIsInBob25lIiwid2Vic2l0ZV91cmwiLCJwbGFjZV9wYWdlX3VybCIsImFkdmVydGlzZXIiLCJyZXZpZXdzIiwicmV2aWV3c190ZXh0Iiwib3duZXJfdmVyaWZpZWQiLCJjYXRlZ29yaWVzIiwibGF0IiwibG5nIiwicGxhY2VodG1sIiwiZ29vZ2xlX3RhZyIsIm1hcHNfdXJsIiwic2l0ZV9kZXNjcmlwdGlvbiIsImRlc2NyaXB0aW9uX2F0dHJpYnV0aW9uIiwib3duZXJfZW1haWwiLCJrZXl3b3JkIiwibGlua3MiCiIxNDc4IiwiNTMyIiwiIiwiU3RhcmJ1Y2tzIiwiMTI5OCBIb3dhcmQgU3RyZWV0LCBTYW4gRnJhbmNpc2NvLCBDQSA5NDEwMyIsIig0MTUpIDU2NS03Mzg1IiwiaHR0cDovL3d3dy5zdGFyYnVja3MuY29tLyIsImh0dHA6Ly9tYXBzLmdvb2dsZS5jb20vbWFwcy9wbGFjZT9obD1lbiZhc19xPXNhbitmcmFuY2lzY28rc3RhcmJ1Y2tzJmFzX2VwcT0mYXNfb3E9JmFzX2VxPSZudW09MTAmbHI9JmFzX2ZpbGV0eXBlPSZhc19zaXRlc2VhcmNoPSZhc19xZHI9YWxsJmFzX3JpZ2h0cz0mYXNfb2NjdD1hbnkmY3I9JmFzX25sbz0mYXNfbmhpPSZzYWZlPWltYWdlcyZ1bT0xJmllPVVURi04JnE9c2FuK2ZyYW5jaXNjbytzdGFyYnVja3MmZmI9MSZocT1zdGFyYnVja3MmaG5lYXI9U2FuK0ZyYW5jaXNjbywrQ0EmY2lkPTQ4NTI1NDg2NzIzODU5NzI1OTMmZWk9bUVWRFRhU05PWWEwbFFmV2haZ3Amc2E9WCZvaT1sb2NhbF9yZXN1bHQmY3Q9cGxhY2VwYWdlLWxpbmsmcmVzbnVtPTImdmVkPTBDQ0lRNGdrd0FRIiwiMCIsIjYiLCIiLCIxIiwiUmVzdGF1cmFudCIsIiIsIiIsIiIsIjAiLCIiLCIiLCIiLCIiLCJzYW4gZnJhbmNpc2NvIHN0YXJidWNrcyIsIkFycmF5IgoiMTQ3OSIsIjUzMiIsIiIsIlN0YXJidWNrcyIsIjEyMzEgTWFya2V0IFN0cmVldCwgU2FuIEZyYW5jaXNjbywgQ0EgOTQxMDMiLCIoNDE1KSA1MjItMTQzOCIsImh0dHA6Ly93d3cuc3RhcmJ1Y2tzLmNvbS8iLCJodHRwOi8vbWFwcy5nb29nbGUuY29tL21hcHMvcGxhY2U/aGw9ZW4mYXNfcT1zYW4rZnJhbmNpc2NvK3N0YXJidWNrcyZhc19lcHE9JmFzX29xPSZhc19lcT0mbnVtPTEwJmxyPSZhc19maWxldHlwZT0mYXNfc2l0ZXNlYXJjaD0mYXNfcWRyPWFsbCZhc19yaWdodHM9JmFzX29jY3Q9YW55JmNyPSZhc19ubG89JmFzX25oaT0mc2FmZT1pbWFnZXMmdW09MSZpZT1VVEYtOCZxPXNhbitmcmFuY2lzY28rc3RhcmJ1Y2tzJmZiPTEmaHE9c3RhcmJ1Y2tzJmhuZWFyPVNhbitGcmFuY2lzY28sK0NBJmNpZD01Mjg4Nzg4OTkwOTk4MjYyOTEzJmVpPW1FVkRUYVNOT1lhMGxRZldoWmdwJnNhPVgmb2k9bG9jYWxfcmVzdWx0JmN0PXBsYWNlcGFnZS1saW5rJnJlc251bT0zJnZlZD0wQ0NrUTRna3dBZyIsIjAiLCIzNiIsIiAiIlN0YXJidWNrcyBoYXMgdGhlIGJlc3QgY29mZmVlIiIgIC0gIGNpdHlzZWFyY2guY29tICAgLi4uICAiIklzbid0IGl0IGVub3VnaCB0aGF0IHRoZXkgYWxtb3N0IG93biBhIG1vbm9wb2x5IGF0IGFsbCBhaXJwb3J0cz8iIiAgLSAgY2l0eXNlYXJjaC5jb20gICAuLi4gICIiSXQgaXMgYSBwaXR5IHRoYXQgYSBjaGFpbiB0aGUgc2l6ZSBvZiBTdGFyYnVjaydzIGlzIGV2ZW4gb24gdGhpcyAiIkJlc3Qgb2YiIiBsaXN0IiIgIC0gIGNpdHlzZWFyY2guY29tICAgLi4uICAiIkV2ZW4gd29yc2UgbW9vZCIiICAtICBjaXR5c2VhcmNoLmNvbSAgIC4uLiAgIiJTZXJ2aWNlIGlzIHVzdWFsbHkgZ3JlYXQiIiAgLSAgY2l0eXNlYXJjaC5jb20gICAuLi4gICIiR3JlYXQgam9iIGd1eXMhIiIgIC0gIGNpdHlzZWFyY2guY29tICAgLi4uICAiIlRoaW5rIGFib3V0IGl0ISIiICAtICBjaXR5c2VhcmNoLmNvbSAgICAiLCIxIiwiQ2FmZSwgQ29mZmVlICZhbXA7IFRlYSwgQ29mZmVlIFNob3BzLCBSZXN0YXVyYW50cywgQ29mZmVlIEhvdXNlcyAmYW1wOyBDYWZlcywgUmVzdGF1cmFudCIsIiIsIiIsIiIsIjAiLCIiLCIiLCIiLCIiLCJzYW4gZnJhbmNpc2NvIHN0YXJidWNrcyIsIkFycmF5IgoiMTQ4MCIsIjUzMiIsIiIsIlN0YXJidWNrcyIsIjE4OTkgVW5pb24gU3RyZWV0LCBTYW4gRnJhbmNpc2NvLCBDQSA5NDEyMyIsIig0MTUpIDkyMS00MDQ5IiwiaHR0cDovL3d3dy5zdGFyYnVja3MuY29tLyIsImh0dHA6Ly9tYXBzLmdvb2dsZS5jb20vbWFwcy9wbGFjZT9obD1lbiZhc19xPXNhbitmcmFuY2lzY28rc3RhcmJ1Y2tzJmFzX2VwcT0mYXNfb3E9JmFzX2VxPSZudW09MTAmbHI9JmFzX2ZpbGV0eXBlPSZhc19zaXRlc2VhcmNoPSZhc19xZHI9YWxsJmFzX3JpZ2h0cz0mYXNfb2NjdD1hbnkmY3I9JmFzX25sbz0mYXNfbmhpPSZzYWZlPWltYWdlcyZ1bT0xJmllPVVURi04JnE9c2FuK2ZyYW5jaXNjbytzdGFyYnVja3MmZmI9MSZocT1zdGFyYnVja3MmaG5lYXI9U2FuK0ZyYW5jaXNjbywrQ0EmY2lkPTk1NjE5NTAwNjUwMTYwMTgwMCZlaT1tRVZEVGFTTk9ZYTBsUWZXaFpncCZzYT1YJm9pPWxvY2FsX3Jlc3VsdCZjdD1wbGFjZXBhZ2UtbGluayZyZXNudW09NCZ2ZWQ9MENEQVE0Z2t3QXciLCIwIiwiMzUiLCIiLCIxIiwiQ2FmZSwgQ29mZmVlICZhbXA7IFRlYSwgQ29mZmVlIFNob3BzLCBDb2ZmZWUgSG91c2VzICZhbXA7IENhZmVzIiwiIiwiIiwiIiwiMCIsIiIsIiIsIiIsIiIsInNhbiBmcmFuY2lzY28gc3RhcmJ1Y2tzIiwiQXJyYXkiCg==">Export This</a>

以上是包含基本64位编码的csv数据导出的数据URI。在我的应用报告页面上,我将导出嵌入到每个页面视图中,以便导出不需要再次访问数据库。

在Firefox 3中,单击此链接将打开另存为“下载”对话框。在Chrome 9中单击它不会做任何事情。我可以在Chrome中右键单击保存,它会将解码后的csv写入文件。在Safari中单击它会在浏览器窗口中打开解码的CSV数据,然后我可以手动保存。

在IE中......谁在乎,我是对的吗?

您可以通过将<a>标记全部复制到名为test.html的空白文件中并在每个浏览器中打开它来重现此测试。它的行为与我的应用程序环境中的行为完全相同。

问题:当用户点击数据URI链接时,有没有办法强制弹出“另存为”对话框,就像在Firefox中一样?或者其他一些方法来解决这种不一致问题?

理论上,Firefox,Chrome和Safari都支持数据URI。在实践中.......

1 个答案:

答案 0 :(得分:2)

不幸的是,在Safari(至少Safari 6)中,application / octet-stream不能很好地工作。它只是将文件保存为“未知”而没有“保存”对话框。据我所知,除了从服务器上反弹内容之外,没有跨浏览器的方式去做你想要做的事情。