질문을 다시 정리해서 왔습니다 하하

로그인 문제 하나는 해결을 했는데 하나는 도저히 원인을 모르겟습니다..

우선 로그인 페이지에서 post 요청을 합니다.
로그인 페이지

    <Container>
      <Row className="mt-5">
        <Col></Col>
        <Col>
          {" "}
          <Form action="http://localhost:8080/login" method="POST">
            <Form.Group className="mb-3" controlId="exampleForm.ControlInput1">
              <Form.Label>ID</Form.Label>
              <Form.Control type="text" name="id" />
            </Form.Group>
            <Form.Group className="mb-3" controlId="formBasicPassword">
              <Form.Label>Password</Form.Label>
              <Form.Control type="password" name="pw" />
            </Form.Group>

            <Button variant="primary" type="submit">
              Log In
            </Button>
          </Form>
        </Col>
        <Col></Col>
      </Row>
    </Container>

서버에서 post 요청을 받으면 요청.user가 서버 콘솔에 정상적으로 나오고 http://localhost:3000로 redirect를 합니다.
서버 사이드
app.post(
  "/login",
  passport.authenticate("local", {
    failureRedirect: "http://localhost:3000/fail",
  }),
  function (요청, 응답) {
    const userData = 요청.user;
    console.log(userData)
    응답.redirect("http://localhost:3000");
  }
);

http://localhost:3000로 redirect 되었을 때 서버 콘솔에 찍히는 userData를 프론트에서 사용하고 싶어서 다음과 같이 fetch를 했는데,

브라우저 콘솔에서는 console.error로 응답이 뜹니다. 서버 콘솔에서 이미 userData를 출력했는데, redirect한 페이지에서는 
왜 userData를 바로 받지 못하는 걸까요? 

http://localhost:3000의 navbar
  fetch("http://localhost:8080/session", {
    method: "GET",
    credentials: "include", 
  })
    .then(response => {
      if (response.ok) {
        return response.json();
      } else {
        throw new Error("Not a JSON response");
      }
    })
    .then(data => {
      console.log(data.user);
      setIsLoggedIn(!!data.user);
    })
    .catch(error => {
      console.error("Error fetching mypage:", error);
      setIsLoggedIn(false);
    });