GitHub PR 알림

https://velog.io/@taekwon/Slack-Github-알림-받기

토큰 전송 수단으로 쿠키를 쓸 때 문제점

https://velog.io/@code-bebop/CORS의-Cookie

토큰 저장/전송 방식 변경

쿠키쓰려했는데

토큰 생성 → 본문으로 전달 → 로컬스토리지에 저장 → 다음요청시 로컬스토리지에서 토큰 빼옴 → 요청 헤더에 토큰 넣음 → 서버에서는 요청헤더에서 토큰 까본다음 검증 → 검증됐으면 로그인 된것 → res.locals.decoded 에 옮겨놓은 토큰정보 활용

브라우저 로컬스토리지에서 토큰을 꺼내서 헤더에 넣어 요청 보내기

import axios from 'axios';
import React from 'react';

// JWT 토큰을 로컬 스토리지에서 가져오는 함수
const getJWTFromLocalStorage = () => {
  return localStorage.getItem('accessToken');
};

const getUser = () => {
  const jwtToken = getJWTFromLocalStorage();

  axios
    .get('<http://localhost:8001/api/user>', {
      headers: {
        Authorization: `Bearer ${jwtToken}`, // JWT를 Bearer 스키마와 함께 헤더에 추가
      },
    })
    .then(res => {
      console.log(res);
    })
    .catch(err => console.log(err));
};

export default function SettingPage() {
  return (
    <div>
      <button onClick={getUser}>회원 조회</button>
    </div>
  );
}