애플로 로그인 (자바스크립트, 스프링) 완벽파헤치기[1]

소셜 로그인 구현 중 가장 까다롭다는 애플로 로그인에 대해 정말 하나부터 열까지 끝까지 파헤쳐보도록 하겠습니다. 

 

ios개발자이거나 웹개발자라고 하더라도 ios나 애플과 관련된 서비스를 구현할때 

 

애플이 얼마나 까다로운지는 다들 알고 계실 것입니다. 

 

안드로이드와 비교해보면 간단한 설정 몇가지로 쉽게 구현되는 부분도 있고 성능적으로 뛰어난 부분도 있지만

 

애플은 대체로 보안과 관련된 부분은 굉장히 까다로운것 같아요.

 

애플로 로그인도 사용자 정보와 관련된 내용이라서 다른 소셜 로그인 구현 난이도에 비해 굉장히 절차도 많고

 

까다로우며 복잡합니다. 

 

 

 

 

그래서 한번 끝까지 파헤쳐보려고 합니다. 

 

프론트엔드에서는 자바스크립트를 이용할 것이며 백엔드에서는 자바 스프링 서버에서 작업을 해보도록 하겠습니다. 

 

 

크게 개요를 잡아보면

 

1. 애플개발자센터에서 서비스 등록 및 인증 등록

 

2. 프론트엔드 구현

 

3. 백엔드 구현

 

 

이런식으로 진행이 되고요,

 

뒤로 갈수록 복잡해지고 까다로워집니다. 

 

 

 

 

 

자 가장 쉬운 애플개발자센터에서 sign in with apple 구현을 위한 설정부터 하겠습니다.

 

 

애플 개발자 센터에서 identifiers 페이지로 가서 애플로 로그인을 구현할 앱을 클릭해주세요.

(앱등록이 안되셨다면 사용할 앱등록부터 먼저 해주세요.)

 

 

 

 

그런 다음 sign in with apple을 체크해줍니다.

(push Notifications는 안해도 되요 제 앱에서 이미 사용하는거라 체크된거에요.)

 

저장하고 나오셨다면 + 버튼을 눌러 identifiers를 하나 더 만들게요.

 

 

 

 

 

service IDs를 클릭하고 Continue 버튼을 눌러주세요.

 

 

 

 

그런다음 Description에 간단한 설명 그리고 Identifiers에는 도메인과 앱네임을 역순으로 적어주세요.

 

예를들어 도메인이 naver.com 이고 앱네입이 myApp이면 com.naver.myApp 이라고 적어주시면 됩니다. 

 

꼭 이 규칙으로 적으셔야 합니다 . continue와 register를 연달아 눌러 등록을 완료해주세요.

 

 

 

자 위와같이 등록이 완료됬음이 확인되면 다시 클릭하여 들어가주세요.

 

 

 

 

그리고 sign in with apple을 체크해주고 configure를 눌러주세요.

 

그러면 아래와 같이 팝업창이 뜰텐데

 

 

primary App ID 에는 사용할 앱을 등록해주시고

 

Domains and SubDomains에는 사용할 웹사이트의 도메인을 넣어주세요.

 

예를들어 naver.com이고 서브 도메인이 www.naver.com과   과 m.naver.com이 있으면

 

naver.com,www.naver.com,m.naver.com  이렇게 쉼표로 구분하여 적어주세요.

 

Return URLs 에는 콜백 url을 적어줍니다. 

 

 

서버에서 콜백을 처리할 url이 있어야 겠죠. 

 

이 칸에는 프로토콜까지 적어야합니다. 

 

예를들어,

 

https://naver.com/appleLoginCallback,https://www.naver.com/appleLoginCallback,https://m.naver.com/appleLoginCallback

 

이런식으로 적어주면 됩니다. 

 

 

 

이제 마지막 key파일을 만들겠습니다. 

 

 

 

 

 

 

 

 

 

keys에 들어가서 signinwithapple key를 본인의 앱으로 선택하여 만들어주세요.

 

 

 

자 이제 애플개발자센터에서 등록해야하는 것은 모두 끝났습니다. 

 

다음 편에서 프론트엔드 작업을 해줄게요. 

 

 

다음편 출처

developer111.tistory.com/57