React를 사용해 Furo 로그인을 연동하는 방법을 안내합니다.
Furo React Sample 프로젝트를 다운로드 받습니다.
이어서 npm 패키지를 설치합니다
Furo 콘솔의 [Configuration > For Developers] 탭으로 넘어가 다음 두 가지 작업을 진행합니다.
https://sample.furo.one/{{YOUR_CLIENT_ID}}
를 http://localhost:3000/{{YOUR_CLIENT_ID}}
로 변경합니다.redirectUri 와 callbackUri
로그인 후 사용자를 애플리케이션 내의 특정 페이지로 이동시킬 때 사용하는 속성입니다.
redirectUri는 애플리케이션 내에서 직접, Default Callback URI는 Furo 콘솔에서 각각 지정할 수 있습니다.
앱 내에서 지정한 redirectUri는 통신 중에 악의적으로 조작될 위험이 있기 때문에, Furo 콘솔에서 Default Callback URI에 등록된 URI에 한해서만 redirectUri가 정상 동작합니다.
다시 터미널로 돌아와서 아래 명령어를 입력합니다.
http://localhost:3000 에 들어가보면 아래와 같이 Furo가 연동된 로그인 기능을 테스트해 볼 수 있습니다.
React를 사용해 Furo 로그인을 연동하는 방법을 안내합니다.
Furo React Sample 프로젝트를 다운로드 받습니다.
이어서 npm 패키지를 설치합니다
Furo 콘솔의 [Configuration > For Developers] 탭으로 넘어가 다음 두 가지 작업을 진행합니다.
https://sample.furo.one/{{YOUR_CLIENT_ID}}
를 http://localhost:3000/{{YOUR_CLIENT_ID}}
로 변경합니다.redirectUri 와 callbackUri
로그인 후 사용자를 애플리케이션 내의 특정 페이지로 이동시킬 때 사용하는 속성입니다.
redirectUri는 애플리케이션 내에서 직접, Default Callback URI는 Furo 콘솔에서 각각 지정할 수 있습니다.
앱 내에서 지정한 redirectUri는 통신 중에 악의적으로 조작될 위험이 있기 때문에, Furo 콘솔에서 Default Callback URI에 등록된 URI에 한해서만 redirectUri가 정상 동작합니다.
다시 터미널로 돌아와서 아래 명령어를 입력합니다.
http://localhost:3000 에 들어가보면 아래와 같이 Furo가 연동된 로그인 기능을 테스트해 볼 수 있습니다.