Aller au contenu principal

Configurer la connexion sociale avec Alipay (Native) (Set up social login with Alipay (Native))

Le connecteur officiel Logto pour la connexion sociale Alipay dans les applications natives sur appareils mobiles.

astuce:

Ce guide suppose que vous avez une compréhension de base des Connecteurs Logto. Pour ceux qui ne sont pas familiers, veuillez vous référer au guide des Connecteurs pour commencer.

Commencer

Le connecteur Alipay Native fonctionne en étroite collaboration avec le SDK Logto sur les plateformes mobiles. Il exploite le workflow d’authentification OAuth 2.0 d’Alipay et permet aux utilisateurs Alipay de se connecter à d’autres applications en utilisant leur profil public Alipay sans passer par un processus d’inscription fastidieux.

Enregistrer un compte développeur Alipay

Enregistrez un compte développeur Alipay si vous n’en avez pas encore.

Créer et configurer une application Alipay

  1. Connectez-vous à la console Alipay avec le compte que vous venez de créer.
  2. Allez dans l’onglet "Web & Mobile Apps" (网页&移动应用) du panneau "My Application" (我的应用).
  3. Cliquez sur le bouton "Create an App" (立即创建) pour commencer à configurer votre application.
  4. Nommez votre application dans "Application Name" (应用名称) en respectant les conventions de nommage et téléchargez votre "Application Icon" (应用图标), assurez-vous de choisir "mobile application" (移动应用) comme "App type" (应用类型). Pour la création d’une application iOS, un "Bundle ID" unique est requis. De plus, la "signature de l’application" (应用签名) et le "nom du package de l’application" (应用包名) sont requis pour les applications Android.
  5. Après avoir créé l’application, vous arrivez sur la page d’aperçu, où vous devez cliquer sur "add ability" (添加能力) pour ajouter "Third-party application authorization" (第三方应用授权), "Get member information" (获取会员信息) et "App Alipay login" (App 支付宝登录) avant d’activer la connexion Alipay.
  6. Rendez-vous sur le Centre client Alipay, et connectez-vous avec le compte développeur Alipay. Cliquez sur "Account Center" (账号中心) dans la barre supérieure et allez dans "APPID binding" (APPID 绑定), dont l’entrée se trouve en bas de la barre latérale. "Add binding" (添加绑定) en saisissant l’APPID de l’application mobile que vous venez de créer à l’étape 4.
  7. Cliquez sur le bouton "Sign" de "App Alipay login", et terminez le processus de signature en suivant le guide. Après cette étape, vous devriez voir les capacités ajoutées à l’étape 5 actives.
  8. Revenez à la page de la console de la plateforme ouverte Alipay, et vous trouverez "Interface signing method" (接口加签方式(密钥/证书)) dans la section "development information" (开发信息). Cliquez sur le bouton "set up" (设置), et vous arriverez sur une page de configuration de la méthode de signature. "Public Key" (公钥) est le mode de signature préféré, et remplissez le champ avec le contenu du fichier de clé publique que vous avez généré.
  9. Configurez "Authorization Redirect URI" (授权回调地址) en cliquant sur le bouton "set up" (设置) en bas de la page de la console Alipay. ${your_logto_origin}/callback/${connector_id} est l’URI de redirection par défaut utilisé dans Logto core. Le connector_id se trouve dans la barre supérieure de la page de détails du connecteur dans la console d’administration Logto.
  10. Après avoir terminé toutes ces étapes, retournez dans le coin supérieur droit de la page de la console Alipay et cliquez sur "Submit for review" (提交审核). Une fois la révision approuvée, vous pouvez profiter d’un flux de connexion Alipay fluide.
remarque:

Vous pouvez utiliser openssl pour générer des paires de clés sur votre machine locale en exécutant le code suivant dans le terminal.

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

Lors du remplissage de la clé publique sur le site de configuration de l’application Alipay, vous devez supprimer l’en-tête et le pied de page de public.pem, supprimer tous les retours à la ligne, puis coller le reste du contenu dans le champ de saisie de la "public key".

Configurer les paramètres du connecteur Logto Alipay Native

  1. Dans l’espace de travail de la console Alipay, allez dans le panneau "My application" (我的应用) et cliquez sur l’onglet "Web & Mobile Apps" (网页&移动应用), vous trouverez l’APPID de toutes les applications.
  2. À l’étape 7 de la partie précédente, vous avez déjà généré une paire de clés comprenant une clé privée et une clé publique.
  3. Remplissez les paramètres du connecteur Logto :
    • Remplissez le champ appId avec l’APPID obtenu à l’étape 1.
    • Remplissez le champ privateKey avec le contenu du fichier de clé privée mentionné à l’étape 2. Veuillez VOUS ASSURER d’utiliser '\n' pour remplacer tous les retours à la ligne. Il n’est pas nécessaire de supprimer l’en-tête et le pied de page dans le fichier de clé privée.
    • Remplissez le champ signType avec 'RSA2' en raison du mode de signature Public key choisi à l’étape 7 de "Créer et configurer une application Alipay".

Types de configuration

NomTypeValeurs Enum
appIdstringN/A
privateKeystringN/A
signTypeenum string'RSA' / 'RSA2'

Activer la connexion native Alipay dans votre application

iOS

Nous supposons que vous avez intégré le SDK Logto iOS dans votre application. Dans ce cas, c’est très simple, et vous n’avez même pas besoin de lire la documentation du SDK Alipay :

1. Ajoutez LogtoSocialPluginAlipay à votre projet Xcode

Ajoutez le framework :

Ajouter le framework
remarque:

Le plugin inclut le "minimalist SDK" (极简版 SDK) d’Alipay. Vous pouvez directement utiliser import AFServiceSDK une fois le plugin importé.

2. Ajoutez le plugin aux options d’initialisation de votre LogtoClient

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

callbackScheme est l’un des URL Schemes personnalisés qui peut rediriger vers votre application.

Android

Nous supposons que vous avez intégré le SDK Logto Android dans votre application. Dans ce cas, c’est très simple, et vous n’avez même pas besoin de lire la documentation du SDK Alipay :

1. Téléchargez le "minimalist SDK" d’Alipay et ajoutez-le à votre projet

Téléchargez le "minimalist SDK" d’Alipay (极简版 SDK) depuis Logto 3rd-party Social SDKs dans le dossier app/libs de votre projet :

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

2. Ajoutez le "minimalist SDK" d’Alipay comme dépendance

Ouvrez votre fichier build.gradle :

project-path/app/build.gradle

Ajoutez la dépendance :

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

Tester le connecteur natif Alipay

C’est tout. N’oubliez pas d’activer le connecteur social dans l’inscription et la connexion.

Une fois le connecteur natif Alipay activé, vous pouvez construire et lancer votre application pour vérifier si cela fonctionne.

Références

Docs Alipay - Préparation de l’accès - Comment créer une application

Docs Alipay - Web & Mobile Apps - Créer une application