Logto est une alternative à Auth0 conçue pour les applications modernes et les produits SaaS. Il offre des services à la fois Cloud et Open-source pour vous aider à lancer rapidement votre système de gestion des identités et des accès (IAM). Profitez de l'authentification, de l'autorisation et de la gestion multi-locataires tout-en-un.
Nous recommandons de commencer avec un locataire de développement gratuit sur Logto Cloud. Cela vous permet d'explorer facilement toutes les fonctionnalités.
Dans cet article, nous allons parcourir les étapes pour construire rapidement l'expérience de connexion KOOK (authentification utilisateur) avec Android (Kotlin / Java) et Logto.
Prérequis
- Une instance Logto en cours d'exécution. Consultez la page d'introduction pour commencer.
- Connaissance de base de Android (Kotlin / Java).
- Un compte KOOK utilisable.
Créer une application dans Logto
Logto est basé sur l'authentification OpenID Connect (OIDC) et l'autorisation OAuth 2.0. Il prend en charge la gestion des identités fédérées à travers plusieurs applications, communément appelée authentification unique (SSO).
Pour créer votre application Application native, suivez simplement ces étapes :
- Ouvrez la Logto Console. Dans la section "Get started", cliquez sur le lien "View all" pour ouvrir la liste des frameworks d'application. Alternativement, vous pouvez naviguer vers Logto Console > Applications, et cliquer sur le bouton "Create application".
- Dans la fenêtre modale qui s'ouvre, cliquez sur la section "Application native" ou filtrez tous les frameworks "Application native" disponibles en utilisant les cases à cocher de filtre rapide à gauche. Cliquez sur la carte du framework "Android" pour commencer à créer votre application.
- Entrez le nom de l'application, par exemple, "Bookstore", et cliquez sur "Create application".
🎉 Ta-da ! Vous venez de créer votre première application dans Logto. Vous verrez une page de félicitations qui inclut un guide d'intégration détaillé. Suivez le guide pour voir quelle sera l'expérience dans votre application.
Intégrer le SDK Android
- L'exemple est basé sur le système View et le modèle View, mais les concepts sont les mêmes lors de l'utilisation de Jetpack Compose.
- L'exemple est écrit en Kotlin, mais les concepts sont les mêmes pour Java.
- Les projets d'exemple en Kotlin et en Java sont disponibles sur notre répertoire SDK.
- La vidéo tutorielle est disponible sur notre chaîne YouTube.
Installation
Le niveau minimum d'API Android pris en charge par le SDK Logto Android est le niveau 24.
Le SDK Logto Android existe en deux versions principales :
- v3 : Ouvre l'expérience de connexion dans les Chrome Custom Tabs (le navigateur système), ce qui permet la connexion par passkey et partage la session du navigateur. Notez que la v3 supprime la prise en charge des connecteurs WeChat (Native) et Alipay (Native) ; vous pouvez utiliser à la place WeChat (Web) et Alipay (Web), qui fonctionnent via le navigateur. Si vous dépendez des connecteurs natifs, restez sur la v2.
- v2 : Ouvre l'expérience de connexion dans un WebView intégré, ce qui est requis par les connecteurs sociaux natifs, mais ne prend pas en charge la connexion par passkey (WebView ne prend pas en charge WebAuthn, la norme sous-jacente des passkeys).
Ce guide couvre les deux versions. Choisissez votre version dans les onglets ci-dessous, et ce choix sera synchronisé tout au long de ce guide.
Avant d'installer le SDK Logto Android, assurez-vous que mavenCentral() est ajouté à la configuration de votre dépôt dans le fichier de build Gradle du projet :
dependencyResolutionManagement {
repositories {
mavenCentral()
}
}
Ajoutez le SDK Logto Android à vos dépendances :
- v3
- v2
Utilisez la dernière version v3 comme version :
- Kotlin
- Groovy
dependencies {
implementation("io.logto.sdk:android:3.0.0")
}
dependencies {
implementation 'io.logto.sdk:android:3.0.0'
}
- Kotlin
- Groovy
dependencies {
implementation("io.logto.sdk:android:2.0.3")
}
dependencies {
implementation 'io.logto.sdk:android:2.0.3'
}
Comme le SDK a besoin d'un accès à Internet, vous devez ajouter la permission suivante à votre fichier AndroidManifest.xml :
<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools">
<!-- ajouter la permission internet -->
<uses-permission android:name="android.permission.INTERNET" />
<!-- autres configurations... -->
</manifest>
Init LogtoClient
Créez un LogtoViewModel.kt et initialisez LogtoClient dans ce modèle de vue :
//...avec d'autres imports
import io.logto.sdk.android.LogtoClient
import io.logto.sdk.android.type.LogtoConfig
class LogtoViewModel(application: Application) : AndroidViewModel(application) {
private val logtoConfig = LogtoConfig(
endpoint = "<votre-point-de-terminaison-logto>",
appId = "<votre-id-app>",
scopes = null,
resources = null,
usingPersistStorage = true,
)
private val logtoClient = LogtoClient(logtoConfig, application)
companion object {
val Factory: ViewModelProvider.Factory = object : ViewModelProvider.Factory {
@Suppress("UNCHECKED_CAST")
override fun <T : ViewModel> create(
modelClass: Class<T>,
extras: CreationExtras
): T {
// Obtenez l'objet Application à partir des extras
val application = checkNotNull(extras[APPLICATION_KEY])
return LogtoViewModel(application) as T
}
}
}
}
ensuite, créez un LogtoViewModel pour votre MainActivity.kt :
//...avec d'autres imports
class MainActivity : AppCompatActivity() {
private val logtoViewModel: LogtoViewModel by viewModels { LogtoViewModel.Factory }
//...autres codes
}
Configurer l'URI de redirection
Passons à la page des détails de l'application de Logto Console. Ajoutez une URI de redirection io.logto.android://io.logto.sample/callback et cliquez sur "Enregistrer les modifications".
Implémenter la connexion et la déconnexion
Avant d'appeler logtoClient.signIn, assurez-vous d'avoir correctement configuré l'URI de redirection dans la console d'administration.
Vous pouvez utiliser logtoClient.signIn pour connecter l'utilisateur et logtoClient.signOut pour le déconnecter.
- v3
- v2
En v3, logtoClient.signOut effectue une déconnexion complète : il efface les identifiants locaux, révoque le jeton de rafraîchissement et termine la session Logto en ouvrant le point de terminaison de fin de session dans le navigateur. Le navigateur revient ensuite à votre application via l’URI de redirection post-déconnexion. Avant de l'utiliser, rendez-vous sur la page de détails de l'application dans Logto Console, ajoutez l’URI de redirection post-déconnexion io.logto.android://io.logto.sample/callback et cliquez sur "Enregistrer les modifications". L’URI de redirection post-déconnexion suit le même schéma que l’URI de redirection, et son schéma doit également correspondre au placeholder de manifeste logtoRedirectScheme.
Par exemple, dans une application Android :
//...avec d'autres imports
class LogtoViewModel(application: Application) : AndroidViewModel(application) {
// ...autres codes
// Ajoutez un live data pour observer le statut d'authentification
private val _authenticated = MutableLiveData(logtoClient.isAuthenticated)
val authenticated: LiveData<Boolean>
get() = _authenticated
fun signIn(context: Activity) {
logtoClient.signIn(context, "io.logto.android://io.logto.sample/callback") { logtoException ->
logtoException?.let { println(it) }
// Met à jour le live data
_authenticated.postValue(logtoClient.isAuthenticated)
}
}
fun signOut(context: Activity) {
logtoClient.signOut(context, "io.logto.android://io.logto.sample/callback") { logtoException ->
logtoException?.let { println(it) }
// Met à jour le live data
_authenticated.postValue(logtoClient.isAuthenticated)
}
}
}
Appelez ensuite les méthodes signIn et signOut dans votre activité :
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
//...autres codes
// Supposons que vous ayez un bouton avec l'id "sign_in_button" dans votre layout
val signInButton = findViewById<Button>(R.id.sign_in_button)
signInButton.setOnClickListener {
logtoViewModel.signIn(this)
}
// Supposons que vous ayez un bouton avec l'id "sign_out_button" dans votre layout
val signOutButton = findViewById<Button>(R.id.sign_out_button)
signOutButton.setOnClickListener {
if (logtoViewModel.authenticated) { // Vérifie si l'utilisateur est authentifié
logtoViewModel.signOut(this)
}
}
// Observez le statut d'authentification pour mettre à jour l'UI
logtoViewModel.authenticated.observe(this) { authenticated ->
if (authenticated) {
// L'utilisateur est authentifié
signInButton.visibility = View.GONE
signOutButton.visibility = View.VISIBLE
} else {
// L'utilisateur n'est pas authentifié
signInButton.visibility = View.VISIBLE
signOutButton.visibility = View.GONE
}
}
}
}
- Vous pouvez également appeler
logtoClient.signOut(context)sans URI de redirection post-déconnexion. Aucune configuration Console n'est nécessaire dans ce cas : le navigateur affiche la page de déconnexion Logto, et l'utilisateur revient à l'application en la fermant manuellement. - Si aucun contexte UI n'est disponible, vous pouvez appeler
logtoClient.clearCredentialspour effacer les identifiants locaux et révoquer le jeton de rafraîchissement. Notez que cela conserve la session Logto dans le navigateur, donc la prochainesignInpeut reconnecter l'utilisateur silencieusement via cette session.
Par exemple, dans une application Android :
//...avec d'autres imports
class LogtoViewModel(application: Application) : AndroidViewModel(application) {
// ...autres codes
// Ajoutez un live data pour observer le statut d'authentification
private val _authenticated = MutableLiveData(logtoClient.isAuthenticated)
val authenticated: LiveData<Boolean>
get() = _authenticated
fun signIn(context: Activity) {
logtoClient.signIn(context, "io.logto.android://io.logto.sample/callback") { logtoException ->
logtoException?.let { println(it) }
// Met à jour le live data
_authenticated.postValue(logtoClient.isAuthenticated)
}
}
fun signOut() {
logtoClient.signOut { logtoException ->
logtoException?.let { println(it) }
// Met à jour le live data
_authenticated.postValue(logtoClient.isAuthenticated)
}
}
}
Appelez ensuite les méthodes signIn et signOut dans votre activité :
class MainActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
//...autres codes
// Supposons que vous ayez un bouton avec l'id "sign_in_button" dans votre layout
val signInButton = findViewById<Button>(R.id.sign_in_button)
signInButton.setOnClickListener {
logtoViewModel.signIn(this)
}
// Supposons que vous ayez un bouton avec l'id "sign_out_button" dans votre layout
val signOutButton = findViewById<Button>(R.id.sign_out_button)
signOutButton.setOnClickListener {
if (logtoViewModel.authenticated) { // Vérifie si l'utilisateur est authentifié
logtoViewModel.signOut()
}
}
// Observez le statut d'authentification pour mettre à jour l'UI
logtoViewModel.authenticated.observe(this) { authenticated ->
if (authenticated) {
// L'utilisateur est authentifié
signInButton.visibility = View.GONE
signOutButton.visibility = View.VISIBLE
} else {
// L'utilisateur n'est pas authentifié
signInButton.visibility = View.VISIBLE
signOutButton.visibility = View.GONE
}
}
}
}
Point de contrôle : Testez votre application
Maintenant, vous pouvez tester votre application :
- Exécutez votre application, vous verrez le bouton de connexion.
- Cliquez sur le bouton de connexion, le SDK initiera le processus de connexion et vous redirigera vers la page de connexion Logto.
- Après vous être connecté, vous serez redirigé vers votre application et verrez le bouton de déconnexion.
- Cliquez sur le bouton de déconnexion pour effacer le stockage des jetons et vous déconnecter.
Ajouter le connecteur KOOK
Pour activer une connexion rapide et améliorer la conversion des utilisateurs, connectez-vous avec Android en tant que fournisseur d’identité (IdP). Le connecteur social Logto vous aide à établir cette connexion en quelques minutes en permettant plusieurs entrées de paramètres.
Pour ajouter un connecteur social, suivez simplement ces étapes :
- Accédez à Console > Connectors > Social Connectors.
- Cliquez sur "Add social connector" et sélectionnez "KOOK".
- Suivez le guide README et complétez les champs requis et personnalisez les paramètres.
Si vous suivez le guide du connecteur sur place, vous pouvez passer à la section suivante.
Configurer KOOK OAuth app
Créer une application dans le Centre développeur KOOK
Conseil : Vous pouvez ignorer certaines sections si vous les avez déjà terminées.
Vous devez demander l'autorisation OAuth2 de KOOK avant de créer une application OAuth2. Veuillez consulter les informations sur la page OAuth2 ou demander plus d'informations au personnel de KOOK sur le serveur officiel développeur KOOK.
- Rendez-vous sur le Centre développeur KOOK et connectez-vous avec votre compte KOOK. Vous pouvez créer un nouveau compte si vous n'en avez pas.
- Cliquez sur le bouton Créer une application pour créer une application, choisissez un nom (par exemple, LogtoAuth) et cliquez sur Confirmer.
- Cliquez sur l'icône de l'application que vous avez créée, puis allez sur la page OAuth2.
- Ajoutez les redirections valides (par exemple,
${your_logto_origin}/callback/${connector_id}) dans le champ Callback URIs. Vous pouvez trouver l'URI de redirection sur la page des détails du connecteur dans la console d'administration Logto. - N'oubliez pas de cocher la portée get_user_info dans le générateur de lien OAuth2.
Configurer votre connecteur KOOK
Renseignez les champs clientId et clientSecret avec le Client ID et le Client Secret obtenus sur la page OAuth2 mentionnée dans la section précédente.
Types de configuration
| Nom | Type |
|---|---|
| clientId | string |
| clientSecret | string |
| scope | string |
Tester le connecteur KOOK
C'est tout. Le connecteur KOOK devrait maintenant être disponible. N'oubliez pas d'activer le connecteur pour l'inscription et la connexion.
Enregistrer votre configuration
Vérifiez que vous avez rempli les valeurs nécessaires dans la zone de configuration du connecteur Logto. Cliquez sur "Enregistrer et terminer" (ou "Enregistrer les modifications") et le connecteur KOOK devrait être disponible maintenant.
Activer le connecteur KOOK dans l'Expérience de connexion
Une fois que vous avez créé un connecteur social avec succès, vous pouvez l'activer en tant que bouton "Continuer avec KOOK" dans l'Expérience de connexion.
- Accédez à Console > Expérience de connexion > Inscription et connexion.
- (Facultatif) Choisissez "Non applicable" pour l'identifiant d'inscription si vous avez besoin uniquement de la connexion sociale.
- Ajoutez le connecteur KOOK configuré à la section "Connexion sociale".
Tests et validation
Retournez à votre application Android (Kotlin / Java). Vous devriez maintenant pouvoir vous connecter avec KOOK. Profitez-en !
Lectures complémentaires
Flux des utilisateurs finaux : Logto fournit des flux d'authentification prêts à l'emploi, y compris l'authentification multi-facteurs (MFA) et le SSO d’entreprise, ainsi que des API puissantes pour une mise en œuvre flexible des paramètres de compte, de la vérification de sécurité et de l'expérience multi-locataire.
Autorisation : L'autorisation définit les actions qu'un utilisateur peut effectuer ou les ressources auxquelles il peut accéder après avoir été authentifié. Découvrez comment protéger votre API pour les applications natives et monopages et mettre en œuvre le contrôle d’accès basé sur les rôles (RBAC).
Organisations : Particulièrement efficace dans les applications SaaS multi-locataires et B2B, la fonctionnalité d'organisation permet la création de locataires, la gestion des membres, le RBAC au niveau de l'organisation et l'approvisionnement juste-à-temps.
Série IAM client : Nos articles de blog en série sur la gestion des identités et des accès des clients (ou consommateurs), des sujets de base aux sujets avancés et au-delà.