Javascript 如何在整个会话中保持JWT令牌，直到用户注销？

我正在与JWT一起开发一个简单的React/Rails Api，该Api向Giphy Api发出请求

成功登录后，我会收到一个令牌，这是因为我在开发者工具的网络选项卡中的授权标题中有“Bearer thatlongstringwithnumbersandletters”。但是，当我刷新页面时，我会丢失令牌

在my app.js文件中：

handleLogin(params){
    // debugger
    console.log('params', params)
    let URL = 'http://localhost:3000/api/v1/auth'
    axios.post(URL, {
      username: params.username,
      password: params.password
    })
    .then(res => {  //console.log('app', res.data)
      const token = res.data.token
      //console.log('Store in localStorage: ', token)
      localStorage.setItem('jwtToken', token)
      setAuthorizationToken(token)
      // this.history.push('/puns')
    })
  }

在我的setAuthorizationToken.js文件中：

import axios from 'axios'

const setAuthorizationToken = (token) => {
  if(token){
    axios.defaults.headers.common['Authorization'] = `Bearer ${token}`
  } else {
    delete axios.defaults.headers.common['Authorization']
  }
  console.log('Authorization is SET')
}

export default setAuthorizationToken

然后，我认为令牌将在整个用户会话中持久化，方法是将回调放在index.js（app.js的父级）中。通过将回调放在父级，我可以在整个会话中保存令牌

import setAuthorizationToken from './components/auth/setAuthorizationToken'

setAuthorizationToken(localStorage.jwtToken);

ReactDOM.render((
  <Router>
    <App />
  </Router>
), document.getElementById('root'));

import setAuthorizationToken from./components/auth/setAuthorizationToken'
setAuthorizationToken（localStorage.jwtToken）；
ReactDOM.render((
)，document.getElementById（'root'）；

---

如何获取要持久化的令牌？非常感谢您的帮助。

您似乎没有正确访问

localStorage

请尝试以下方法：

localStorage.getItem('jwtToken')

---

存储在会话存储中：

sessionStorage.setItem('access_token', access_token);

然后使用令牌：

sessionStorage.getItem('access_token');

---

如果我删除令牌是一个参数-

App.js:33未捕获（承诺中）类型错误：未能在“存储”上执行“setItem”：需要2个参数，但只存在1个参数。

@user112514请确保您使用的是

get

而不是

set

。将jwt添加到会话存储是个坏主意，它容易受到XSRF攻击