下载文件方法优化

src/api/system/user.js

@@ -1,5 +1,6 @@
 import request from '@/utils/request'
-import { praseStrZero } from "@/utils/ruoyi";
+import { praseStrZero } from '@/utils/ruoyi'
+import { downFile } from '@/utils/request'
 
 // 查询用户列表
 export function listUser(query) {
@@ -45,12 +46,13 @@ export function delUser(userId) {
 }
 
 // 导出用户
-export function exportUser(query) {
-  return request({
-    url: '/system/User/export',
-    method: 'get',
-    params: query
-  })
+export async function exportUser(query) {
+  // return request({
+  //   url: '/system/User/export',
+  //   method: 'get',
+  //   params: query
+  // })
+  await downFile('/system/user/export', { ...query })
 }
 
 // 用户密码重置
@@ -123,6 +125,6 @@ export function importTemplate() {
   return request({
     url: '/system/user/importTemplate',
     method: 'get',
-    responseType: 'blob'//1.首先设置responseType对象格式为 blob:
+    responseType: 'blob' //1.首先设置responseType对象格式为 blob:
   })
 }

src/utils/request.js

@@ -2,7 +2,7 @@ import axios from 'axios'
 import { ElMessageBox, ElMessage, ElLoading } from 'element-plus'
 import { getToken } from '@/utils/auth'
 import useUserStore from '@/store/modules/user'
-import { tansParams, blobValidate } from '@/utils/ruoyi'
+import { blobValidate } from '@/utils/ruoyi'
 import { saveAs } from 'file-saver'
 
 let downloadLoadingInstance
@@ -45,7 +45,7 @@ service.interceptors.response.use(
     const { code, msg } = res.data
     // 二进制数据则直接返回
     if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
-      return res.data
+      return res
     }
     if (code == 401) {
       ElMessageBox.confirm('登录状态已过期，请重新登录', '系统提示', {
@@ -147,24 +147,34 @@ export function postForm(url, data, config) {
   })
 }
 
-// 通用下载方法
-export function downFile(url, params, filename, config) {
+/**
+ * 通用下载方法
+ * @param {*} url 请求地址
+ * @param {*} params 请求参数
+ * @param {*} config 配置
+ * @returns
+ */
+export async function downFile(url, params, config) {
   downloadLoadingInstance = ElLoading.service({ text: '正在下载数据，请稍候', background: 'rgba(0, 0, 0, 0.7)' })
-  return service
-    .get(
-      url,
-      { params: params },
-      {
+  try {
+    const resp = await service.get(url, {
+      params,
       headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
       responseType: 'blob',
       ...config
-      }
-    )
-    .then(async (response) => {
+    })
+    const { data } = resp
+
+    var patt = new RegExp('filename=([^;]+\\.[^\\.;]+);*')
+    var contentDisposition = decodeURI(resp.headers['content-disposition'])
+    var result = patt.exec(contentDisposition)
+    var fileName = result[1]
+    fileName = fileName.replace(/\"/g, '')
+
     const isLogin = await blobValidate(data)
     if (isLogin) {
       const blob = new Blob([data])
-        saveAs(blob, filename)
+      saveAs(blob, fileName)
     } else {
       const resText = await data.text()
       const rspObj = JSON.parse(resText)
@@ -175,15 +185,15 @@ export function downFile(url, params, filename, config) {
         type: 'error'
       })
     }
-    })
-    .catch((r) => {
+    downloadLoadingInstance.close()
+  } catch (r) {
     console.error(r)
     ElMessage({
       message: '下载文件出现错误，请联系管理员！',
       type: 'error'
     })
     downloadLoadingInstance.close()
-    })
+  }
 }
 
 export default service

src/views/system/user/index.vue

@@ -449,16 +449,8 @@ function handleExport() {
       cancelButtonText: '取消',
       type: 'warning'
     })
-    .then(() => {
-      exportUser(queryParams.value).then((response) => {
-        const { code, data } = response
-        if (code == 200) {
-          proxy.$modal.msgSuccess('导出成功')
-          proxy.download(data.path)
-        } else {
-          proxy.$modal.msgError('导出失败')
-        }
-      })
+    .then(async () => {
+      await exportUser(queryParams.value)
     })
 }
 /** 用户状态修改  */