这篇博客介绍了如何在前端实现HTTP请求的自动重试功能。当遇到服务出错、网络问题或请求结果不符预期时，代码能够智能地进行重试。文中提供了一段可以直接在HTML文件中运行的示例代码。
需求情况比较简单： 需要在前端实现一个重试的功能，如果一个请求访问出错（不管是后端服务出错还是网络出错，亦或者是请求的结果不符合预期）均可进行自动重试
直接上代码，代码直接复制到xx.html文件即可运行
<!DOCTYPE html>
<html>
<script src="https://unpkg.com/axios/dist/axios.min.js"></script>
<script>
//最大重试次数
const MAX_RETRY = 3
//请求超时时间
const REQUEST_TIMEOUT = 15 * 1000
// 重试间隔500ms
const RETRY_INTERVAL = 500
function sleep(ms){
return new Promise((resolve)=>setTimeout(resolve,ms));
}
async function request(url,method,params,retry = MAX_RETRY,hookResult = null){
let res
let requireRetry
try {
//构造请求的参数
let config = {
url: url,
method: method,
timeout: REQUEST_TIMEOUT
}
if(Object.is(method,'get')){
config['params'] = params
}else if (Object.is(method,"post")){
config['data'] = params
}
res = await axios.request(config)
//发生服务器错误，重试
if (res &&am
最低0.47元/天 解锁文章
扫一扫
826
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
