📝Day 81(55)일차 WE_MOTIVATION_DIARY

김민재·2021년 10월 11일
0

빡코딩 다이어리

목록 보기
78/87
post-thumbnail

- 프로젝트 진행현황

1. 회원가입 API

  • 회원가입 중복 이메일 입력시 에러 처리
  • 회원가입 비어있는 값 에러 처리
  • 회원가입에 성공했을 때

2. 로그인 API

  • 로그인 시 유효하지 않은 이메일 입력했을 때
  • 로그인 시 잘못된 비밀번호 입력 했을 때
  • 로그인 성공 시 메세지와 토큰을 복호화한 값

- TODAY I LEARN ERROR 🦠

  • 토큰을 쿠키나 로컬 스토리지에 보관하면 보안의 문제가 생긴다.
  • 개발자 도구에서 쿠키에 저장된 값을 임의로 바꿔서 접근하는 나쁜짓 가능!

- HOW TO FIX MY ERROR 💊

  • ERROR를 해결한 session id🔑
    따라서 토큰을 장기간 노출해서는 안된다.
    해결 할 수 있는 방법
  1. ephemeral로 저장하는 방법, 런타임에서만 토큰을 저장하도록
  2. In httpOnly에 저장하여 javascript로 접근하지 못하도록
  3. session Id에 저장하는 방법
    => 중요한 정보는 서버에서만 관리하고 클라이언트에게는 세션 키만 제공하자!
    서버에 세션 객체 생성 후 키를 만들어 속성명을 사용하여 속성 값에 정보를 저장하고 uniqueint를 클라이언트에 보내는 방식
  • 수정된 코드

- 모르는 점

  • token을 cookie,localstorage, session에 저장할 때의 각각의 차이점에 대해서
  • 세션이 필요한 이유에 대해서

- 배운점

  • 보안 측면에서의 JWT
    쿠키나 로컬스토리지에 JWT 토큰을 저장하는건 안전하지 못한 방법이다. 왜냐면 어떤 악성 스크립트에 의해서 쉽게 접근이 가능하기 때문이다
  1. front에 로컬스토리지에서 토큰을 꺼내 저장하는 방식
<script>
 handleClick = e => {
    const { email, password } = this.state;
    e.preventDefault();
    fetch('/signin', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
      },
      body: JSON.stringify({
        email,
        password,
      }),
    })
      .then(res => {
        return res.json();
      })
      .then(data => {
        if (data.msg === 'SUCCESS_SIGNIN') {
          // this.goToList();
          localStorage.setItem('jwt', data.token);
          const tokenInLocalStorage = localStorage.getItem('jwt', data.token);
          console.log(tokenInLocalStorage);
        }
      });
  };
</script>
  1. 서버에서 res.cookie에 담아서 보내준 뒤 브라우저의 cookie에서 저장하는 방식
    res.cookie('jwt', accessToken);
<script>
// node 로그인 컨트롤러
const signInUser = async (req, res) => {
  try {
    const { email, password } = req.body;
    const accessToken = await signInService.signInUser(email, password);
    const decoded = jwt.verify(
      accessToken,
      process.env.ACCESS_TOKEN_SECRET_KEY
    );
    res.cookie('jwt', accessToken);
   return res.status(201).send({
      msg: 'SUCCESS_SIGNIN',
      token: accessToken,
      decoded,
    });
  } catch (error) {
    const { statusCode, message } = error;
    return res.status(400).send({
      msg: message,
    });
  }
};
// node 로그인 컨트롤러
</script>

- 잘한 점과 개선할 점

  • 일찍 잠자리에 든 점과 어려운 내용이 나올 때마다 스스로한계를 지어버리는 점을 고치자

- 목표와 마감기한: 2021-10-12

  1. express-session npm 설치해서 유저 정보 기억하기
  2. 리뷰받고 반영하기
profile
자기 신뢰의 힘을 믿고 실천하는 개발자가 되고자합니다.

0개의 댓글