使用 axios 在标头中传递 JWT答案

【问题标题】：Passing JWT in headers with axios使用 axios 在标头中传递 JWT
【发布时间】：2017-10-27 16:18:33
【问题描述】：

我创建了一个带有节点后端的小项目，并在前端做出反应以通过 REST 调用获取数据。我使用了 Axios 库，但是当我将标题传递给它时，我不断收到错误消息：

Failed to load resource: the server responded with a status of 401 (Unauthorized)。

我发现了两种方法，但都不起作用。他们是：

export const getUsersDetails=()=>{
  console.log('calling');
  return (dispatch) => {
    return axios.get('http://localhost:3030/users',{headers: { "Authorization": localStorage.getItem('jwtToken') }}).then((data)=>{
                 console.log('data comming',data);
                dispatch(getUsersData(data));
            }).catch((error)=>{
              console.log('error comming',error);
                dispatch(errorgetUsersData(error));
            });
        };
}

和

axios.defaults.headers.common['Authorization'] = localStorage.getItem('jwtToken');

但是当我使用邮递员时，我会从后端获取所需的数据。我不断收到此未经授权的错误的任何特殊原因？

【问题讨论】：

JWT 代表 JSON Web Token。当您使用变量名称jwtToken 时，它实际上读作JSON Web Token Token。我建议省略冗余并仅使用jwt（或其他一些非冗余名称）。

标签： http-headers axios

【解决方案1】：

您需要在令牌之前连接“Bearer”，如下所示：

axios.defaults.headers.common['Authorization'] = 
                                'Bearer ' + localStorage.getItem('jwtToken');

【讨论】：

这里它只适用于axios.defaults.headers.Authorization = 'Bearer ' + localStorage.getItem('jwtToken');。顺便说一句，我正在使用 Vue，并将其放入 main.js。
你好 Fusseldieb 或 dplaza 或 Clonkex 你能更新代码吗？我不明白把它放在哪里：axios.defaults.headers.common['Authorization'] = 'Bearer' + localStorage.getItem ('jwtToken');对不起..我遇到了同样的问题