Javascript 无法将JWT标头设置为axios

我有Django REST作为后端。我需要通过

GET

查询数据库
问题：
头不在

GET

方法中。因此，Django将

“未提供身份验证凭据。”

问题：
我错在哪里

export function fetchCompanies(token, callback) {
  const instance = axios.create({
    baseURL: `${ROOT_URL}`,
    headers: {
      'Content-Type': 'application/json',
      'Authorization': 'jwt '.concat(token)
    }
    // headers: `{content-type=application/json&authorization='+${jwtReady}}`
    // headers: JSON.stringify(
    //   {'Content-Type':'application/json','Authorization': jwtReady}
    // )
  });

  const request = instance.get('/api/companies/')
    .then((res) => {
      console.log(res);
      callback(res);
    })
    .catch((err) => {
      console.log(err);
      callback(err.response);
    });
  return{
    type: FETCH_COMPANIES,
    payload: request
  }
}

参考文献：

---

我也有同样的问题。不知道如何正确修复，但我已将代码更改为：

var jwtReady = 'jwt '.concat(token);
...
headers: {'content-type=application/json&authorization='+jwtReady}

const querystring = require('querystring');

const headers = {
  'Content-Type': 'application/json',
  'Authorization': 'jwt '.concat(token)
}

axios({
  method: 'get',
  url: `${ROOT_URL}/api/companies/`,
  headers: querystring.stringify(headers)
})
  .then((res) => {
    console.log(res);
    callback(res);
  })
  .catch((err) => {
    console.log(err);
    callback(err.response);
  });

您也可以尝试使用

