Question

我正在使用JWT令牌进行身份验证，因此当我发送身份验证请求时，服务器将使用两个令牌Refresh Token和Access Token进行响应 Refresh Token保存在本地存储中，Access Token保存在Redux Store中因此，每次刷新应用程序（通过url选项卡进行请求）时，Redux中的访问令牌都设置为空，因此在主组件APP.js中，我发送了此请求，以使用Refresh Token

const refTok = localStorage.getItem('refTok')
useEffect(() => {

        axios.post("http://localhost:9000/api/refresh-token", { refTok : refTok})
         .then( res => {
          if(res.data.err) {    
              console.log(res.data.err)       
            } else {
              props.dispatch(setToken(res.data.acsTok))   
            }
          })    
    }, [])

因此，如果未登录用户，我将使用此令牌向其他组件授予访问权限，我将其重定向到首页history.push('/')
但是，此实现的问题是，当我尝试直接从URL访问组件时（例如在bookmaked URL的情况下），即使我已经登录，令牌也会重置为空，并且用户会立即被推送到登录页面甚至在Axios请求完成之前>

关于如何解决此问题以保持Access令牌的值的任何建议，我试图避免将access token保存在localStorage上

身份验证后，ReactJS在客户端保留JWT令牌

0 个答案: