CORS를 사용하여 쿠키 설정을 허용하는 방법

Question

다른 관련 게시물도 살펴봤지만 그 중 아무 것도 제게 효과가 없었습니다. 클라이언트 측에서는 vue를 사용하고 서버 측에서는 노드를 사용합니다.

cors 라이브러리를 사용하여 다른 게시물에서 제안한 접근 방식을 시도했지만 성공하지 못했습니다. 다음 코드를 사용하면 클라이언트의 localhost:8080에서 서버의 localhost:3000으로 요청을 보낼 수 있다고 생각할 수도 있지만 모든 요청이 실패합니다.

const cors = require("cors");
if (process.env.ENV !== "prod") {
  corsOptions = {를 허용하십시오.
    출처: ["http://localhost:8080"],
    자격 증명: 사실,
    옵션성공상태: 200,
  };
  app.use(cors(corsOptions));
}

이것은 제가 쿠키를 설정하는 데 사용하는 컨트롤러입니다.

router.route("/login").post(async (req, res) => {
  //사용자 인증
  const user = wait Users.findOne({ 여기서: { 이메일: req.body.email } });

  if (사용자 == null) {
    return res.status(400).send("사용자를 찾을 수 없습니다!");
  }
  노력하다 {
    if (bcrypt.compare(req.body.password, user.password)를 기다립니다)) {
      const userInfo = {
        사용자 이름: 사용자.사용자 이름,
        이메일: 사용자.이메일,
        연령: 사용자.나이,
      };
      const accessToken = generateAccessToken(userInfo);

      const RefreshToken = jwt.sign(userInfo, process.env.REFRESH_TOKEN_SECRET);
      res.cookie("token", accessToken, {
        최대 연령: 300000,
        안전함: 사실,
        httpOnly: 사실,
        sameSite: "없음",
      });
      res.status(200).send("로그인 성공!");
    } 또 다른 {
      res.send("이메일 또는 비밀번호가 틀렸습니다!");
    }
  } 잡다 {
    res.status(500).send();
  }
});

기본적으로 이 사이트의 모든 답변은 app.use(cors)로 돌아가지만 어떤 이유로든 저에게는 작동하지 않습니다.

Answer 1

교차 도메인 쿠키의 경우 {sameSite: true} 및 {secure: true}를 설정했기 때문일 수 있지만, 귀하의 예에서는 http://localhost에서 수행하므로 쿠키가 설정되지 않습니다. 요구사항은 아래 링크를 참고해주세요.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Set-Cookie/SameSite#samesitenone_requires_secure

또한 Access-Control-Allow-Credentials, Access-Control-Allow-Origin, Access-Control-Allow-Headers와 같은 올바른 헤더를 설정하세요

mkcert를 사용하여 localhost에서 보안 연결을 만드는 방법을 참조할 수 있습니다.

또한 프런트엔드와 백엔드 모두에서 동일한 최상위 도메인을 사용하고 하위 도메인을 사용하는 것이 좋습니다.

여기서 한 가지 더 주의할 점은 도메인 이름에 포트가 있으면 Chrome에서 쿠키를 설정하지 않을 것 같으니 한번 시도해 보세요.

Answer 2

나중에 오시는 분들도 답을 찾으실 수 있도록 이 문제를 성공적으로 해결했습니다. Sequelize 연결이 초기화되는 직전으로 Cookieparser 선언을 옮겼습니다. 또한 내 axios 게시물 요청에 withCredentials 옵션을 추가했습니다. 두 단계를 모두 수행하면 이제 쿠키가 올바르게 설정되고 액세스 가능해졌습니다.

으아악 으아악