구글,네이버 로그인 API 에 주소 등록, SSL인증서 등록

일단 현상태에서 구글과 네이버로 로그인하려고 하면 다음과 같은 오류가 발생한다.

 

 

이는 구글과 네이버 API에 도메인 등록을 하지 않아서 그렇다. 테스트를 위해 localhost:8080 환경에서만 돌아가게 만들어 놨으니 실제 도메인에서는 이런 오류가 발생하는 것이다. 이를 해결하기 위해 도메인을 등록하자.

 

 

먼저 구글 API 관리 페이지에 접속해서 OAuth 동의 화면의 앱 수정을 선택한다.

 

 

승인된 도메인 란에 도메인을 저장. 이때 Http는 빼야 한다.

 

 

그 뒤, API 및 서비스의 사용자 인증 정보에서 자신의 Application을 선택해준다.

 

 

승인된 리디렉션 URI에 '도메인/login/oauth2/code/google' 을 추가하면 준비는 끝난다.

 

 

이후 구글 로그인을 시도하면 성공적으로 적용되는 모습을 볼 수 있다.

 

이제 네이버 로그인도 등록해줘야 하는데, 네이버는 검수를 마치기 전까지 본인 계정으로밖에 로그인이 안된다.

 

 

먼저 네이버 API관리 페이지에 접속한다.

 

 

해당하는 Application을 선택하고 서비스URL과 Callback URL을 수정한다. 구글에서 했던것과 같게 입력해주면 된다.

 

 

수정완료하고 다시 홈페이지에 들어가서 확인해보면 이렇게 로그인을 할 수 있다.

 

 

그런데 해당 ID가 아니라 다른 ID로 로그인하게 되면 이런 문구가 보인다. 이는 아직 네이버로부터 검수를 받지 않아서 관리자의 네이버 계정으로만 로그인이 가능한 것이다.

 

 

여기서 '검수요청 하러 가기' 를 통해 검수요청을 할 수 있다.

 

 

기본적인 정보들을 입력하고 검수요청을 하면 된다.

 

그리고 더 큰 문제가 있다.

 

 

현재 서비스의 위치 가져오기를 선택하면 위치를 가져올 수 없다. 크롬 콘솔은 다음과 같이 말하고 있다.

 

 

https를 사용하지 않으면 getCurrentPosition()함수를 사용할 수 없다. 이때문에 인증서를 등록하여 https를 사용하도록 만들어야 한다.

 

 

AWS 콘솔에서 ACM을 검색하고 들어가준다.

 

 

'인증서 프로비저닝' 선택

 

 

이상태로 넘어간다.

 

 

이렇게 도메인을 등록해준다. 지금은 xxx.matjipfind.tk 는 사용할일이 없지만 일단 추가해주기로 했다.

 

 

DNS검증을 선택한다.

 

 

태그는 필수는 아닌 듯 하다.

 

 

내용을 확인하고 '확인 및 요청'을 선택한다.

 

 

요청 진행 중이 되면 계속으로 넘어간다.

 

 

이런 화면이 보일텐데 해당 도메인(들)을 선택해서 Route 53에서 레코드 생성을 선택한다. 그러면 알아서 인증에 성공한다. 발급 완료까지 최대 30분이 걸릴 수 있다고 한다.

 

발급 완료된 모습

 

5분 정도면 발급이 완료된다.

 

 

이제 EC2의 메뉴로 돌아와서 로드밸런서를 선택하고 생성버튼을 선택한다.

 

 

'Application Load Balancer' 선택

 

 

1단계 에선 https 프로토콜만 추가해주고 넘어간다.

 

 

2단계에 진입하면 자동으로 ACM에서 생성한 인증서가 뜬다. 이를 적용한다. 보안 정책은 잘 모른다..

 

 

보안 그룹은 기존의 것을 쓴다. 여기다가 443포트만 나중에 추가해 준다.

 

 

4단계는 이렇게 설정해주고 다음

 

 

5단계에서 나의 인스턴스를 등록해준다.

 

 

완료! 는 아니고 보안 그룹에 443을 추가해 주어야 한다.

 

 

이렇게 추가해 준다.

 

 

이제 라우트53에 들어가서

 

 

기존의 레코드도 편집해 준다.  라우팅 대상을 맞게 선택했다면 3번째 란에 자동완성이 보일 것이다.

 

 

로드 밸런서의 리스너에서 80포트 연결을 443포트로 리디렉션 해준다.

 

다 됐다는 마음으로 접속해 보았지만..

 

 

502 ERROR가 발생한다... 일단 http로 접속해도 https로 변경되고 주소창의 자물쇠 모양을 클릭하면

 

 

이렇게 인증서도 뜨는걸로 보아 ssl적용은 잘 된거 같은데 어디서 오류인지 모르겠다. 찾아야지.....

 

=======================================================================================

 

로드 밸런서 생성의 문제였다. 4단계에서 프로토콜을 HTTPS로 하면 안되고 HTTP 로 해야한다. 또한 포트도 80으로 지정해 주어야 한다.(이미지는 수정 완료)

 

처음에 뭣모르고 HTTPS,443 으로 지정하니 502 오류가 발생했었다.

 

하이튼 지금은 모두 해결하고 정상적으로 접속이 가능 + 내 위치 가져오기 기능이 작동한다!

 

https://matjipfind.tk