CORS 错误：请求 header 字段身份验证在预检响应中不允许访问控制允许标头

Question

注销时，会发生此错误。 Access to XMLHttpRequest at ' http://127.0.0.1:8000/api/auth/logout/ ' from origin ' http://localhost:3000 ' has been blocked by CORS policy: Request header field authentication is not allowed by Access-预检响应中的 Control-Allow-Headers。

我将 auth.js 的注销 function 称为 onClick。 我不知道为什么刷新页面时会注销。

减速器.js

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

注销 action/auth.js 的 function

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",

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