メインコンテンツまでスキップ

Alipay を使用してソーシャルログインを設定する (ネイティブ)

モバイルデバイスのネイティブアプリでの Alipay ソーシャルサインイン用の公式 Logto コネクター。

ヒント:

このガイドでは、Logto コネクターに関する基本的な知識を持っていることを前提としています。もし持っていない場合は、コネクターの設定 ガイドを参照して始めてください。

はじめに

Alipay ネイティブコネクターは、モバイルプラットフォーム上で Logto SDK と密接に連携します。Alipay の OAuth 2.0 認証 (Authentication) ワークフローを活用し、Alipay ユーザーが面倒な登録プロセスを経ずに公開された Alipay ユーザープロファイルを使用して他のアプリにサインインできるようにします。

Alipay 開発者アカウントを登録する

Alipay 開発者アカウントを登録 します(まだお持ちでない場合)。

Alipay アプリを作成して設定する

  1. Alipay コンソール に、登録したアカウントでサインインします。
  2. 「マイアプリケーション」(我的应用) パネルの「Web & Mobile Apps」(网页&移动应用) タブに移動します。
  3. 「アプリを作成」(立即创建) ボタンをクリックして、アプリケーションの設定を開始します。
  4. 「アプリケーション名」(应用名称) に命名規則に従ってアプリケーション名を入力し、「アプリケーションアイコン」(应用图标) をアップロードします。「アプリタイプ」(应用类型) として「モバイルアプリケーション」(移动应用) を選択してください。iOS アプリを構築する場合は、ユニークな「バンドル ID」が必要です。また、Android アプリには「アプリケーション署名」(应用签名) と「アプリケーションパッケージ名」(应用包名) が必要です。
  5. アプリケーションの作成が完了したら、概要ページに移動し、「能力を追加」(添加能力) をクリックして、「サードパーティアプリケーション認可」(第三方应用授权)、「会員情報の取得」(获取会员信息)、「アプリ Alipay ログイン」(App 支付宝登录) を追加し、Alipay サインインを有効にします。
  6. Alipay カスタマーセンター に移動し、Alipay 開発者アカウントでサインインします。トップバーの「アカウントセンター」(账号中心) をクリックし、サイドバーの下部にある「APPID バインディング」(APPID 绑定) に移動します。ステップ 4 で作成したモバイルアプリケーションの APPID を入力して「バインディングを追加」(添加绑定) します。
  7. 「アプリ Alipay ログイン」の「署名」ボタンをクリックし、ガイドに従って署名プロセスを完了します。このステップが完了すると、ステップ 5 で追加した能力が有効になります。
  8. Alipay オープンプラットフォームコンソールページに戻り、「開発情報」(开发信息) セクションの「インターフェース署名方法」(接口加签方式(密钥/证书)) を見つけます。「設定」(设置) ボタンをクリックすると、署名方法を設定するページに移動します。「公開鍵」(公钥) が推奨される署名モードであり、生成した公開鍵ファイルの内容をテキスト入力ボックスに入力します。
  9. Alipay コンソールページの下部にある「設定」(设置) ボタンをクリックして「認可リダイレクト URI」(授权回调地址) を設定します。${your_logto_origin}/callback/${connector_id} は Logto コアで使用されるデフォルトのリダイレクト URI です。connector_id は Logto 管理コンソールのコネクター詳細ページのトップバーで見つけることができます。
  10. これらのステップをすべて完了したら、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 ネイティブコネクター設定を行う

  1. Alipay コンソールワークスペース に移動し、「マイアプリケーション」(我的应用) パネルで「Web & Mobile Apps」(网页&移动应用) タブをクリックすると、すべてのアプリケーションの APPID を見つけることができます。
  2. 前の部分のステップ 7 で、プライベートキーと公開鍵を含むキーペアをすでに生成しています。
  3. Logto コネクター設定を入力します:
    • ステップ 1 で取得した APPID を appId フィールドに入力します。
    • ステップ 2 で言及したプライベートキーファイルの内容を privateKey フィールドに入力します。すべての改行文字を '\n' に置き換えることを確認してください。プライベートキーファイルのヘッダーとフッターを削除する必要はありません。
    • 「Alipay アプリの作成と設定」のステップ 7 で選択した Public key 署名モードにより、signType フィールドに 'RSA2' を入力します。

設定タイプ

名前タイプ列挙値
appIdstringN/A
privateKeystringN/A
signTypeenum 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 スキーム の 1 つです。

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 ネイティブコネクターが有効になると、アプリをビルドして実行し、動作を確認できます。

参考資料