У меня есть внешний интерфейс с react
и серверная часть с express and mongodb
, у меня есть компонент, который должен сделать запрос на выборку, включая учетные данные, которые уже должны быть установлены. Все маршруты работают на почтальоне, но я не могу воссоздать функциональность с помощью функции выборки.
Экспресс-сервер:
...
server.use(helmet());
server.use(compression());
server.use(cors({
credentials: true,
}));
if (process.env.NODE_ENV !== "production") {
server.use(logger("dev"));
}
server.use(express.json());
server.use(express.urlencoded({ extended: false }));
server.use(cookieParser());
server.use(
session({
secret: process.env.COOKIE_SECRET,
resave: true,
saveUninitialized: false,
store: new MongoStore({ mongooseConnection: mongoose.connection })
})
);
server.use(auth.initialize);
server.use(auth.session);
server.use(auth.setUser);
//API ROUTES
server.use("/user", require("./api/routes/user"));
server.use("/pitch", require("./api/routes/pitch"));
server.use("/match", require("./api/routes/matchmaking"));
...
Маршруты пользователей:
router.post("/login", passport.authenticate("local"), (req, res, next) => {
return res.status(200).json({
message: "User logged in correctly",
redirect: "/"
});
});
router.get("/checklogin", (req, res, next) => {
if (req.user) return next();
else
return res.status(401).json({
error: "User not authenticated"
});
},
(req, res, next) => {
return res.status(200).json({
message: "User logged in correctly",
redirect: "/"
});
});
Внешний интерфейс:
useEffect(() => {
async function fetchData() {
const response = await fetch("http://localhost:8000/user/checklogin", {
credentials: 'include'
});
const data = await response.json();
console.info(data);
}
fetchData();
}, []);
Используя этот код, я получаю эту ошибку
Access to fetch at 'http://localhost:8000/user/checklogin' from origin 'http://localhost:3000' has been blocked by CORS policy: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
Как я уже сказал, все работает на почтальоне, но не с функцией выборки.
Вы можете сделать что-то вроде этого экспресс
app.use(cors({credentials: true, origin: 'http://localhost:3000'}));
app.use(function(req, res, next) {
res.header("Access-Control-Allow-Origin", 'http://localhost:3000');
res.header("Access-Control-Allow-Credentials", true);
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header("Access-Control-Allow-Headers", 'Origin,X-Requested-With,Content-Type,Accept,content-type,application/json');
next();
});
в роутере
router.all('*', cors());
при отправке ответа делать
res.header("Access-Control-Allow-Origin", 'http://localhost:3000');
res.json(someJson)
Как говорит ошибка:
The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'.
Когда вы делаете это server.use(cors())
, все запросы разрешены по умолчанию, и из-за этого заголовок 'Access-Control-Allow-Origin'
устанавливается на '*'
.
Итак, вы можете указать corsOptions
, чтобы обойти эту проблему.
var whitelist = ['http://localhost:3000', /** other domains if any */ ]
var corsOptions = {
credentials: true,
origin: function(origin, callback) {
if (whitelist.indexOf(origin) !== -1) {
callback(null, true)
} else {
callback(new Error('Not allowed by CORS'))
}
}
}
server.use(cors(corsOptions));
Хм, я полагаю, что LocalStrategy настроена не полностью. Вы правильно смонтировали serializeUser
и deserializeUser
?
Я также не вижу passport.init()
и passport.session()
. Вы выполнили все шаги из здесь
Я нашел решение, оно включало функцию выборки, которая не сохраняла файл cookie сеанса, и поэтому она не работала, но ваше решение все же помогло.
Я рад, что это помогло!
Спасибо, я сделал, как вы сказали, но я получаю (Неавторизованный), даже если пользователь вошел в систему...