vue实现zip文件下载

<el-button size="mini" type="success" @click="downloadHandle(fileName, fileLocation)">下载</el-button>

import axios from 'axios'


// 创建axios实例
const service = axios.create({
  baseURL: '',    // api的baseURL
  timeout: 20000, // 请求超时时间
  params: {
 // 请求参数
  }
});

// request拦截器
service.interceptors.request.use(config => {
  // .... config 添加处理
  ......
  
  return config
}

export default service

import axios from 'axios'


// 创建axios实例
const service = axios.create({
  baseURL: '',    // api的baseURL
  timeout: 20000, // 请求超时时间
  params: {
 // 请求参数
  }
});

// request拦截器
service.interceptors.request.use(config => {
  // config 添加 token 值
  config.headers['token'] = getToken();  // getToken()是我的获取值方法，系统校验使用
  return config
}

export default service

import request from '@/utils/request'

// fileName下载设置名称，fileLocation文件存储名称
downloadHandle(fileName,fileLocation) {
   let prome = {
     fileLocation: fileLocation
   }
   request.post(
    '/api/downloadFile', 
    prome, 
    {
      responseType: 'blob',
      timeout: 60000
    }
   ).then(response => {
     if (!response.size) {
       this.$message({
         message: '没有可下载文件',
         type: 'warning'
       })
       return
     }
     const url = window.URL.createObjectURL(new Blob([response]))
     const link = window.document.createElement('a')
     link.style.display = 'none'
     link.href = url
     link.setAttribute('download', fileName+'.zip')
     document.body.appendChild(link)
     link.click()
   }).catch((data) => {
     console.log(data)
   })
},

package com.web.controller;

import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;

import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.File;
import java.io.FileInputStream;
import java.io.OutputStream;
import java.net.URLEncoder;
import java.util.Map;

@RestController
@RequestMapping("/api")
public class DownloadFileDemo {

    /**
     * 文件下载
     * @param tranNap
     * @param request
     * @param response
     */
    @RequestMapping(value = "/downloadFile")
    public void downloadFile(@RequestBody Map<String, Object> tranNap, HttpServletRequest request, HttpServletResponse response) {
        String fileLocation = tranNap.get("fileLocation")+"";
        try {
            String filePath = "D:/file/" + fileLocation + ".zip";
            //得到该文件
            File file = new File(filePath);
            if (!file.exists()) {
                System.out.println("[文件下载]没有可下载的文件");
                return;
            }
            FileInputStream fileInputStream = new FileInputStream(file);
            //设置Http响应头告诉浏览器下载文件名 Filename
            response.setHeader("Content-Disposition", "attachment;Filename=" + URLEncoder.encode(fileLocation+".zip", "UTF-8"));
            OutputStream outputStream = response.getOutputStream();
            byte[] bytes = new byte[2048];
            int len = 0;
            while ((len = fileInputStream.read(bytes)) > 0) {
                outputStream.write(bytes, 0, len);
            }
            fileInputStream.close();
            outputStream.close();
        } catch (Exception e) {
            System.out.println("[文件下载]下载文件异常");
            e.printStackTrace();
            return;
        }
    }

}