登录时的"访问控制允许来源"标头问题



这是我为这个问题而苦苦挣扎的第三天。

我收到此错误:

请求的资源上不存在"访问控制允许源"标头。因此,不允许访问源"http://localhost:3000"。响应具有 HTTP 状态代码 502。如果不透明响应满足您的需求,请将请求的模式设置为"no-cors",以便在禁用 CORS 的情况下获取资源

但是,在执行来自同一服务器的 get 请求时,我没有这样的问题。我故意破坏了 cors/headers 设置,现在允许前端访问 api,并发现问题出在登录上。我尝试使用自己的 api 和 axios 执行登录请求,但两次都失败了。在这一点上,我不知道在哪里寻找问题。我的应用程序.js api 文件如下所示:

app.use(function (req, res, next) {
var allowedOrigins = ['http://localhost:3000', 'front end'];
var origin = req.headers.origin;
if (allowedOrigins.indexOf(origin) > -1) {
res.setHeader('Access-Control-Allow-Origin', origin);
}
res.header("Access-Control-Allow-Credentials", true);
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header('Access-Control-Allow-Headers', 'Authorization, Origin, X-Requested-With, Content-Type, Accept');
next();
});

在前端登录时如下所示:

export const handleLogin = (email, password) => {
return function (dispatch) {
let params = { email, password };
Api.post('/auth', params).then((res) => {
//dispatch(fetchUser2());
if(res.user){
dispatch({
type: FETCH_USER,
payload: res.user
})
}
});
}
}

但也许问题以某种方式存在于护照上,所以我也粘贴了护照文件:

module.exports = (passport) => {
passport.serializeUser((user, done) => {
done(null, user.id);
});
passport.deserializeUser((id, done) => {
Employee.findById(id).then((user) => {
done(null, user);
});
});
//passport strategies
passport.use('local', new LocalStrategy({
usernameField: 'email',
passwordField: 'password',
passReqToCallback: true,
},
function (req, email, password, done) {
Employee.findOne({ email: email }, function (err, user) {
if (err) { return done(err); }
if (!user) {
return done(null, false, { message: 'Incorrect username.' });
}
if (password != user.password) {
return done(null, false, { message: 'Incorrect password.' });
}
return done(null, user);
}).catch(errors => {
return done(errors, null);
})
}
));
}

最后是 API 中身份验证的路由:

app.post('/auth', function (req, res, next) {
passport.authenticate('local', function (err, user, info) {
if (err) {
return next(err);
}
if (!user) {
return res.status(401).send({
success: false,
msg: 'User not found'
});
}
req.logIn(user, function (err) {
if (err) {
return next(err);
}
res.status(200).send({
user: user,
msg: 'You're logged in'
});
return;
});
})(req, res, next);
});

在尝试虚拟帖子并收到请求后,我几乎可以肯定其护照的故障,因为其他帖子请求有效

你缺少set它应该setHeader而不是header

res.setHeader("Access-Control-Allow-Credentials", true);
res.setHeader('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.setHeader('Access-Control-Allow-Headers', 'Authorization, Origin, X-Requested-With, Content-Type, Accept');

编辑 1

对于生产,您可以通过设置为以下方式允许它全部:

res.setHeader('Access-Control-Allow-Origin', '*');

最新更新