Skip to content
体验新版
项目
组织
正在加载...
登录
切换导航
打开侧边栏
ChenSun1
vue-vben-admin
提交
136cbb1e
V
vue-vben-admin
项目概览
ChenSun1
/
vue-vben-admin
与 Fork 源项目一致
从无法访问的项目Fork
通知
1
Star
0
Fork
0
代码
文件
提交
分支
Tags
贡献者
分支图
Diff
Issue
0
列表
看板
标记
里程碑
合并请求
0
DevOps
流水线
流水线任务
计划
Wiki
0
Wiki
分析
仓库
DevOps
项目成员
Pages
V
vue-vben-admin
项目概览
项目概览
详情
发布
仓库
仓库
文件
提交
分支
标签
贡献者
分支图
比较
Issue
0
Issue
0
列表
看板
标记
里程碑
合并请求
0
合并请求
0
Pages
DevOps
DevOps
流水线
流水线任务
计划
分析
分析
仓库分析
DevOps
Wiki
0
Wiki
成员
成员
收起侧边栏
关闭侧边栏
动态
分支图
创建新Issue
流水线任务
提交
Issue看板
前往新版Gitcode,体验更适合开发者的 AI 搜索 >>
未验证
提交
136cbb1e
编写于
3月 19, 2022
作者:
C
Captain
提交者:
GitHub
3月 19, 2022
浏览文件
操作
浏览文件
下载
电子邮件补丁
差异文件
feat: add request retry (#1553)
上级
78535bdd
变更
11
隐藏空白更改
内联
并排
Showing
11 changed file
with
111 addition
and
3 deletion
+111
-3
mock/sys/user.ts
mock/sys/user.ts
+8
-0
src/api/sys/user.ts
src/api/sys/user.ts
+14
-0
src/locales/lang/en/routes/demo.ts
src/locales/lang/en/routes/demo.ts
+1
-0
src/locales/lang/zh-CN/routes/demo.ts
src/locales/lang/zh-CN/routes/demo.ts
+1
-0
src/router/routes/modules/demo/feat.ts
src/router/routes/modules/demo/feat.ts
+9
-0
src/utils/http/axios/Axios.ts
src/utils/http/axios/Axios.ts
+4
-1
src/utils/http/axios/axiosRetry.ts
src/utils/http/axios/axiosRetry.ts
+28
-0
src/utils/http/axios/axiosTransform.ts
src/utils/http/axios/axiosTransform.ts
+1
-1
src/utils/http/axios/index.ts
src/utils/http/axios/index.ts
+15
-1
src/views/demo/feat/request-demo/index.vue
src/views/demo/feat/request-demo/index.vue
+23
-0
types/axios.d.ts
types/axios.d.ts
+7
-0
未找到文件。
mock/sys/user.ts
浏览文件 @
136cbb1e
...
...
@@ -111,4 +111,12 @@ export default [
return
resultSuccess
(
undefined
,
{
message
:
'
Token has been destroyed
'
});
},
},
{
url
:
'
/basic-api/testRetry
'
,
statusCode
:
405
,
method
:
'
get
'
,
response
:
()
=>
{
return
resultError
(
'
Error!
'
);
},
},
]
as
MockMethod
[];
src/api/sys/user.ts
浏览文件 @
136cbb1e
...
...
@@ -8,6 +8,7 @@ enum Api {
Logout
=
'
/logout
'
,
GetUserInfo
=
'
/getUserInfo
'
,
GetPermCode
=
'
/getPermCode
'
,
TestRetry
=
'
/testRetry
'
,
}
/**
...
...
@@ -39,3 +40,16 @@ export function getPermCode() {
export
function
doLogout
()
{
return
defHttp
.
get
({
url
:
Api
.
Logout
});
}
export
function
testRetry
()
{
return
defHttp
.
get
(
{
url
:
Api
.
TestRetry
},
{
retryRequest
:
{
isOpenRetry
:
true
,
count
:
5
,
waitTime
:
1000
,
},
},
);
}
src/locales/lang/en/routes/demo.ts
浏览文件 @
136cbb1e
...
...
@@ -92,6 +92,7 @@ export default {
breadcrumb
:
'
Breadcrumbs
'
,
breadcrumbFlat
:
'
Flat Mode
'
,
breadcrumbFlatDetail
:
'
Flat mode details
'
,
requestDemo
:
'
Retry request demo
'
,
breadcrumbChildren
:
'
Level mode
'
,
breadcrumbChildrenDetail
:
'
Level mode detail
'
,
...
...
src/locales/lang/zh-CN/routes/demo.ts
浏览文件 @
136cbb1e
...
...
@@ -88,6 +88,7 @@ export default {
ws
:
'
websocket测试
'
,
breadcrumb
:
'
面包屑导航
'
,
breadcrumbFlat
:
'
平级模式
'
,
requestDemo
:
'
测试请求重试
'
,
breadcrumbFlatDetail
:
'
平级详情
'
,
breadcrumbChildren
:
'
层级模式
'
,
breadcrumbChildrenDetail
:
'
层级详情
'
,
...
...
src/router/routes/modules/demo/feat.ts
浏览文件 @
136cbb1e
...
...
@@ -31,6 +31,15 @@ const feat: AppRouteModule = {
title
:
t
(
'
routes.demo.feat.ws
'
),
},
},
{
path
:
'
request
'
,
name
:
'
RequestDemo
'
,
// @ts-ignore
component
:
()
=>
import
(
'
/@/views/demo/feat/request-demo/index.vue
'
),
meta
:
{
title
:
t
(
'
routes.demo.feat.requestDemo
'
),
},
},
{
path
:
'
session-timeout
'
,
name
:
'
SessionTimeout
'
,
...
...
src/utils/http/axios/Axios.ts
浏览文件 @
136cbb1e
...
...
@@ -111,7 +111,10 @@ export class VAxios {
// Response result interceptor error capture
responseInterceptorsCatch
&&
isFunction
(
responseInterceptorsCatch
)
&&
this
.
axiosInstance
.
interceptors
.
response
.
use
(
undefined
,
responseInterceptorsCatch
);
this
.
axiosInstance
.
interceptors
.
response
.
use
(
undefined
,
(
error
)
=>
{
// @ts-ignore
responseInterceptorsCatch
(
this
.
axiosInstance
,
error
);
});
}
/**
...
...
src/utils/http/axios/axiosRetry.ts
0 → 100644
浏览文件 @
136cbb1e
import
{
AxiosError
,
AxiosInstance
}
from
'
axios
'
;
/**
* 请求重试机制
*/
export
class
AxiosRetry
{
/**
* 重试
*/
retry
(
AxiosInstance
:
AxiosInstance
,
error
:
AxiosError
)
{
// @ts-ignore
const
{
config
}
=
error
.
response
;
const
{
waitTime
,
count
}
=
config
?.
requestOptions
?.
retryRequest
;
config
.
__retryCount
=
config
.
__retryCount
||
0
;
if
(
config
.
__retryCount
>=
count
)
{
return
Promise
.
reject
(
error
);
}
config
.
__retryCount
+=
1
;
return
this
.
delay
(
waitTime
).
then
(()
=>
AxiosInstance
(
config
));
}
/**
* 延迟
*/
private
delay
(
waitTime
:
number
)
{
return
new
Promise
((
resolve
)
=>
setTimeout
(
resolve
,
waitTime
));
}
}
src/utils/http/axios/axiosTransform.ts
浏览文件 @
136cbb1e
...
...
@@ -48,5 +48,5 @@ export abstract class AxiosTransform {
/**
* @description: 请求之后的拦截器错误处理
*/
responseInterceptorsCatch
?:
(
error
:
Error
)
=>
void
;
responseInterceptorsCatch
?:
(
axiosInstance
:
AxiosResponse
,
error
:
Error
)
=>
void
;
}
src/utils/http/axios/index.ts
浏览文件 @
136cbb1e
...
...
@@ -17,6 +17,7 @@ import { useErrorLogStoreWithOut } from '/@/store/modules/errorLog';
import
{
useI18n
}
from
'
/@/hooks/web/useI18n
'
;
import
{
joinTimestamp
,
formatRequestDate
}
from
'
./helper
'
;
import
{
useUserStoreWithOut
}
from
'
/@/store/modules/user
'
;
import
{
AxiosRetry
}
from
'
/@/utils/http/axios/axiosRetry
'
;
const
globSetting
=
useGlobSetting
();
const
urlPrefix
=
globSetting
.
urlPrefix
;
...
...
@@ -158,7 +159,7 @@ const transform: AxiosTransform = {
/**
* @description: 响应错误处理
*/
responseInterceptorsCatch
:
(
error
:
any
)
=>
{
responseInterceptorsCatch
:
(
axiosInstance
:
AxiosResponse
,
error
:
any
)
=>
{
const
{
t
}
=
useI18n
();
const
errorLogStore
=
useErrorLogStoreWithOut
();
errorLogStore
.
addAjaxErrorInfo
(
error
);
...
...
@@ -189,6 +190,14 @@ const transform: AxiosTransform = {
}
checkStatus
(
error
?.
response
?.
status
,
msg
,
errorMessageMode
);
// 添加自动重试机制 保险起见 只针对GET请求
const
retryRequest
=
new
AxiosRetry
();
const
{
isOpenRetry
}
=
config
.
requestOptions
.
retryRequest
;
config
.
method
?.
toUpperCase
()
===
RequestEnum
.
GET
&&
isOpenRetry
&&
// @ts-ignore
retryRequest
.
retry
(
axiosInstance
,
error
);
return
Promise
.
reject
(
error
);
},
};
...
...
@@ -234,6 +243,11 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
ignoreCancelToken
:
true
,
// 是否携带token
withToken
:
true
,
retryRequest
:
{
isOpenRetry
:
true
,
count
:
5
,
waitTime
:
100
,
},
},
},
opt
||
{},
...
...
src/views/demo/feat/request-demo/index.vue
0 → 100644
浏览文件 @
136cbb1e
<
template
>
<div
class=
"request-box"
>
<a-button
@
click=
"handleClick"
color=
"primary"
>
点击会重新发起请求5次
</a-button>
<p>
打开浏览器的network面板,可以看到发出了六次请求
</p>
</div>
</
template
>
<
script
lang=
"ts"
setup
>
import
{
testRetry
}
from
'
/@/api/sys/user
'
;
// @ts-ignore
const
handleClick
=
async
()
=>
{
await
testRetry
();
};
</
script
>
<
style
lang=
"less"
>
.request-box {
margin: 50px;
}
p {
margin-top: 10px;
}
</
style
>
types/axios.d.ts
浏览文件 @
136cbb1e
...
...
@@ -23,8 +23,15 @@ export interface RequestOptions {
ignoreCancelToken
?:
boolean
;
// Whether to send token in header
withToken
?:
boolean
;
// 请求重试机制
retryRequest
?:
RetryRequest
;
}
export
interface
RetryRequest
{
isOpenRetry
:
boolean
;
count
:
number
;
waitTime
:
number
;
}
export
interface
Result
<
T
=
any
>
{
code
:
number
;
type
:
'
success
'
|
'
error
'
|
'
warning
'
;
...
...
编辑
预览
Markdown
is supported
0%
请重试
或
添加新附件
.
添加附件
取消
You are about to add
0
people
to the discussion. Proceed with caution.
先完成此消息的编辑!
取消
想要评论请
注册
或
登录