下载文件方法优化

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) {
+export async function exportUser(query) {
-  return request({
+  // return request({
-    url: '/system/User/export',
+  //   url: '/system/User/export',
-    method: 'get',
+  //   method: 'get',
-    params: query
+  //   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,43 +147,53 @@ 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
+  try {
-    .get(
+    const resp = await service.get(url, {
-      url,
+      params,
-      { params: params },
+      headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-      {
+      responseType: 'blob',
-        headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+      ...config
-        responseType: 'blob',
-        ...config
-      }
-    )
-    .then(async (response) => {
-      const isLogin = await blobValidate(data)
-      if (isLogin) {
-        const blob = new Blob([data])
-        saveAs(blob, filename)
-      } else {
-        const resText = await data.text()
-        const rspObj = JSON.parse(resText)
-        const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
-
-        ElMessage({
-          message: errMsg,
-          type: 'error'
-        })
-      }
     })
-    .catch((r) => {
+    const { data } = resp
-      console.error(r)
+
+    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)
+    } else {
+      const resText = await data.text()
+      const rspObj = JSON.parse(resText)
+      const errMsg = errorCode[rspObj.code] || rspObj.msg || errorCode['default']
+
       ElMessage({
-        message: '下载文件出现错误，请联系管理员！',
+        message: errMsg,
         type: 'error'
       })
-      downloadLoadingInstance.close()
+    }
+    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(() => {
+    .then(async () => {
-      exportUser(queryParams.value).then((response) => {
+      await exportUser(queryParams.value)
-        const { code, data } = response
-        if (code == 200) {
-          proxy.$modal.msgSuccess('导出成功')
-          proxy.download(data.path)
-        } else {
-          proxy.$modal.msgError('导出失败')
-        }
-      })
     })
 }
 /** 用户状态修改  */