Commit e83cb06bb93544369c8934d1065bf46835e3f003
1 parent
4500214b
feat: projectSetting add closeMessageOnSwitch and removeAllHttpPending
Showing
8 changed files
with
30 additions
and
23 deletions
build/script/preview.ts
@@ -16,9 +16,6 @@ const startApp = () => { | @@ -16,9 +16,6 @@ const startApp = () => { | ||
16 | const port = 9680; | 16 | const port = 9680; |
17 | portfinder.basePort = port; | 17 | portfinder.basePort = port; |
18 | const app = new Koa(); | 18 | const app = new Koa(); |
19 | - // const connect = require('connect'); | ||
20 | - // const serveStatic = require('serve-static'); | ||
21 | - // const app = connect(); | ||
22 | 19 | ||
23 | app.use(staticServer(resolve(process.cwd(), viteConfig.outDir || 'dist'))); | 20 | app.use(staticServer(resolve(process.cwd(), viteConfig.outDir || 'dist'))); |
24 | 21 |
src/router/guard/index.ts
@@ -11,22 +11,27 @@ import { getIsOpenTab } from '/@/utils/helper/routeHelper'; | @@ -11,22 +11,27 @@ import { getIsOpenTab } from '/@/utils/helper/routeHelper'; | ||
11 | 11 | ||
12 | const { projectSetting } = useSetting(); | 12 | const { projectSetting } = useSetting(); |
13 | export function createGuard(router: Router) { | 13 | export function createGuard(router: Router) { |
14 | - const axiosCanceler = new AxiosCanceler(); | ||
15 | - | 14 | + const { openNProgress, closeMessageOnSwitch, removeAllHttpPending } = projectSetting; |
15 | + let axiosCanceler: AxiosCanceler | null; | ||
16 | + if (removeAllHttpPending) { | ||
17 | + axiosCanceler = new AxiosCanceler(); | ||
18 | + } | ||
16 | router.beforeEach(async (to) => { | 19 | router.beforeEach(async (to) => { |
17 | const isOpen = getIsOpenTab(to.path); | 20 | const isOpen = getIsOpenTab(to.path); |
18 | to.meta.inTab = isOpen; | 21 | to.meta.inTab = isOpen; |
19 | try { | 22 | try { |
20 | - Modal.destroyAll(); | ||
21 | - notification.destroy(); | 23 | + if (closeMessageOnSwitch) { |
24 | + Modal.destroyAll(); | ||
25 | + notification.destroy(); | ||
26 | + } | ||
22 | // TODO Some special interfaces require long connections | 27 | // TODO Some special interfaces require long connections |
23 | // Switching the route will delete the previous request | 28 | // Switching the route will delete the previous request |
24 | - axiosCanceler.removeAllPending(); | 29 | + removeAllHttpPending && axiosCanceler!.removeAllPending(); |
25 | } catch (error) { | 30 | } catch (error) { |
26 | console.warn('basic guard error:' + error); | 31 | console.warn('basic guard error:' + error); |
27 | } | 32 | } |
28 | }); | 33 | }); |
29 | - projectSetting.openNProgress && createProgressGuard(router); | 34 | + openNProgress && createProgressGuard(router); |
30 | createPermissionGuard(router); | 35 | createPermissionGuard(router); |
31 | createPageTitleGuard(router); | 36 | createPageTitleGuard(router); |
32 | createPageLoadingGuard(router); | 37 | createPageLoadingGuard(router); |
src/settings/projectSetting.ts
@@ -116,6 +116,13 @@ const setting: ProjectConfig = { | @@ -116,6 +116,13 @@ const setting: ProjectConfig = { | ||
116 | 116 | ||
117 | // 是否可以嵌入iframe页面 | 117 | // 是否可以嵌入iframe页面 |
118 | canEmbedIFramePage: true, | 118 | canEmbedIFramePage: true, |
119 | + | ||
120 | + // 切换界面的时候是否删除未关闭的message及notify | ||
121 | + closeMessageOnSwitch: true, | ||
122 | + | ||
123 | + // 切换界面的时候是否取消已经发送但是未响应的http请求。 | ||
124 | + // 如果开启,想对单独接口覆盖。可以在单独接口设置 | ||
125 | + removeAllHttpPending: true, | ||
119 | }; | 126 | }; |
120 | 127 | ||
121 | export default setting; | 128 | export default setting; |
src/types/config.d.ts
@@ -102,6 +102,10 @@ export interface ProjectConfig { | @@ -102,6 +102,10 @@ export interface ProjectConfig { | ||
102 | openNProgress: boolean; | 102 | openNProgress: boolean; |
103 | // 是否可以嵌入iframe页面 | 103 | // 是否可以嵌入iframe页面 |
104 | canEmbedIFramePage: boolean; | 104 | canEmbedIFramePage: boolean; |
105 | + // 切换界面的时候是否删除未关闭的message及notify | ||
106 | + closeMessageOnSwitch: boolean; | ||
107 | + // 切换界面的时候是否取消已经发送但是未响应的http请求。 | ||
108 | + removeAllHttpPending: boolean; | ||
105 | } | 109 | } |
106 | 110 | ||
107 | export interface GlobConfig { | 111 | export interface GlobConfig { |
src/utils/http/axios/Axios.ts
@@ -5,8 +5,9 @@ import { AxiosCanceler } from './axiosCancel'; | @@ -5,8 +5,9 @@ import { AxiosCanceler } from './axiosCancel'; | ||
5 | import { isFunction } from '/@/utils/is'; | 5 | import { isFunction } from '/@/utils/is'; |
6 | import { cloneDeep } from 'lodash-es'; | 6 | import { cloneDeep } from 'lodash-es'; |
7 | 7 | ||
8 | -import { RequestOptions, CreateAxiosOptions, Result } from './types'; | 8 | +import type { RequestOptions, CreateAxiosOptions, Result } from './types'; |
9 | import { ContentTypeEnum } from '/@/enums/httpEnum'; | 9 | import { ContentTypeEnum } from '/@/enums/httpEnum'; |
10 | +import { errorResult } from './const'; | ||
10 | 11 | ||
11 | export * from './axiosTransform'; | 12 | export * from './axiosTransform'; |
12 | 13 | ||
@@ -147,7 +148,7 @@ export class VAxios { | @@ -147,7 +148,7 @@ export class VAxios { | ||
147 | .then((res: AxiosResponse<Result>) => { | 148 | .then((res: AxiosResponse<Result>) => { |
148 | if (transformRequestData && isFunction(transformRequestData)) { | 149 | if (transformRequestData && isFunction(transformRequestData)) { |
149 | const ret = transformRequestData(res, opt); | 150 | const ret = transformRequestData(res, opt); |
150 | - ret !== undefined ? resolve(ret) : reject(new Error('request error!')); | 151 | + ret !== errorResult ? resolve(ret) : reject(new Error('request error!')); |
151 | return; | 152 | return; |
152 | } | 153 | } |
153 | resolve((res as unknown) as Promise<T>); | 154 | resolve((res as unknown) as Promise<T>); |
src/utils/http/axios/checkStatus.ts
1 | import { useMessage } from '/@/hooks/web/useMessage'; | 1 | import { useMessage } from '/@/hooks/web/useMessage'; |
2 | +import { userStore } from '/@/store/modules/user'; | ||
2 | const { createMessage } = useMessage(); | 3 | const { createMessage } = useMessage(); |
3 | 4 | ||
4 | const error = createMessage.error!; | 5 | const error = createMessage.error!; |
@@ -12,9 +13,7 @@ export function checkStatus(status: number, msg: string): void { | @@ -12,9 +13,7 @@ export function checkStatus(status: number, msg: string): void { | ||
12 | // 在登录成功后返回当前页面,这一步需要在登录页操作。 | 13 | // 在登录成功后返回当前页面,这一步需要在登录页操作。 |
13 | case 401: | 14 | case 401: |
14 | error('用户没有权限(令牌、用户名、密码错误)!'); | 15 | error('用户没有权限(令牌、用户名、密码错误)!'); |
15 | - // store.dispatch('user/loginOut', { | ||
16 | - // goLogin: true, | ||
17 | - // }); | 16 | + userStore.loginOut(true); |
18 | break; | 17 | break; |
19 | case 403: | 18 | case 403: |
20 | error('用户得到授权,但是访问是被禁止的。!'); | 19 | error('用户得到授权,但是访问是被禁止的。!'); |
src/utils/http/axios/const.ts
0 → 100644
1 | +export const errorResult = '__ERROR_RESULT__'; |
src/utils/http/axios/index.ts
@@ -20,6 +20,7 @@ import { formatRequestDate } from '/@/utils/dateUtil'; | @@ -20,6 +20,7 @@ import { formatRequestDate } from '/@/utils/dateUtil'; | ||
20 | import { setObjToUrlParams, deepMerge } from '/@/utils'; | 20 | import { setObjToUrlParams, deepMerge } from '/@/utils'; |
21 | import { errorStore, ErrorTypeEnum, ErrorInfo } from '/@/store/modules/error'; | 21 | import { errorStore, ErrorTypeEnum, ErrorInfo } from '/@/store/modules/error'; |
22 | import { appStore } from '/@/store/modules/app'; | 22 | import { appStore } from '/@/store/modules/app'; |
23 | +import { errorResult } from './const'; | ||
23 | 24 | ||
24 | const { globSetting } = useSetting(); | 25 | const { globSetting } = useSetting(); |
25 | const prefix = globSetting.urlPrefix; | 26 | const prefix = globSetting.urlPrefix; |
@@ -62,7 +63,6 @@ const transform: AxiosTransform = { | @@ -62,7 +63,6 @@ const transform: AxiosTransform = { | ||
62 | return res.data; | 63 | return res.data; |
63 | } | 64 | } |
64 | // 错误的时候返回 | 65 | // 错误的时候返回 |
65 | - const errorResult = undefined; | ||
66 | 66 | ||
67 | const { data } = res; | 67 | const { data } = res; |
68 | if (!data) { | 68 | if (!data) { |
@@ -89,7 +89,7 @@ const transform: AxiosTransform = { | @@ -89,7 +89,7 @@ const transform: AxiosTransform = { | ||
89 | 89 | ||
90 | // 接口请求成功,直接返回结果 | 90 | // 接口请求成功,直接返回结果 |
91 | if (code === ResultEnum.SUCCESS) { | 91 | if (code === ResultEnum.SUCCESS) { |
92 | - return result || true; | 92 | + return result; |
93 | } | 93 | } |
94 | // 接口请求错误,统一提示错误信息 | 94 | // 接口请求错误,统一提示错误信息 |
95 | if (code === ResultEnum.ERROR) { | 95 | if (code === ResultEnum.ERROR) { |
@@ -234,13 +234,6 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) { | @@ -234,13 +234,6 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) { | ||
234 | } | 234 | } |
235 | export const defHttp = createAxios(); | 235 | export const defHttp = createAxios(); |
236 | 236 | ||
237 | -// var mock = new MockAdapter(axios); | ||
238 | -// mock.onGet('/api/aaa').reply(200, { | ||
239 | -// users: [{ id: 1, name: 'John Smith' }], | ||
240 | -// }); | ||
241 | - | ||
242 | -// default | ||
243 | - | ||
244 | // other api url | 237 | // other api url |
245 | // export const otherHttp = createAxios({ | 238 | // export const otherHttp = createAxios({ |
246 | // requestOptions: { | 239 | // requestOptions: { |