uniapp响应拦截token过期之后重新获取之后重新发送请求
时间: 2024-11-03 08:14:48 浏览: 56
请求时token过期自动刷新token操作
UniApp是一个基于Vue.js的跨平台框架,用于快速构建兼容iOS、Android、Web等多端的应用。当你使用UniApp进行开发时,遇到token过期的情况,通常需要处理网络请求的拦截来确保用户授权的连续性。
当HTTP请求头中的Token过期(比如JWT),你可以使用uni-app内置的`http.request.interceptors.response.use`方法添加一个全局的响应拦截器。这里有一个简单的步骤:
1. 首先,在项目的`uni.config.js`或自定义的拦截器配置文件中,注册响应拦截器:
```javascript
uni.request.interceptors.response.use(
(response) => {
// 如果Token过期,检查响应状态码或头部信息
if (response.data && response.data.status === '401' || !response.data || !response.data.token) {
// Token已过期,尝试刷新并重新发送请求
const newToken = await refreshToken(); // 这里假设你有个refreshToken函数用于刷新token
setStorage('token', newToken); // 将新token保存到本地存储
// 使用新的token重发原请求
return uni.request(response.config);
}
return response;
},
(error) => {
console.error(error);
return Promise.reject(error);
}
);
```
2. `refreshToken()`函数应替换为你应用的实际逻辑,例如发送POST请求到服务器以获取新的Token。确保在服务端验证旧Token的有效性,并返回新的Token。
3. `setStorage`和`getStorage`是模拟的,实际开发中应使用 UniApp 的`uni.setStorageSync`和`uni.getStorageSync`进行数据持久化。
当Token过期时,这个拦截器会捕获到请求失败,然后更新Token并重新发起请求,保证用户体验的流畅性。同时,你也可以设置超时重试机制,以防止连续的无效请求。
阅读全文