Soziale Anmeldung mit Alipay (Native) einrichten

Der offizielle Logto-Connector für die Alipay-Sozialanmeldung in nativen Apps auf mobilen Geräten.

tipp

In diesem Leitfaden gehen wir davon aus, dass du grundlegende Kenntnisse über Logto Connectors hast. Falls nicht, schaue dir den Leitfaden Connectors konfigurieren an, um loszulegen.

Erste Schritte

Der Alipay Native Connector arbeitet eng mit dem Logto SDK auf mobilen Plattformen zusammen. Er nutzt den OAuth 2.0 Authentifizierungsablauf von Alipay und ermöglicht es Alipay-Nutzern, sich mit öffentlichen Alipay-Benutzerprofilen bei anderen Apps anzumelden, ohne einen umständlichen Registrierungsprozess durchlaufen zu müssen.

Alipay-Entwicklerkonto registrieren

Registriere ein Alipay-Entwicklerkonto, falls du noch keines hast.

Alipay-App erstellen und konfigurieren

1. Melde dich mit dem gerade registrierten Konto in der Alipay-Konsole an.
2. Gehe zum Tab "Web & Mobile Apps" (网页&移动应用) im Panel "Meine Anwendung" (我的应用).
3. Klicke auf die Schaltfläche "App erstellen" (立即创建), um mit der Konfiguration deiner Anwendung zu beginnen.
4. Benenne deine Anwendung im Feld "Anwendungsname" (应用名称) gemäß den Namenskonventionen und lade dein "Anwendungssymbol" (应用图标) hoch. Stelle sicher, dass du "mobile Anwendung" (移动应用) als "App-Typ" (应用类型) auswählst. Für den Bau einer iOS-App ist eine eindeutige "Bundle-ID" erforderlich. Außerdem sind "Anwendungssignatur" (应用签名) und "Anwendungspaketname" (应用包名) für Android-Apps erforderlich.
5. Nach dem Erstellen der Anwendung gelangen wir zur Übersichtsseite, wo wir "Fähigkeit hinzufügen" (添加能力) klicken sollten, um "Drittanbieter-Anwendungsautorisierung" (第三方应用授权), "Mitgliederinformationen abrufen" (获取会员信息) und "App Alipay-Login" (App 支付宝登录) hinzuzufügen, bevor wir die Alipay-Anmeldung aktivieren.
6. Gehe zum Alipay-Kundencenter und melde dich mit dem Alipay-Entwicklerkonto an. Klicke auf "Kontozentrum" (账号中心) in der oberen Leiste und gehe zu "APPID-Bindung" (APPID 绑定), deren Eingang sich unten in der Seitenleiste befindet. "Bindung hinzufügen" (添加绑定), indem du die APPID der mobilen Anwendung eingibst, die du gerade in Schritt 4 erstellt hast.
7. Klicke auf die Schaltfläche "Signieren" von "App Alipay-Login" und beende den Signierungsprozess gemäß der Anleitung. Nach Abschluss dieses Schritts sollten die in Schritt 5 hinzugefügten Fähigkeiten aktiviert werden.
8. Kehre zur Alipay Open Platform-Konsole zurück, und du findest "Schnittstellen-Signiermethode" (接口加签方式（密钥/证书）) im Abschnitt "Entwicklungsinformationen" (开发信息). Klicke auf die Schaltfläche "Einrichten" (设置), und du gelangst auf eine Seite zur Einstellung der Signiermethode. "Öffentlicher Schlüssel" (公钥) ist der bevorzugte Signiermodus, und fülle die Inhalte aus der öffentlichen Schlüsseldatei, die du generiert hast, in das Texteingabefeld ein.
9. Richte die "Autorisierungs-Weiterleitungs-URI" (授权回调地址) ein, indem du auf die Schaltfläche "Einrichten" (设置) unten auf der Alipay-Konsole klickst. ${your_logto_origin}/callback/${connector_id} ist die Standard-Weiterleitungs-URI, die im Logto-Kern verwendet wird. Die connector_id findest du in der oberen Leiste der Logto Admin Console Connector-Detailseite.
10. Nachdem du all diese Schritte abgeschlossen hast, gehe zurück zur oberen rechten Ecke der Alipay-Konsole und klicke auf "Zur Überprüfung einreichen" (提交审核). Sobald die Überprüfung genehmigt ist, kannst du mit einem reibungslosen Alipay-Anmeldefluss fortfahren.

ℹ️ Hinweis

