uni-app:实现request请求的递归(设置request请求的访问次数),并且调用自定义方法给出返回值

一、效果展示

失败效果

成功效果

二、写入后端请求部分

分析

①自定义一个模块common.js主要用于封装所有的请求函数
②核心代码
javascript 复制代码
function requestWithRetry(cmd, username, password, retryCount) {
	return new Promise((resolve, reject) => {
		uni.request({
			url: ip + 'sys/user/login',
			data: {
				cmd: cmd,
				usrname: username,
				passwd: password
			},
			method: 'POST',
			dataType: 'json',
			header: {
				"content-type": "application/json"
			},
			success: res => {
				// 存入全局变量中
				getApp().globalData.username = username;
				getApp().globalData.password = password;
				getApp().globalData.access_token = res.data.access_token;
				getApp().globalData.loginmode = loginmode;
				console.log(`第 ${retryCount} 次请求成功:`, res.data);
				resolve(res.data);
			},
			fail(err) {
				console.error(`第 ${retryCount} 次请求失败,剩余重试次数 ${retryCount - 1}:`, err)
				if (retryCount <= 1) {
					// 重试次数已经用完,将错误信息返回给调用者
					reject(new Error('请求失败'))
				} else {
					// 还有重试次数,继续重试
					setTimeout(() => {
						requestWithRetry(cmd, username, password,
							retryCount - 1).then(resolve).catch(reject)
					}, 500)
				}
			}
		});
	});
}
// 调用方法,retryCount 为重试次数
return requestWithRetry(cmd, username, password, 3)
	.then(data => {
		// console.log('请求成功', data);
		return data;
	})
	.catch(error => {
		// console.log('请求失败', error);
		throw error;
	});

完整代码

javascript 复制代码
//定义全局变量
const ip = 'XXXX';
//定义全局函数
//生成随机三位数 
function generateRandomNumber() {
	var min = 100;
	var max = 999;
	var randomNumber = Math.floor(Math.random() * (max - min + 1) + min);
	return randomNumber;
}
//http方式进行登录
function login_httpmode(username, password, cmd, loginmode) {
    //http
    if (loginmode == 'http') {
        function requestWithRetry(cmd, username, password, retryCount) {
            return new Promise((resolve, reject) => {
                uni.request({
                    url: ip + 'sys/user/login',
                    data: {
                        cmd: cmd,
                        usrname: username,
                        passwd: password
                    },
                    method: 'POST',
                    dataType: 'json',
                    header: {
                        "content-type": "application/json"
                    },
                    success: res => {
                        // 存入全局变量中
                        getApp().globalData.username = username;
                        getApp().globalData.password = password;
                        getApp().globalData.access_token = res.data.access_token;
                        getApp().globalData.loginmode = loginmode;
                        console.log(`第 ${retryCount} 次请求成功:`, res.data);
                        resolve(res.data);
                    },
                    fail(err) {
                        console.error(`第 ${retryCount} 次请求失败,剩余重试次数 ${retryCount - 1}:`, err)
                        if (retryCount <= 1) {
                            // 重试次数已经用完,将错误信息返回给调用者
                            reject(new Error('请求失败'))
                        } else {
                            // 还有重试次数,继续重试
                            setTimeout(() => {
                                requestWithRetry(cmd, username, password,
                                    retryCount - 1).then(resolve).catch(reject)
                            }, 500)
                        }
                    }
                });
            });
        }
        // 调用方法,retryCount 为重试次数,设置最大次数为三次
        return requestWithRetry(cmd, username, password, 3)
            .then(data => {
                // console.log('请求成功', data);
                return data;
            })
            .catch(error => {
                // console.log('请求失败', error);
                throw error;
            });
    }
}
//导出
module.exports = {
	ip,
	generateRandomNumber,
	login_httpmode,
}

三、进行方法的调用

核心代码

javascript 复制代码
common.login_httpmode(username, password, cmd, type)
	.then(info => {
		console.log("请求成功",info)		
	})
	.catch(error => {
		console.log("请求失败",error)		
	});

完整代码

javascript 复制代码
//执行加载中的效果
uni.showLoading({
	title: '正在登录...',
	mask: true,
});
//调用登录方法
common.login_httpmode(username, password, cmd, type)
     //成功返回
	.then(info => {
		console.log("请求成功",info)
		if (info.success == true) {	
            uni.hideLoading(); // 隐藏加载提示
			//全局变量中的数据 
			uni.reLaunch({ //跳转到主页
				url: '/pages/mine/mine_index/mine_index'
			})
		} else {
			uni.hideLoading(); // 隐藏加载提示
			if (info.msg == 'pass err') {
				uni.showToast({
					title: '账号密码不正确',
					icon: 'none'
				})
			}
		}
	})
	.catch(error => {
		console.log("请求失败",error)
		uni.showToast({
			title: '登录失败',
			icon: 'none'
		})
	});
相关推荐
2501_916007475 小时前
提升 iOS 26 系统流畅度的实战指南,多工具组合监控
android·macos·ios·小程序·uni-app·cocoa·iphone
砺能8 小时前
uniapp生成的app添加操作日志
前端·uni-app
2501_9159214311 小时前
iOS 应用代上架流程,多工具组合与使用 开心上架 跨平台自动化上传指南
android·ios·小程序·uni-app·自动化·cocoa·iphone
知识分享小能手11 小时前
uni-app 入门学习教程,从入门到精通,uni-app组件 —— 知识点详解与实战案例(4)
前端·javascript·学习·微信小程序·小程序·前端框架·uni-app
雪芽蓝域zzs11 小时前
uniapp 修改android包名
android·uni-app
芒果沙冰哟11 小时前
uniapp canvas实现手写签字功能(包括重签,撤回等按钮)
uni-app
爱折腾的小码农11 小时前
uni-app 小程序开发避坑:诡异的 `module ‘...‘ is not defined` 错误与我的解决方案
uni-app
Q_Q196328847512 小时前
python+uniapp基于微信小程序的助眠小程序
spring boot·python·小程序·django·flask·uni-app·node.js
不知名的前端专家13 小时前
UniApp USB存储设备U盘操作、读写原生插件
uni-app
coldriversnow14 小时前
uni-app从后端返回的富文本中的视频截取一帧为封面
uni-app