Alipay 소셜 로그인을 설정하세요 (Native)
모바일 기기 네이티브 앱에서 Alipay 소셜 로그인을 위한 공식 Logto 커넥터입니다.
이 가이드는 Logto 커넥터에 대한 기본적인 이해를 전제로 합니다. 익숙하지 않은 분들은 커넥터 가이드를 참조하여 시작하세요.
시작하기
Alipay Native 커넥터는 모바일 플랫폼에서 Logto SDK와 긴밀하게 작동합니다. Alipay의 OAuth 2.0 인증 (Authentication) 워크플로우를 활용하여, 사용자가 번거로운 회원가입 과정 없이 공개 Alipay 사용자 프로필을 사용해 다른 앱에 로그인할 수 있도록 합니다.
Alipay 개발자 계정 등록하기
Alipay 개발자 계정 등록을 아직 하지 않았다면 진행하세요.
Alipay 앱 생성 및 구성하기
- Alipay 콘솔에 방금 등록한 계정으로 로그인하세요.
- "내 애플리케이션" (我的应用) 패널의 "웹 & 모바일 앱" (网页&移动应用) 탭으로 이동하세요.
- "앱 생성" (立即创建) 버튼을 클릭하여 애플리케이션 구성을 시작하세요.
- "애플리케이션 이름" (应用名称)에 명명 규칙에 따라 이름을 입력하고, "애플리케이션 아이콘" (应用图标)을 업로드하세요. "앱 유형" (应用类型)으로 "모바일 애플리케이션" (移动应用)을 선택해야 합니다. iOS 앱을 빌드할 경우 고유한 "Bundle ID"가 필요합니다. 또한, Android 앱의 경우 "애플리케이션 서명" (应用签名)과 "애플리케이션 패키지명" (应用包名)이 필요합니다.
- 애플리케이션 생성이 완료되면, 개요 페이지로 이동합니다. 여기서 "기능 추가" (添加能力)를 클릭하여 "제3자 애플리케이션 인가" (第三方应用授权), "회원 정보 가져오기" (获取会员信息), "App Alipay 로그인" (App 支付宝登录)을 추가한 후 Alipay 로그인을 활성화하세요.
- Alipay 고객센터로 이동하여 Alipay 개발자 계정으로 로그인하세요. 상단바에서 "계정 센터" (账号中心)를 클릭하고, 사이드바 하단에서 "APPID 바인딩" (APPID 绑定)으로 이동하세요. 4단계에서 생성한 모바일 애플리케이션의 APPID를 입력하여 "바인딩 추가" (添加绑定)를 진행하세요.
- "App Alipay 로그인"의 "서명" 버튼을 클릭하고 안내에 따라 서명 과정을 완료하세요. 이 단계가 끝나면 5단계에서 추가한 기능들이 활성화된 것을 확인할 수 있습니다.
- Alipay 오픈 플랫폼 콘솔 페이지로 돌아가 "개발 정보" (开发信息) 섹션에서 "인터페이스 서명 방식" (接口加签方式（密钥/证书）)을 찾으세요. "설정" (设置) 버튼을 클릭하면 서명 방식을 설정하는 페이지로 이동합니다. "공개키" (公钥)가 권장 서명 모드이며, 생성한 공개키 파일의 내용을 입력란에 붙여넣으세요.
- Alipay 콘솔 페이지 하단의 "설정" (设置) 버튼을 클릭하여 "인가 리디렉션 URI" (授权回调地址)를 설정하세요.
${your_logto_origin}/callback/${connector_id}가 Logto 코어에서 사용하는 기본 리디렉션 URI입니다.connector_id는 Logto Admin Console 커넥터 상세 페이지 상단에서 확인할 수 있습니다. - 모든 단계를 완료한 후, Alipay 콘솔 페이지 우측 상단에서 "검토 제출" (提交审核)을 클릭하세요. 검토가 승인되면 원활한 Alipay 로그인 플로우를 사용할 수 있습니다.
다음 코드 스니펫을 터미널에서 실행하여 openssl로 로컬에서 키 쌍을 생성할 수 있습니다.
openssl genrsa -out private.pem 2048
openssl rsa -in private.pem -outform PEM -pubout -out public.pem
Alipay 앱 설정 웹사이트에서 공개키를 입력할 때는 public.pem의 헤더와 푸터를 제거하고, 모든 줄바꿈 문자를 삭제한 뒤 나머지 내용을 "공개키" 입력란에 붙여넣어야 합니다.
Logto Alipay Native 커넥터 설정하기
- Alipay 콘솔 작업공간에서 "내 애플리케이션" (我的应用) 패널로 이동한 뒤 "웹 & 모바일 앱" (网页&移动应用) 탭을 클릭하면 모든 애플리케이션의 APPID를 확인할 수 있습니다.
- 앞선 7단계에서 이미 개인키와 공개키를 포함한 키 쌍을 생성했습니다.
- Logto 커넥터 설정을 입력하세요:
- 1단계에서 얻은 APPID를
appId필드에 입력하세요. - 2단계에서 생성한 개인키 파일의 내용을
privateKey필드에 입력하세요. 반드시 모든 줄바꿈 문자를 '\n'으로 대체해야 합니다. 개인키 파일의 헤더와 푸터는 제거할 필요가 없습니다. - "Create And Configure Alipay Apps"의 7단계에서 선택한
Public key서명 모드에 따라signType필드에는 'RSA2'를 입력하세요.
- 1단계에서 얻은 APPID를
설정 타입
| Name | Type | Enum values |
|---|---|---|
| appId | string | N/A |
| privateKey | string | N/A |
| signType | enum string | 'RSA' / 'RSA2' |
앱에서 Alipay 네이티브 로그인 활성화하기
iOS
앱에 Logto iOS SDK를 통합했다고 가정합니다. 이 경우 매우 간단하며, Alipay SDK 문서를 따로 읽을 필요도 없습니다:
1. LogtoSocialPluginAlipay를 Xcode 프로젝트에 추가하세요
프레임워크를 추가하세요:
이 플러그인에는 Alipay "미니멀리스트 SDK" (极简版 SDK)가 포함되어 있습니다. 플러그인을 임포트한 후 바로 import AFServiceSDK를 사용할 수 있습니다.
2. 플러그인을 LogtoClient 초기화 옵션에 추가하세요
let logtoClient = LogtoClient(
useConfig: config,
socialPlugins: [LogtoSocialPluginAlipay(callbackScheme: "your-scheme")]
)
여기서 callbackScheme은 앱으로 이동할 수 있는 커스텀 URL 스킴 중 하나입니다.
Android
앱에 Logto Android SDK를 통합했다고 가정합니다. 이 경우 매우 간단하며, Alipay SDK 문서를 따로 읽을 필요도 없습니다:
1. Alipay "미니멀리스트 SDK"를 다운로드하여 프로젝트에 추가하세요
Logto 3rd-party Social SDKs에서 Alipay "미니멀리스트 SDK" (极简版 SDK)를 다운로드하여 프로젝트의 app/libs 폴더에 넣으세요:
project-path/app/libs/alipaySdk-15.7.9-20200727142846.aar
2. Alipay "미니멀리스트 SDK"를 의존성으로 추가하세요
build.gradle 파일을 여세요:
project-path/app/build.gradle
의존성을 추가하세요:
dependencies {
// ...
implementation(files("./libs/alipaySdk-15.7.9-20200727142846.aar")) // kotlin-script
// 또는
implementation files('./libs/alipaySdk-15.7.9-20200727142846.aar') // groovy-script
}
Alipay 네이티브 커넥터 테스트하기
이제 끝입니다. 회원가입 및 로그인에서 소셜 커넥터 활성화를 잊지 마세요.
Alipay 네이티브 커넥터가 활성화되면, 앱을 빌드하고 실행하여 정상 동작하는지 확인할 수 있습니다.