JSON.stringify({'Content-Type':'application/json','Authorization': 'jwt '.concat(token)}

编辑：
试着这样写：

var jwtReady = 'jwt '.concat(token);
...
headers: {'content-type=application/json&authorization='+jwtReady}

const querystring = require('querystring');

const headers = {
  'Content-Type': 'application/json',
  'Authorization': 'jwt '.concat(token)
}

axios({
  method: 'get',
  url: `${ROOT_URL}/api/companies/`,
  headers: querystring.stringify(headers)
})
  .then((res) => {
    console.log(res);
    callback(res);
  })
  .catch((err) => {
    console.log(err);
    callback(err.response);
  });

---

我也有同样的问题。不知道如何正确修复，但我已将代码更改为：

var jwtReady = 'jwt '.concat(token);
...
headers: {'content-type=application/json&authorization='+jwtReady}

const querystring = require('querystring');

const headers = {
  'Content-Type': 'application/json',
  'Authorization': 'jwt '.concat(token)
}

axios({
  method: 'get',
  url: `${ROOT_URL}/api/companies/`,
  headers: querystring.stringify(headers)
})
  .then((res) => {
    console.log(res);
    callback(res);
  })
  .catch((err) => {
    console.log(err);
    callback(err.response);
  });

您也可以尝试使用

JSON.stringify({'Content-Type':'application/json','Authorization': 'jwt '.concat(token)}

编辑：
试着这样写：

var jwtReady = 'jwt '.concat(token);
...
headers: {'content-type=application/json&authorization='+jwtReady}

const querystring = require('querystring');

const headers = {
  'Content-Type': 'application/json',
  'Authorization': 'jwt '.concat(token)
}

axios({
  method: 'get',
  url: `${ROOT_URL}/api/companies/`,
  headers: querystring.stringify(headers)
})
  .then((res) => {
    console.log(res);
    callback(res);
  })
  .catch((err) => {
    console.log(err);
    callback(err.response);
  });

---

我必须安装这个东西。问题来自后端。 我被误导了，因为我能够在没有

标题的情况下获得
令牌
和
帖子
来形成表单
这对于登录机械师来说很好。当时我认为我的配置是正确的，但实际上当来自
reactjs/redux
gitter频道的@panigrap再次向我提及时

我必须安装这个东西。问题来自后端。
我被误导了，因为我能够在没有
标题的情况下获得
令牌
和
帖子
来形成表单
这对于登录机械师来说很好。当时我认为我的配置是正确的，但实际上当来自
reactjs/redux
gitter频道的@panigrap再次向我提及时

在我的应用程序中，我完成了如下工作
首先，我创建了一个名为
axioconfig.js
的文件，代码如下，该函数读取我存储在本地存储器中的jwt，并将其设置在axios config上

/**
 * this file contains configuration for Axios Library
 */
 import axios from 'axios'

 const AxiosConfig = (config = axios.defaults) =>{
    if(localStorage.getItem('jwtToken')){
    config.headers.authorization = `Bearer ${localStorage.getItem('jwtToken')}`
   }
return config;
  }
export default AxiosConfig;

现在，我创建了另一个调用文件，如下所示：

import axios from "axios";
import axiosConfig from "./AxiosConfig";
 const headers = {};
 class AppsAPI {
 static getAllApps(userId) {
   return axios
    .post("someurl", {}, axiosConfig()) //===> Here i set axios config
  .then(res => res.data)
  .catch(err => console.log(err));
  }
}
export default AppsAPI;

在我的应用程序中，我完成了如下工作
首先，我创建了一个名为
axioconfig.js
的文件，代码如下，该函数读取我存储在本地存储器中的jwt，并将其设置在axios config上

/**
 * this file contains configuration for Axios Library
 */
 import axios from 'axios'

 const AxiosConfig = (config = axios.defaults) =>{
    if(localStorage.getItem('jwtToken')){
    config.headers.authorization = `Bearer ${localStorage.getItem('jwtToken')}`
   }
return config;
  }
export default AxiosConfig;

现在，我创建了另一个调用文件，如下所示：

import axios from "axios";
import axiosConfig from "./AxiosConfig";
 const headers = {};
 class AppsAPI {
 static getAllApps(userId) {
   return axios
    .post("someurl", {}, axiosConfig()) //===> Here i set axios config
  .then(res => res.data)
  .catch(err => console.log(err));
  }
}
export default AppsAPI;

您确定设置了正确的标题吗？我添加了我的
邮递员
图片以确认我的眼睛。还有
Copy&paste
，因为到现在为止，我已经为这个问题挣扎了4个小时。我的眼睛开始模糊了。你在后台用什么来解析授权头？@maxpaj谢谢你的回复。我受够了。问题来自后端。您确定设置了正确的标题吗？我添加了我的
Postman
图片以确认我的眼睛。还有
Copy&paste
，因为到现在为止，我已经为这个问题挣扎了4个小时。我的眼睛开始模糊了。你在后台用什么来解析授权头？@maxpaj谢谢你的回复。我受够了。问题来自后端。我已经尝试了您的尝试。浏览器没有弹出
请求
类型错误：name.toUpperCase在Object.forEach（utils.js:218）的processHeader（normalizeHeaderName.js:7）在Object.forEach（normalizeHeaderName.js:6）在transformRequest（defaults.js:32）在transform（transformData.js:16）在Object.forEach中不是函数（utils.js:224）在transformData（transformData.js:15）在dispatchRequest（dispatchRequest.js:37）上在@Sarit，您的normalizeHeaderName.js文件的第7行出现了错误。这是另一个文件。我没有创建该文件。那么您是说依赖关系被破坏了吗？@Sarit，更新了我的代码，请尝试使用
querystring
我已经尝试了您的尝试。浏览器没有弹出
请求
类型错误：name.toUpperCase不是函数在transformRequest（defaults.js:32）的transform（transformData.js:16）的transformData（transpatchRequest.js:37）的transformData（transformData.js:15）的Object.forEach（utils.js:218）的processHeader（normalizeHeaderName.js:7）上在@Sarit，您的normalizeHeaderName.js文件第7行出现错误。这是另一个文件。我没有创建该文件。所以您是说依赖关系被破坏了？@Sarit，更新了我的代码，请尝试
querystring
谢谢您的好例子。我已经完成了。问题来自后端。谢谢您的好例子.我受够了。问题来自后端。