새소식

반응형
FE (프론트)/react native

[RN] axios로 accesstoken 받기, AsyncStorage로 로그인 상태 유지하기

  • -
728x90
반응형

AsyncStorage 설치

npm i @react-native-async-storage/async-storage

 

활용 예

import AsyncStorage from "@react-native-async-storage/async-storage";

export default function Login({ navigation }) {
	...
    const onLoginClick=async()=>{
        try {
          const response = await axios.post("login 위한 url", 
          {	
            loginId: id,
            password:password,
          }, 
          {
            headers: {
              Accept: 'application/json',
              "Content-Type": "application/json",
            }
          });

          accessToken=response.headers.getAuthorization().split(" ");
          await AsyncStorage.setItem("accessToken", JSON.stringify(accessToken[1]));

          navigation.navigate('isLogin');
		} catch (error) {
			console.log(error);
		} 
    };
    ...
}

 

accessToken을 response header값으로 받으면 Bearer 어쩌구 이렇게 받아진다.

멋진 방법을 쓰고싶었지만 .. 그냥 split해서 저장했다 ㅎ

 

AsyncStorage 데이터 삭제하기

AsyncStorage.clear();

 


만약 post할때 internal server error인 500에러가 계속 뜬다면 ..

도대체 왜인지 모르겠다면 ...

post보내는 body 안에 값이 한글이 있는지 확인할 것 ..

 

우린 닉네임이 한국어였는데 스프링서버쪽 데이터베이스가 한국어를 못받는 상태였다

 

그것도 모르고 이것저것 다하면서 며칠을 ㅎㅎ

한국어 추가 설정해주니 에러 해결 하핫

 

 

화이팅~~

반응형
Contents

포스팅 주소를 복사했습니다

이 글이 도움이 되었다면 공감 부탁드립니다.