CORS 错误：预检响应中的 Access-Control-Allow-Headers 不允许请求标头字段身份验证

Question

注销时出现此错误。 从源“http://localhost:3000”访问“http://127.0.0.1:8000/api/auth/logout/”处的 XMLHttpRequest 已被 CORS 策略阻止：预检响应中的 Access-Control-Allow-Headers 不允许请求标头字段身份验证。

我在 onClick 中调用 auth.js 的注销功能。我不知道为什么刷新页面时会退出。

reducer.js

 case LOGOUT_SUCCESS:
      localStorage.removeItem("token");
      return {
        ...state,
        isAuthenticated: null,
        isLoading: false,
        user: null,
        isFreelancer: false
      };

action/auth.js的注销功能

export const logout = () => (dispatch, getState) => {
  const token = getState().auth.token;

  const config = {
    headers: {
      "Content-Type": "application/json"
    }
  };

  if (token) {
    config.headers["Authentication"] = `Token ${token}`;
  }

  axios
    .post("http://127.0.0.1:8000/api/auth/logout/", null, config)
    .then(res => {
      dispatch({ type: LOGOUT_SUCCESS });
    })
    .catch(err => {
      console.log(err.message);
    });
};

我希望立即退出，但每次刷新页面时都会退出。

Answer 1

如果您使用的是 Create-React-App，您可以在 package.json 文件中简单地执行此操作：

"proxy": "http://127.0.0.1:8000",

这将是代理请求，浏览器不会阻止响应。