유 니 앱 무 통 리 셋 token 방법
대략 절 차 는 다음 과 같다.
1.사용자 가 로그 인 한 후 백 엔 드 는 accessToken 과 refreshToken 으로 Storage 에 저 장 된 두 개의 token 을 되 돌려 줍 니 다.
평소에 데 이 터 를 요청 할 때 요청 헤드 는 accessToken 을 사용 하여 인 터 페 이 스 를 보 냅 니 다.
2.401 token 이 만 료 된 후에 우 리 는 인 터 페 이 스 를 통 해 백 엔 드 에 새로운 token 을 가 져 옵 니 다.인 자 를 refreshToken 으로 요청 합 니 다.
3.우 리 는 새로운 accessToken 과 refreshToken 을 받 은 후에 이전의 Storage 에 저 장 된 token 을 교체 합 니 다.
4.또한 401 의 어느 인 터 페 이 스 를 보고 하고 새로운 accessToken 을 사용 하여 다시 한 번 요청 하고 데 이 터 를 받 아 무 통 리 셋 token 을 실현 해 야 합 니까?
5.백 엔 드 에서 돌아 오 는 새로운 token 도 사용 할 수 없 으 면 다시 로그 인 해 야 한 다 는 뜻 입 니 다.로그 인 페이지 로 이동 합 니 다.(이 단 계 는 유연 하 게 사용 할 수 있 습 니 다.저 는 개인 적 으로 플러그 인 에 의 해 사용 되 는 경로 입 니 다.https://ext.dcloud.net.cn/plugin?id=578)
유 니 앱 플러그 인 에 맞 춰 사용 및 구현:
유 니 앱 플러그 인 시장 에 패 키 징 된 request 네트워크 요청 을 다운로드 하고 문서 에 따라 프로젝트 에 설정 합 니 다.
주소:https://ext.dcloud.net.cn/plugin?id=159
설정 후 vmeitime-http 폴 더 의 index.js 파일 을 수정 합 니 다.
vmeitime-http 폴 더 의 interface.js 파일 을 수정 하여 401 상 태 를 누설 합 니 다.
만약 에 여 기 를 보고 도 잘 보이 지 않 는 다 면 제 소스 코드 를 보 세 요.제 가 두 개의 플러그 인 을 사 용 했 습 니 다.관중 들 은 상황 을 고려 하여 이해 하고 잘 소화 하 며 자신의 프로젝트 에 맞 춰 생각 하 는 것 을 주의 하 세 요.
import http from './interface'
import config from './config'
// request.js
import Vue from 'vue'
import Router from '@/router'
//...
export const execute = (name, data = {}) => {
//
http.interceptor.request = (config) => {
let token = uni.getStorageSync('accessToken')
delete config.header['x-access-token']
if (token) {
config.header['x-access-token'] = token
}
}
//
http.interceptor.response = async (response) => {
const statusCode = response.statusCode;
if (statusCode === 401) {
response = await doRequest(response)
}
if (statusCode === 402) {
uni.removeStorageSync('accessToken');
uni.removeStorageSync('refreshToken');
uni.removeStorageSync('realname');
let jump = uni.getStorageSync('jump')
if (!jump) {
setTimeout(() => {
uni.showModal({
title: ' ',
content: ' !',
showCancel: false,
success: function(res) {
if (res.confirm) {
Router.push({
name: 'login',
params: {
'RouterName': 'home'
}
})
}
},
})
});
uni.setStorageSync('jump', 'true')
}
}
if (statusCode == 403) {
let jump = uni.getStorageSync('jump')
if (!jump) {
setTimeout(() => {
Router.replace({
name: 'login',
params: {
'RouterName': 'home'
}
})
},500)
uni.setStorageSync('jump', 'true')
}
}
//
const code = response.data.code;
const message = response.data.message;
if (response.statusCode == 200 && code !== 0 && code != -1 && code) {
uni.showToast({
title: message,
icon: "none",
duration: 2000
});
}
return response;
}
return http.request({
name: name,
baseUrl: config.base,
url: config.interface[name].path,
method: config.interface[name].method ? config.interface[name].method : 'GET',
dataType: 'json',
data,
})
}
export default {
execute
}
// token
async function doRequest(response) {
const res = await execute('refresh', {refreshToken: uni.getStorageSync('refreshToken')})
const {
code,
data
} = res.data
if (code == 0) {
uni.setStorageSync('accessToken', data.accessToken)
uni.setStorageSync('refreshToken', data.refreshToken)
let config = response.config
config.header['x-access-token'] = data.accessToken
const resold = await execute(config.name,{ ...config.data
})
return resold
} else {
uni.removeStorageSync('accessToken');
uni.removeStorageSync('refreshToken');
uni.showToast({
title: ' !',
icon: "none",
success() {
Router.push({
name: 'login',
params: {
'RouterName': 'home'
}
})
}
});
}
}
이상 은 유 니 앱 무 통 리 셋 token 방법 에 대한 상세 한 내용 입 니 다.유 니 앱 무 통 리 셋 token 방법 에 대한 자 료 는 다른 관련 글 을 주목 하 세 요!
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
유니앱 슬라이딩 옵션 실현본고의 실례는 여러분에게 유니앱이 슬라이딩 옵션 카드를 실현하는 구체적인 코드를 공유하여 참고하도록 하였으며, 구체적인 내용은 다음과 같다. tabControl-tag.vue 페이지 참조 1. 사용법: scrollF...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.