我有一个Base64编码的文件,可以是PDF文件或图像.我想在HTML5页面中创建一个按钮,在新选项卡中打开此base64(或者新页面无关紧要)
我发现这段代码可以解决问题:
This link will open in new window/tab
它运作良好.但是当我用http替换http链接时
href="data:application/octet-stream;base64,/9j/4A.."
然后下载文件但不在浏览器中显示.
我该怎么做？
谢谢
您的MIME类型设置为"application/octet-stream",通常会下载并不显示(取决于浏览器和系统设置).如果您尝试加载浏览器可显示的内容,那么您应该为您的内容使用更合适的MIME类型,以便它显示为内联而不会下载.
请注意:从Chrome 60和即将推出的FireFox版本开始(虽然看起来FireFox 仍然支持图像),但无法在浏览器的顶层框架中打开数据URI(IE/Edge从未支持过数据URI ),但它们可以在iframe和img元素中打开.
下面的解决方法已在上述浏览器的最新版本中进行了测试和工作.这也可以用img标签重写以显示图像.
document.getElementById('btnDownload').addEventListener('click', function(){
var w = window.open('about:blank');
setTimeout(function(){ //FireFox seems to require a setTimeout for this to work.
w.document.body.appendChild(w.document.createElement('iframe'))
.src = 'data:application/octet-stream;base64,SWYgSSBoYWQgYSBuaWNrbGUgZm9yIGV2ZXJ5IHRpbWUgSSBoYWQgYSBuaWNrbGUsIEknZCBoYXZlIGVhdGVuIHR3aWNlIGFzIG1hbnkgcGlja2xlcy4=';
}, 0);
});
但是,如果您打算只下载内容(与问题中的陈述意图相反,但一般适用于'application/octet-stream'内容),这应该足够了:
Download this
在chrome和Firefox上进行了测试，只需将base64值添加到href属性即可（没有onclick和onkeypress事件）。就像这样：
test
京公网安备 11010802040832号 | 京ICP备19059560号-6 