前端静态文件下载处理方式

前端静态文件下载处理方式

a标签自带下载

• 实现方式

// vue下载本地文件时，一定要把本地静态文件存放在配置文件指定的文件夹下，小编是assets目录
// ie浏览器发现a标签的download属性无效
<a href='./assets/download/template.pdf' download='template'>下载模板</a>

• 问题1
  在a标签上添加target="_blank" 熟悉，让ie浏览器直接打开新的标签页，预览文件后下载。
• 问题2
  把文件压缩成为压缩包，这样ie和谷歌都会默认下载文件！！！

iframe方法

• 实现方式

let eleIF = document.createElement('iframe');
eleIF.src = url;//下载文件地址
eleIF.style.display = 'none';
document.body.appendChild(eleIF);

• 问题1
  下载文件地址路径非常重要，要确定好配置文件中区分环境后的地址，不然会导致运行可以，打包后失败

from表单方式

• 实现方式

var $eleF = $('<from method="get"></from>');
$eleF.attr('action',url);
$(document.body).append($eleF);
$eleF.submit();

• 问题1
  url地址同上！！！