Question

从我的React应用通过CORS向我的Node.JS和Express.js后端发送请求时，我得到：

storage()

我正在使用axios发送请求，这是请求配置：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:3001/students/login. (Reason: CORS preflight channel did not succeed).

我尝试使用以下标头允许Express中的CORS：

({ email, password }) => {
        return axios.post(API_ENDPOINT + UCENIK.post.login,
            { email, password },
            {
                withCredentials: true,
                Headers: {
                    'Content-Type': 'application/x-www-form-urlencoded',
                }
            })
    }

编辑：使用npm Cors模块修复并提供此对象进行设置：

app.use(function (req, res, next) {
    res.header("Access-Control-Allow-Origin", req.headers.origin);
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, Authorization')");
    res.header("Access-Control-Allow-Credentials", true);
    res.header("Access-Control-Allow-Methods", "GET, PUT, POST, DELETE, OPTIONS");
    next();
});

Answer 1

我认为这只是一个开发问题，因为您的Express实例和reactjs前端服务器在不同的端口上运行。在生产环境中，情况可能并非如此。

代替在开发周期中使用CORS，请尝试将请求从前端服务器代理到快速服务器。

例如，webpack开发服务器具有单独的代理配置https://webpack.js.org/configuration/dev-server/#devserver-proxy

CORS飞行前频道未成功，React to Express

1 个答案: