[인스타그램클론코딩] 삽질 정리 : ConfirmSecret 후 Home 화면으로 이동 불가

안녕하세요 강정호입니다.

 

오늘은 인스타그램클론코딩을 하면서 경험한 삽질을 정리해서 올려보려고 합니다.

 

[문제 상황]

Confirm.js 시크릿 코드로 인증을 하여 토큰을 받는 화면에서 인증을 정상적으로 완료 했음에도 불구하고 Home 화면으로 이동하지 못하고 Confirm 화면에만 계속 머물게 되는 오류가 있었습니다.

(왼쪽) Confirm 버튼 누르기 전   (오른쪽) Confirm 버튼 누른 후

 

서버에서 출력해보니 토큰은 정상적으로 발급이 되었고, Confirm은 성공적으로 실행되었습니다.

 

[원인]

강제로 isLoggedIn 변수를 false로 세팅을 해주고 있었다. 그렇다보니 AuthNavigation을 계속해서 호출하게 되었던 것이다.

 

[프로그램 흐름]

1. Confirm.js 에서 시크릿 코드를 입력하고 Confirm 버튼 클릭. 입력한 시크릿코드와 해당 유저에게 발급된 시크릿코드가 일치하는지 gql로 서버에 confirmSecret 함수를 호출하여 token을 리턴 받음.

 

2. AuthContext.js 에서 토큰을 AsyncStorage에 저장 후, IsLoggedIn변수를 true로 변경. 그리고 AuthContext.Provider로 IsLoggedIn 변수가 true로 변한 것을 모든 컴포넌트에 전달.

 

3. App.js 에서는 AuthContext를 구독하고 있다. 그래서 IsLoggedIn이 true인 것을 인지하고 <NavController> 호출.

 

4. NavController.js 에서는 IsLoggedIn이  true인 것을 확인하고, MainNavigation을 호출한다.