iframe下载与a标签下载有哪些区别？

利用iframe下载文件和利用a标签下载文件有哪些区别？

1. iframe如何实现下载文件
2. a标签如何下载文件
3. 两者之间的区别有哪些

1.iframe下载

 <a ms-click="goFileClick(el)" id="welcomeMiddleBtn"  style="color:#2093ee;cursor: pointer;padding-left:10px">{{el.fileName}}
   <iframe style="width:0px;display:none" id="iframefiledown" ></iframe>
</a>

goFileClick:function(el){
            var fileUrl=encodeURI(el.fileUrl);
            document.getElementById("iframefiledown").src=httpUrl+"/file/download?fileUrl="+fileUrl;
},

httpUrl：接口地址
fileUrl：前端参数传给后端时一定要转码，不然在IE浏览器中会出现乱码问题。

2.A标签下载

 <a ms-href="window.httpUrl+'/file/download?fileUrl='+encodeURI(el.fileUrl)" id="filebtn">
     {{el.fileName}}
 </a>

3.两者之间的区别

相同点：
iframe、a标签下载文件都是调用浏览器默认下载行为

不同点：

1. iframe不支持右键另存为下载文件，a标签支持
2. 下载文件时可以通过隐藏的iframe进行文件下载，隐秘性比较好，而通过a标签下载文件路由地址都暴露出来，隐秘性不是很好，接口及路由参数暴露在页面上。
3. 可使用iframe进行跨域访问或下载文件，a标签不行
4. 在低版本中（ie8一下）iframe下载文件存在兼容性问题，a标签兼容性很好。

写在最后

如果你觉得这篇文章写得不错或者对您有用的话请帮忙点赞加收藏，毕竟原创不易；如果您觉得文章有什么地方写得不对或者需要改进的地方，欢迎通过评论私聊博主！