Discovery 2. Cookieは要求に自動的に含まれません.

7735 ワード
テキストリンク

問題の状況


サーバは、res.session.save()メソッドを使用して、クライアントapi要求に関する情報をセッションに格納する.問題は、方法が機能しないことであり、res.sessionは初期化を継続する.
module.exports = {
  post: async (req, res) => {
    const userInfo = await Users.findOne({
      where: { userId: req.body.userId, password: req.body.password },
    });


    if (!userInfo) {
      res.status(400).send({ message: "not authorized" });
    } else {
      req.session.save(function () {
        req.session.userId = userInfo.userId;
        res.send({ data: userInfo, message: "ok" });
      }); // session이 저장되지 않는 문제 발생.
    }
  },
};

解決策


問題はcors設定にあります.cors optionsを使用してcredentials: trueを追加し、クライアントapiリクエストヘッダにwithCredentials: trueを追加すると、res.session.save()メソッドは正常に動作し、クッキーもサーバに渡される.
//server

app.use(
  cors({
    origin: "https://localhost:3000",
    methods: ["GET", "POST", "OPTIONS"],
    credentials: true,
  })
);

//client
const handleLogout = (logoutHandler) => {
    axios
      .post("https://localhost:4000/users/logout", null, {
        "Content-Type": "application/json",
        withCredentials: true,
      })
      .then((res) => {
        logoutHandler();
      });
  };
CORSは、クライアント自身が他のソースからのリクエストを拒否するポリシーであり、サーバ上でCORSオプションを設定することで、設定値に基づいて他のソースからのリクエストに対して対応するリクエストを実行することができます.
同じ起源ではhttp通信を行うとクッキーが自動的にリクエストヘッダに入る.ただし、異なるソースのhttp通信では、リクエストヘッダにクッキーは自動的に含まれません.リクエストヘッダにクッキーがない場合、サーバはクライアントを認識できないため、リクエストヘッダにクッキーを含めるように個別に設定する必要があります.
このとき、サーバはcredentials:trueに設定され、クライアントはwithCredentials: trueに設定される.
[react]#7リストとKey
AWS無料枠内でWebサーバ(EC2)を起動し、httpとsshで接続する方法