Javascript React和Redux:401 API请求后出现未经授权的错误

//邮递员//反应应用程序 对于我的react应用程序，在调度apiPostRequest（）时，当它命中API POST请求中间件时，即使用户经过身份验证并且令牌存储在本地存储中，我也会收到401个未经授权的错误。令人困惑的是，我的GET和DELETE api请求工作得很好。所以我不明白为什么PostAPI返回401未经授权的错误？在《邮递员》中效果很好。任何帮助都将不胜感激

//Accept request action

export const acceptRequest = (requestId) => ({
  type   : ACCEPT_REQUEST,
  payload: requestId
});

试试这个：

//Setting Auth Header

export const setAuthorizationHeader = (getState) =>{

    const token = getState().auth.token; 
    const config = {
      headers:{
        "Content-Type": "application/json"
      }
    }
  if(token){
    // change 'x-authorization' to 'Authorization'
    config.headers['Authorization'] = token;
  }
  return config;
};

---

问题是您使用的post方法不正确

正如您从axios拍摄的图像中看到的，当在未指定参数名称的情况下发布帖子时，传入的第二个参数被视为数据

---

因此，请尝试：

axios.post（url，{}，config）

尝试将您的配置记录到控制台中，并检查是否所有字段都正确。可以检查的另一件事是服务器的CORS配置和允许的请求方法，但由于POST请求通过邮递员工作，问题在于调度请求本身。是的，我做了控制台日志记录，我得到了正确的标题信息，内容类型为：“application/json”，x-authorization:“Bearer”。相同的配置被传递到我的delete和get api路由，它们工作正常。问题在于post api路由。是否检查了服务器的CORS配置？如果要暂时关闭身份验证。POST是否仍然返回401未经授权的错误？感觉不记名令牌可能是一个red herring.Greg，所以当我暂时关闭身份验证时，它会成功工作。奇怪的这意味着什么？谢谢你的回复。它不起作用。我不认为我将其命名为“x-authorization”或“authorization”会有什么区别。你能记录响应标题并将其放在这里吗？用响应标题的图像更新了我的问题。请看一看。谢谢。请求标题（截图）如何？很抱歉。再次用请求标题更新。

//API POST, DELETE, GET request actions

export const apiPostRequest = (url, config, body, onSuccess, onError) => ({
  type: POST_API_REQUEST,
  meta: {url, config, body, onSuccess, onError}
});
export const apiDeleteRequest = (url, config, id, onSuccess, onError) => ({
  type: DELETE_API_REQUEST,
  meta: {url, config, id, onSuccess, onError}
});
export const apiGetRequest = (url, config, onSuccess, onError) => ({
  type: GET_API_REQUEST,
  meta: {url, config, onSuccess, onError}
});

//API POST, DELETE, GET request middleware

export const api = ({dispatch}) => next => action => {

  if(action.type === POST_API_REQUEST) {
    const {url, config, body, onSuccess, onError} = action.meta;

    axios.post(url, config)
      .then((data) => {dispatch({ type: onSuccess, payload: body})})
      .catch(error => dispatch({ type: onError, payload: error }))
  }

  if(action.type === GET_API_REQUEST) {
    const {url, config, onSuccess, onError } = action.meta;

    axios.get(url, config)
      .then((data) => {dispatch({ type: onSuccess, payload: data})})
      .catch(error => dispatch({ type: onError, payload: error }))
  }

  if(action.type === DELETE_API_REQUEST) {

    const {url, config, id, onSuccess, onError } = action.meta;
    axios.delete(url, config)
      .then((data) => { dispatch({ type: onSuccess, payload: id })})
      .catch(error => dispatch({ type: onError, payload: error }))
  }


return next(action)
};

//Setting Auth Header

export const setAuthorizationHeader = (getState) =>{

    const token = getState().auth.token; 
    const config = {
      headers:{
        "Content-Type": "application/json"
      }
    }
  if(token){
    config.headers['Authorization'] = token;
  }
  return config;
};

//Setting Auth Header

export const setAuthorizationHeader = (getState) =>{

    const token = getState().auth.token; 
    const config = {
      headers:{
        "Content-Type": "application/json"
      }
    }
  if(token){
    // change 'x-authorization' to 'Authorization'
    config.headers['Authorization'] = token;
  }
  return config;
};