fix: fix token refreshing logic issue

This commit is contained in:
twwu 2024-10-14 11:16:18 +08:00
parent 857055b797
commit f26994c5f6
4 changed files with 20 additions and 23 deletions

View File

@ -14,12 +14,12 @@ const SwrInitor = ({
}: SwrInitorProps) => { }: SwrInitorProps) => {
const router = useRouter() const router = useRouter()
const searchParams = useSearchParams() const searchParams = useSearchParams()
const { getNewAccessToken } = useRefreshToken()
const consoleToken = searchParams.get('access_token') const consoleToken = searchParams.get('access_token')
const refreshToken = searchParams.get('refresh_token') const refreshToken = searchParams.get('refresh_token')
const consoleTokenFromLocalStorage = localStorage?.getItem('console_token') const consoleTokenFromLocalStorage = localStorage?.getItem('console_token')
const refreshTokenFromLocalStorage = localStorage?.getItem('refresh_token') const refreshTokenFromLocalStorage = localStorage?.getItem('refresh_token')
const [init, setInit] = useState(false) const [init, setInit] = useState(false)
const { getNewAccessToken } = useRefreshToken()
useEffect(() => { useEffect(() => {
if (!(consoleToken || refreshToken || consoleTokenFromLocalStorage || refreshTokenFromLocalStorage)) { if (!(consoleToken || refreshToken || consoleTokenFromLocalStorage || refreshTokenFromLocalStorage)) {
@ -27,12 +27,12 @@ const SwrInitor = ({
return return
} }
if (consoleTokenFromLocalStorage && refreshTokenFromLocalStorage) if (consoleTokenFromLocalStorage && refreshTokenFromLocalStorage)
getNewAccessToken(consoleTokenFromLocalStorage, refreshTokenFromLocalStorage) getNewAccessToken()
if (consoleToken && refreshToken) { if (consoleToken && refreshToken) {
localStorage.setItem('console_token', consoleToken) localStorage.setItem('console_token', consoleToken)
localStorage.setItem('refresh_token', refreshToken) localStorage.setItem('refresh_token', refreshToken)
getNewAccessToken(consoleToken, refreshToken).then(() => { getNewAccessToken().then(() => {
router.replace('/apps', { forceOptimisticNavigation: false } as any) router.replace('/apps', { forceOptimisticNavigation: false } as any)
}).catch(() => { }).catch(() => {
router.replace('/signin') router.replace('/signin')

View File

@ -99,7 +99,7 @@ const NormalForm = () => {
if (res.result === 'success') { if (res.result === 'success') {
localStorage.setItem('console_token', res.data.access_token) localStorage.setItem('console_token', res.data.access_token)
localStorage.setItem('refresh_token', res.data.refresh_token) localStorage.setItem('refresh_token', res.data.refresh_token)
getNewAccessToken(res.data.access_token, res.data.refresh_token) getNewAccessToken()
router.replace('/apps') router.replace('/apps')
} }
else { else {

View File

@ -31,7 +31,7 @@ const UserSSOForm: FC<UserSSOFormProps> = ({
if (refreshToken && consoleToken) { if (refreshToken && consoleToken) {
localStorage.setItem('console_token', consoleToken) localStorage.setItem('console_token', consoleToken)
localStorage.setItem('refresh_token', refreshToken) localStorage.setItem('refresh_token', refreshToken)
getNewAccessToken(consoleToken, refreshToken) getNewAccessToken()
router.replace('/apps') router.replace('/apps')
} }

View File

@ -14,7 +14,6 @@ const useRefreshToken = () => {
const router = useRouter() const router = useRouter()
const timer = useRef<NodeJS.Timeout>() const timer = useRef<NodeJS.Timeout>()
const advanceTime = useRef<number>(5 * 60 * 1000) const advanceTime = useRef<number>(5 * 60 * 1000)
const interval = useRef<number>(55 * 60 * 1000)
const getExpireTime = useCallback((token: string) => { const getExpireTime = useCallback((token: string) => {
if (!token) if (!token)
@ -31,18 +30,24 @@ const useRefreshToken = () => {
localStorage?.removeItem('is_refreshing') localStorage?.removeItem('is_refreshing')
localStorage?.removeItem('console_token') localStorage?.removeItem('console_token')
localStorage?.removeItem('refresh_token') localStorage?.removeItem('refresh_token')
localStorage?.removeItem('last_refresh_time')
router.replace('/signin') router.replace('/signin')
}, []) }, [])
const getNewAccessToken = useCallback(async (currentAccessToken: string, currentRefreshToken: string) => { const getNewAccessToken = useCallback(async () => {
if (localStorage?.getItem('is_refreshing') === '1') const currentAccessToken = localStorage?.getItem('console_token')
const currentRefreshToken = localStorage?.getItem('refresh_token')
if (!currentAccessToken || !currentRefreshToken) {
handleError()
return new Error('No access token or refresh token found')
}
if (localStorage?.getItem('is_refreshing') === '1') {
timer.current = setTimeout(() => {
getNewAccessToken()
}, 1000)
return null return null
}
const currentTokenExpireTime = getExpireTime(currentAccessToken) const currentTokenExpireTime = getExpireTime(currentAccessToken)
let lastRefreshTime = parseInt(localStorage?.getItem('last_refresh_time') || '0') if (getCurrentTimeStamp() + advanceTime.current > currentTokenExpireTime) {
lastRefreshTime = isNaN(lastRefreshTime) ? 0 : lastRefreshTime
if (getCurrentTimeStamp() + advanceTime.current > currentTokenExpireTime
&& lastRefreshTime + interval.current < getCurrentTimeStamp()) {
localStorage?.setItem('is_refreshing', '1') localStorage?.setItem('is_refreshing', '1')
const [e, res] = await fetchWithRetry(fetchNewToken({ const [e, res] = await fetchWithRetry(fetchNewToken({
body: { refresh_token: currentRefreshToken }, body: { refresh_token: currentRefreshToken },
@ -53,24 +58,17 @@ const useRefreshToken = () => {
} }
const { access_token, refresh_token } = res.data const { access_token, refresh_token } = res.data
localStorage?.setItem('is_refreshing', '0') localStorage?.setItem('is_refreshing', '0')
localStorage?.setItem('last_refresh_time', getCurrentTimeStamp().toString())
localStorage?.setItem('console_token', access_token) localStorage?.setItem('console_token', access_token)
localStorage?.setItem('refresh_token', refresh_token) localStorage?.setItem('refresh_token', refresh_token)
const newTokenExpireTime = getExpireTime(access_token) const newTokenExpireTime = getExpireTime(access_token)
timer.current = setTimeout(() => { timer.current = setTimeout(() => {
const consoleTokenFromLocalStorage = localStorage?.getItem('console_token') getNewAccessToken()
const refreshTokenFromLocalStorage = localStorage?.getItem('refresh_token')
if (consoleTokenFromLocalStorage && refreshTokenFromLocalStorage)
getNewAccessToken(consoleTokenFromLocalStorage, refreshTokenFromLocalStorage)
}, newTokenExpireTime - advanceTime.current - getCurrentTimeStamp()) }, newTokenExpireTime - advanceTime.current - getCurrentTimeStamp())
} }
else { else {
const newTokenExpireTime = getExpireTime(currentAccessToken) const newTokenExpireTime = getExpireTime(currentAccessToken)
timer.current = setTimeout(() => { timer.current = setTimeout(() => {
const consoleTokenFromLocalStorage = localStorage?.getItem('console_token') getNewAccessToken()
const refreshTokenFromLocalStorage = localStorage?.getItem('refresh_token')
if (consoleTokenFromLocalStorage && refreshTokenFromLocalStorage)
getNewAccessToken(consoleTokenFromLocalStorage, refreshTokenFromLocalStorage)
}, newTokenExpireTime - advanceTime.current - getCurrentTimeStamp()) }, newTokenExpireTime - advanceTime.current - getCurrentTimeStamp())
} }
return null return null
@ -80,7 +78,6 @@ const useRefreshToken = () => {
return () => { return () => {
clearTimeout(timer.current) clearTimeout(timer.current)
localStorage?.removeItem('is_refreshing') localStorage?.removeItem('is_refreshing')
localStorage?.removeItem('last_refresh_time')
} }
}, []) }, [])