애플로 로그인

아이폰 앱은 애플 정책상 소셜 로그인이 추가 된다면 반드시 애플 로그인이 추가되어야 앱스토어에 등록이 된다. 카카오톡,네이버로그인,페이스북등과 같은 로그인 기능이 있다면 반드시 애플로그인이 추가되어야 아이폰 심사가 통과된다.

1.웹에서 애플 로그인 추가

애플로그인은 oauth2의 Implicit Grant 방식을 사용한다.

(1) 클라이언트가 파리미터러 클라이언트 ID, 리다이렉트 URI, 응답 타입을 code로 지정하여 권한 서버에 전달합니다. 정상적으로 인증이 되면 권한 코드 부여 코드를 클라이언트에게 보냅니다.
- 응답 타입은 code, token 이 사용 가능합니다.
- 응답 타입이 token 일 경우 암시적 승인 타입에 해당합니다.
(2) 응답 해준 Access Token 이 유효한지 검증 요청을 합니다.
(3) 요청 받은 Access Token 정보에 대한 검증에 대한 응답값을 돌려줍니다.
(4) 유효한 Access Token 기반으로 Resource Server와 통신합니다.

3번에서 애플로그인에서는 clientsecret를 key.p8 파일을 이용해 암호화해서 애플 서버에 요청 그리고 받은 결과값은 jwt를 이용해 풀어야한다. 또한 client_secret 값은 180일에 한번씩 업데이트를 해야한다.

2.민트앱 애플로그인 제공

3번의 로직이 까다롭고 처리해야하는 작업이 많다. 3번 작업을 민트앱에서 대신 처리를 해줍니다.

사용자가 애플로그인 버튼을 눌렀을때 애플 로그인사이트로 이동함

3-1.애플 로그인 적용(현재창)

 //1.javascript import
 
 <script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/ko_KR/appleid.auth.js"></script>
 
 //2.html 코드 입력 
 <div id="appleid-signin" data-color="black" data-border="true" data-type="sign in"></div>
 
 //nonce generate
  function generateNonce(length) {
      var result           = '';
      var characters       = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789';
      var charactersLength = characters.length;
      for ( var i = 0; i < length; i++ ) {
        result += characters.charAt(Math.floor(Math.random() *
          charactersLength));
      }
      return result;
    }
    
 //3.애플 로그인 초기화
 AppleID.auth.init({
  clientId : '{민트앱의 애플 로그인 화면의 client_id}',
  scope : 'name email',
  redirectURI: 'https://api.mint-app.com/applelogin', 
  state : '{민트앱의 애플 로그인 화면의 state}',
  nonce : generateNonce(16)
  usePopup:true
});

clientId:민트앱의 애플 로그인 화면의 client_id
scope : name email로 고정하면 됨
redirectURI : https://api.mint-app.com/applelogin 로 고정함
state : 민트앱의 애플 로그인 화면의 state로 고정함
usePopup: 팝업 로그인을 할지 현재 화면에서 할지 (true,false)을 입력함

3-2.애플 로그인 적용(새창)

 //1.javascript import
 
 <script type="text/javascript" src="https://appleid.cdn-apple.com/appleauth/static/jsapi/appleid/1/ko_KR/appleid.auth.js"></script>
 
 //2.html 코드 입력 
 <a href="https://appleid.apple.com/auth/authorize?client_id={민트앱의 애플 로그인 화면의 client_id}&redirect_uri=https%3A%2F%2Fapi.mint-app.com%2Fapplelogin&response_type=code%20id_token&state={민트앱의 애플 로그인 화면의 state}&scope=name%20email&nonce={randomgenerate_string}&response_mode=form_post&m=12&v=1.5.4" data-color="black" data-border="true" data-type="sign in" target="_blank" rel="opener"> <img src="apple.png"></a>

애플 에서 동일한 url로 리다이렉트 처리되도록 설정되어있기 때문에 팝업은 다르게 처리를 해야된다.
randomgenerate_string : 랜덤하게 생성된 문자열
clientId:민트앱의 애플 로그인 화면의 client_id
scope : name email로 고정하면 됨
redirectURI : https://api.mint-app.com/applelogin 로 고정함
state : 민트앱의 애플 로그인 화면의 state로 고정함

4.애플 로그인 redirect

민트앱의 애플 로그인 설정화면에서 redrect url을 입력한다. 애플로그인이 성공하게 되면 민트앱에서 처리된 결과를 post로 전송해준다.

<?php
    $identifier = $_POST["identifier"];
    $email = $_POST["email"];
    $firstName = $_POST["firstName"];
    $middleName = $_POST["middleName"];
    $lastName = $_POST["lastName"];
    $secret = $_POST["secret"];
    $timestamp = $_POST["timestamp"];
?>

최초 로그인시 하다가 중단하게 되면 이름 데이타를 받지 못할수도 있다.
identifier와 email은 필수로 데이타가 들어간다.
email은 사용자가 숨김처리를 할수가 있기 때문에 이메일을 가지고 회원가입은 약간 어려울수가 있다.
secret는 민트앱의 애플로그인 설정에서 생성된 secret 이다. 이 값으로 유효한 데이타인지 처리 할수 있다.
timestamp는 폼으로 넘어온 시간을 확인할수 있다. 시간이 오래지났거나 잘못된 시간이 오면 무시하면 된다. 시간은 unix-timestamp(ms)로 전송된다

5.민트앱에서 처리

애플로그인 메뉴에서 보면 client ID와 State Key값을 확인할수 있다.

수정하기 버튼을 눌러서 redirect url과 form secret 값을 수정할 수 있다.

Previous소셜로그인 Next소셜로그인 사용법

Last updated 3 years ago

Was this helpful?