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