Skip to content

🔑 JWT 토큰 localStorege에 저장 #40

Description

@mandoo1229
const signUpHandler = () => {
    if (userId.length === 0 || userPassword.length === 0) {
      alert('이메일과 비밀번호를 입력하세요.');
      return;
    } // 아무런 값을 입력하지 않았을 때 alert를 호출합니다.

    const data = {
      userid: userId,
      password: userPassword,
    };

    axios //입력한 데이터를 받음.
      .post('/api/member/login', data)
      .then((response) => {
        console.log(response.data);
        // const responseData = response.data;
        const jwtToken = response.headers['authorization'];
        const refreshToken = response.data['refresh-token'];
        console.log(axios.defaults);
        // const refreshToken = response.data['refresh-token'];
        if (jwtToken && refreshToken) {
          axios.defaults.headers.common['Authorization'] = jwtToken;
          localStorage.setItem('accessToken', jwtToken);
          localStorage.setItem('refresh-token', refreshToken);

          // axios.defaults.data.common['refresh-token'] = refreshToken;
          // localStorage.setItem('refreshToken', refreshToken);
        }
        alert('로그인 성공했습니다.');

        navigate('/home', {
          // state: responseData,
        });
      })
      .then((result) => {
        console.log(result);
      })
      .catch((error) => {
        console.log(error);
        alert('로그인에 실패했습니다.'); //axios값에 데이터가 일치 하지 않으면 함수를 호출함
      });
  };

로그인을 성공하였을 때 localStorage에 AccessToken과 RefreshToken을 저장을 합니다.
AccessToken은 header에 저장이 되고, RefreshToken은 body에 저장이 됩니다. 저장된 값을 꺼내 localStorege에 저장합니다.

Activity

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Metadata

Metadata

Assignees

Labels

No labels
No labels

Projects

No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions