使用本地存储中的承载令牌答案

【问题标题】：Use Bearer Token from localstorage使用本地存储中的承载令牌
【发布时间】：2019-10-18 14:11:57
【问题描述】：

所以我正在创建一个简单的 React Redux 应用程序，使用 superagent 从数据库中获取一些元素并对它们进行一些操作。我使用 Symfony 的 Api 平台作为后端并创建了一些 API。我所有的 API 都受到保护，需要不记名令牌才能访问它们。我使用 JWT 创建了一个身份验证 API。

现在我正在尝试让数据显示在我的 React 应用程序中。我已经创建了一个有效的登录表单。我可以使用我的用户名和密码并获得一个令牌作为回报。

但我的问题是，在我进行身份验证并且应用程序将我重定向到我的主页（其中包含数据库中的元素列表）之后，我的控制台中出现错误

("{code: 401, message: "JWT Token not found"}
code: 401
message: "JWT Token not found")

这意味着我没有在我的请求中使用不记名令牌。

那么我如何在我的 POST、GET 和 PUT 请求中使用令牌，以便我可以使用它们。

PS： 我的令牌存储在我的本地存储中，名称为 jwtToken 这是我的 agent.js 文件：

import superagentPromise from 'superagent-promise';
import _superagent from 'superagent';

const superagent = superagentPromise(_superagent,global.Promise);
const API_ROOT='http://localhost:8000/api';
const responseBody = response => response.body;

let token =window.localStorage.getItem('jwtToken');;



const tokenPlugin = secured => {
    return (request) => {
        if (token && secured){
            request.set('Authorization',`Bearer ${token}`);
        }
};
};
export const requests={
    get: (url, secured = false)=>{
        return superagent.get(`${API_ROOT}${url}`).use(tokenPlugin(secured)).then(responseBody);
    },
    post: (url, body = null, secured = true) => {
        return superagent.post(`${API_ROOT}${url}`, body).use(tokenPlugin(secured)).then(responseBody);
    },
    setToken: (newJwtToken) => token = newJwtToken
    };

【问题讨论】：

可以试试console.log(token)看看有没有数据吗？
它返回令牌，所以它工作正常，我必须将secured更改为true并且它工作

标签： reactjs api symfony react-redux superagent

【解决方案1】：

你的 get 接受 url 和 secured 参数，也许你没有发送第二个参数，它默认为 false 并且 tokenPlugin 正在检查 token && secured

在您使用get 的地方尝试get(url, true)。

【讨论】：