Du kannst openssl verwenden, um Schlüsselpaar auf deinem lokalen Rechner zu generieren, indem du den folgenden Code-Schnipsel im Terminal ausführst.

openssl genrsa -out private.pem 2048
openssl rsa -in private.pem -outform PEM -pubout -out public.pem

Beim Ausfüllen des öffentlichen Schlüssels auf der Alipay-App-Einrichtungswebsite musst du den Header und Footer von public.pem entfernen, alle Zeilenumbrüche löschen und den Rest der Inhalte in das Texteingabefeld für "öffentlicher Schlüssel" einfügen.

Logto Alipay Native Connector-Einstellungen einrichten

1. Gehe im Alipay-Konsole-Arbeitsbereich zum Panel "Meine Anwendung" (我的应用) und klicke auf den Tab "Web & Mobile Apps" (网页&移动应用), dort findest du die APPID aller Anwendungen.
2. Im Schritt 7 des vorherigen Teils hast du bereits ein Schlüsselpaar einschließlich eines privaten Schlüssels und eines öffentlichen Schlüssels generiert.
3. Fülle die Logto-Connector-Einstellungen aus:
   • Fülle das appId-Feld mit der APPID aus, die du in Schritt 1 erhalten hast.
   • Fülle das privateKey-Feld mit den Inhalten aus der in Schritt 2 erwähnten privaten Schlüsseldatei aus. Bitte stelle SICHER, dass du '\n' verwendest, um alle Zeilenumbrüche zu ersetzen. Du musst den Header und Footer in der privaten Schlüsseldatei nicht entfernen.
   • Fülle das signType-Feld mit 'RSA2' aus, aufgrund des Öffentlicher Schlüssel-Signiermodus, den wir in Schritt 7 von "Alipay-Apps erstellen und konfigurieren" gewählt haben.

Konfigurationstypen

Name	Typ	Enum-Werte
appId	string	N/A
privateKey	string	N/A
signType	enum string	'RSA' | 'RSA2'

Alipay Native-Anmeldung in deiner App aktivieren

iOS

Wir gehen davon aus, dass du das Logto iOS SDK in deiner App integriert hast. In diesem Fall sind die Dinge ziemlich einfach, und du musst nicht einmal die Alipay SDK-Dokumentation lesen:

1. Füge LogtoSocialPluginAlipay zu deinem Xcode-Projekt hinzu

Füge das Framework hinzu:

ℹ️ Hinweis

Das Plugin enthält das Alipay "Minimalist SDK" (极简版 SDK). Du kannst import AFServiceSDK direkt verwenden, sobald das Plugin importiert ist.

2. Füge das Plugin zu deinen LogtoClient-Init-Optionen hinzu

let logtoClient = LogtoClient(
  useConfig: config,
  socialPlugins: [LogtoSocialPluginAlipay(callbackScheme: "your-scheme")]
)

Dabei ist callbackScheme eines der benutzerdefinierten URL-Schemata, die zu deiner App navigieren können.

Android

Wir gehen davon aus, dass du das Logto Android SDK in deiner App integriert hast. In diesem Fall sind die Dinge ziemlich einfach, und du musst nicht einmal die Alipay SDK-Dokumentation lesen:

1. Lade das Alipay "Minimalist SDK" herunter und füge es deinem Projekt hinzu

Lade das Alipay "Minimalist SDK" (极简版 SDK) von Logto 3rd-party Social SDKs in den app/libs-Ordner deines Projekts herunter:

project-path/app/libs/alipaySdk-15.7.9-20200727142846.aar

2. Füge das Alipay "Minimalist SDK" als Abhängigkeit hinzu

Öffne deine build.gradle-Datei:

project-path/app/build.gradle

Füge die Abhängigkeit hinzu:

dependencies {
  // ...
  implementation(files("./libs/alipaySdk-15.7.9-20200727142846.aar"))  // kotlin-script
  // oder
  implementation files('./libs/alipaySdk-15.7.9-20200727142846.aar')  // groovy-script
}

Alipay Native-Connector testen

Das war's. Vergiss nicht, Sozialen Connector in der Anmeldeerfahrung aktivieren.

Sobald der Alipay Native-Connector aktiviert ist, kannst du deine App erstellen und ausführen, um zu sehen, ob sie funktioniert.

Referenzen

• Alipay-Dokumentation - Zugriffs-Vorbereitung - Wie man eine App erstellt
• Alipay-Dokumentation - Web & Mobile Apps - App erstellen