JS追加文件下载

   开发过程中遇到一个需求变动，主管要求网站在提供文件下载的时候不要使用 服务写流的形式（out.write）进行文件下载。需要改造成将文件生成到 文件服务器路径下，然后以http的形式直接进行文件访问、下载。  我想这个访问http地址显示文件的方式，大家应该都回使用到，比如：需要加载远程图片时<img src = "http://...." />。而现在需要实现的是文件下载...

    （需求：下载文件类型为PDF文件）

    刚开始还以为直接使用 window.open()或者 <a href="" target="blank"><a/>就能够轻松实现下载，说到这里是不是很天真。

    上面这两种方式貌似之后再返回的是压缩包的情况下才会下载。而PDF使用这个方法360，google等浏览器中都回直接进行文件预览。

   所以上面的两种方法就被我排除了。

    于是我开始了百度，搜索了半天，发现有两种解决方案：

一、使用第三方插件的形式，如：jQuery的插件jdownload，但是它是以弹出框提示信息的形式，需要客户再点击弹出框的下载按钮后才能进行文件下载，------排除。

  二、使用iframe实现文件下载

具体实现方式：

[html] view plain copy

1. //触发函数  
2. function downloadfile(url) {  
3.     var iframe = document.createElement("iframe");  
4.     iframe.src = url;  
5.     iframe.style.display = "none";  
6.     document.body.appendChild(iframe);  
7. }  

这种方式也有缺陷，只能IE浏览器才能进行下载，使用google浏览器时就报错了，错误如下：

               Resource interpreted as Document but transferred with MIME type application/pdf

             根据这个错误提示我又开始寻找解决方案， 由于访问图片是根据tomcat服务器，我就想是不是tomcat服务器的mime-type缺少了application/pdf类型而导致的。然后我就找到了tomcat的web.xml文件，却发现mime-type中有application/pdf这个类型。  又一次进入蒙圈的状态····

    又开始找啊找，又找到了一种方式，HTML5为 <a>标签提供了一个download属性，会将<a>标签访问路径后的资源进行下载， download中填写的是下载后的文件名。这个方法总算是解决了我的问题。 具体实现方式：

[html] view plain copy

1. <a download="" href="" target="blank" id="downPdf"></a>  
2.   
3. //js方法  
4. $.post(url,{param1,param2},function(data){            
5.         if(data.code==0){  
6.             try{   
7.                 var a = document.getElementById("downPdf");  
8.                 a.href=data.url;  
9.                 a.download=data.fileName;  
10.                 a.click();  
11.             }catch(e){   
12.             }   
13.         }else{  
14.             alert(data.errorMsg);  
15.         }                                 
16.     });   

   为了解决这个问题，我是绕了一圈又回到原点，说多了都是泪啊。  希望这个解决方案能够帮助到大家。