如何在使用API​​时通过reactjs传递JsonWebToken x-access-token?

时间:2018-03-05 11:26:40

标签: reactjs api jwt

如何在使用带反应的API时传递动态JWT x-access-token?我知道如何使用fetch方法使用API​​。

componentDidMount(){
    fetch('http://example.com/api/admin/dailyPosts')
    .then(response => response.json())
    .then(response => {
      this.setState({
        postCount: response
      })
    })
  }

在安慰this.state.postCount时,我得到一个空数组,因为没有提供令牌。那么如何将动态令牌传递给此API?

1 个答案:

答案 0 :(得分:2)

当您拥有API或生成的令牌时,请将其设置为浏览器的cookie,如

import { Cookies } from 'react-cookie';
Cookies.set(token, auth_token_here, {path: '/'});

设置从浏览器获取cookie并使用请求方法中的标记设置标题对象,如

import { Cookies } from 'react-cookie';

componentDidMount(){
    let auth_token = Cookies.get(token)
    let header_obj = {'Authorization': auth_token};
    fetch(url, { headers : header_obj}).then();
}

假设您将令牌存储在浏览器中或者可以从redux

中获得道具