web下载文件功能实现

前端下载文件方式有a标签，form表单，window.open()三种情况。

**1. a标签**

		```
		<a href="下载地址" download="下载文件名称">点击下载文件</a>
		```

**2. form表单**
	
		```
		$btn.click(function(){ 
            var $form = $("<form method='get'></form>"); 
   
            $eleForm.attr("action","下载地址"); 
   
            $(document.body).append($from); 
   
            //提交表单，实现下载 
            $from.submit(); 
        });
		```
		
**3. window.open()**

		```
		window.open("下载地址");
		```

下载文件功能调用后端接口返回的数据有文件流和下载地址两种情况。

1. 文件流
   若返回的结果为文件流数据时，我们需要将文件流转化为Blob形式，再讲Blob数据转化为下载的链接，即可下载。

		  var blob = new Blob([后台返回的文件流数据], {type: 'application/x-rar-compressed'});//转化为Blob形式，type为文件类型
          var href = window.URL.createObjectURL(blob); // 创建下载的链接
          var downloadElement = document.createElement('a');//创建a标签
          downloadElement.href = href;//a标签中加入下载链接
          downloadElement.download =“文件名”; // 下载后文件名
          document.body.appendChild(downloadElement);
          downloadElement.click(); // 点击下载
          document.body.removeChild(downloadElement); // 下载完成移除元素
          window.URL.revokeObjectURL(href); // 释放掉blob对象
          

2.下载地址
若返回的是下载地址，直接调用即可

           var downloadElement = document.createElement('a');
           var href = r.data.result.url; // 创建下载的链接
           downloadElement.href = href;
           // downloadElement.download =“文件名”; // 下载后文件名
           document.body.appendChild(downloadElement);
           downloadElement.click(); // 点击下载
           document.body.removeChild(downloadElement); // 下载完成移除元素