Astuce rapide: ajoutez une connexion Facebook à votre application Android

La connexion Facebook offre un moyen pratique et sécurisé pour les gens de se connecter à une application sans avoir à passer par un processus d’inscription au préalable. En utilisant la dernière version du SDK de Facebook pour Android, il ne faut que quelques minutes pour ajouter cette fonctionnalité à votre application.

Dans cette astuce rapide, vous apprendrez à ajouter un bouton de connexion Facebook à une application Android et à gérer les événements pour connecter un utilisateur à l’aide de Facebook Login.

Option Premium

Si vous souhaitez une solution rapide pour configurer l’authentification des utilisateurs dans vos applications Android, essayez Système d’authentification Android sur Envato Market. C’est un projet de code source qui permet aux développeurs de créer des inscriptions et des connexions et d’autoriser les utilisateurs pour leur application.

Vous pouvez également trouver Développeurs Android sur Envato Studio pour vous aider dans vos projets.

Conditions préalables

Avant de commencer, assurez-vous d’avoir accès aux éléments suivants:

• la dernière version de Studio Android
• une Facebook Compte

1. Enregistrez votre application

Toutes les applications qui utilisent le SDK Facebook doivent être enregistrées sur Facebook. Connectez-vous au Site Web des développeurs Facebook et cliquez Créer une nouvelle application en haut à droite.

Vous êtes présenté avec un formulaire qui demande les Afficher un nom, Espace de noms, et Catégorie. Entrez les champs requis et cliquez sur Créer un identifiant d’application.

Dans l’écran suivant, vous pouvez voir votre ID d’application. Prenez-en note, car vous en aurez besoin plus tard dans ce didacticiel.

Ouvert Réglages à partir de la gauche et cliquez sur le Ajouter une plateforme bouton. Dans la fenêtre contextuelle, sélectionnez Android.

Dans le formulaire suivant, saisissez le nom du package de votre application et le nom de votre Activity. Si vous n’avez pas créé votre application ou Activity cependant, assurez-vous de vous souvenir des valeurs que vous avez entrées.

Pour remplir le Hashs clés champ, ouvrez une fenêtre de terminal et exécutez le keytool commande pour générer un hachage de clé à l’aide du magasin de clés de débogage situé à ~ / .android / debug.keystore. Voici à quoi devrait ressembler la commande.

keytool -exportcert -alias androiddebugkey -keystore ~/.android/debug.keystore | openssl sha1 -binary | openssl base64

Le mot de passe par défaut du fichier de clés de débogage est Android. Entrez ce mot de passe lorsque vous y êtes invité. La sortie de la commande doit être une chaîne de 28 caractères. Copiez-le, retournez dans votre navigateur et collez la chaîne dans le Hashs clés comme indiqué ci-dessous.

Assure-toi Authentification unique est réglé sur Oui et cliquez sur le Sauvegarder les modifications bouton. Votre application est maintenant enregistrée.

2. Ajouter le SDK Facebook à votre projet

Le SDK Facebook est disponible sur Maven Central. Pour utiliser ce référentiel, modifiez le build.gradle fichier dans votre projet app répertoire et ajoutez-y le code suivant avant la liste des dépendances:

repositories {
    mavenCentral()
}

Vous pouvez maintenant ajouter le SDK Facebook à votre projet en tant que compiler dépendance. Ajoutez le code suivant à la liste des dépendances:

compile 'com.facebook.android:facebook-android-sdk:4.0.0'

3. Créer une activité

Étape 1: définir la disposition

Créez une nouvelle mise en page nommée main_activity.xml dans res / layout. Cela va être une mise en page très simple avec seulement deux widgets:

• une LoginButton pour permettre à l’utilisateur de se connecter à Facebook
• une TextView pour afficher le résultat de la dernière tentative de connexion

Vous pouvez les placer dans un RelativeLayout. Après avoir inclus les attributs de remplissage et de positionnement des widgets, le XML de la mise en page ressemblera à ceci:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent" android:layout_height="match_parent"
    android:padding="16dp"
    >

    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/info"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:textSize="18sp"
        />

    <com.facebook.login.widget.LoginButton
        android:id="@+id/login_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        />

</RelativeLayout>

Étape 2: créer la classe

Créer une nouvelle classe Java qui s’étend Activity et nommez-le MainActivity.java. N’oubliez pas que le nom de cette classe et le package auquel elle appartient doivent correspondre aux valeurs que vous avez saisies lors de l’enregistrement de votre application sur Facebook.

Déclarez les widgets que vous avez définis dans la présentation de l’activité en tant que champs de cette classe.

private TextView info;
private LoginButton loginButton;

Déclarer un CallbackManager comme un autre domaine. le CallbackManager, comme son nom l’indique, permet de gérer les rappels utilisés dans l’application.

private CallbackManager callbackManager;

Le SDK doit être initialisé avant d’utiliser l’une de ses méthodes. Vous pouvez le faire en appelant sdkInitialize et en lui passant le contexte de l’application. Ajoutez le code suivant au onCreate méthode de votre Activity:

FacebookSdk.sdkInitialize(getApplicationContext());

Ensuite, initialisez votre instance de CallbackManager en utilisant le CallbackManager.Factory.create méthode.

callbackManager = CallbackManager.Factory.create();

Appel setContentView pour définir la mise en page définie à l’étape précédente comme mise en page de ce Activity puis utilisez findViewById pour initialiser les widgets.

setContentView(R.layout.main_activity);
info = (TextView)findViewById(R.id.info);
loginButton = (LoginButton)findViewById(R.id.login_button);

Il est temps de créer un rappel pour gérer les résultats des tentatives de connexion et de l’enregistrer avec le CallbackManager. Les rappels personnalisés doivent implémenter FacebookCallback. L’interface dispose de méthodes pour gérer chaque résultat possible d’une tentative de connexion:

• Si la tentative de connexion réussit, onSuccess est appelé.
• Si l’utilisateur annule la tentative de connexion, onCancel est appelé.
• Si une erreur survient, onError est appelé.

Pour enregistrer le rappel personnalisé, utilisez le registerCallback méthode. Le code pour créer et enregistrer le rappel devrait ressembler à ceci:

loginButton.registerCallback(callbackManager, new FacebookCallback<LoginResult>() {
    @Override
    public void onSuccess(LoginResult loginResult) {

    }

    @Override
    public void onCancel() {

    }

    @Override
    public void onError(FacebookException e) {

    }
});

Vous pouvez maintenant ajouter du code à ces méthodes pour afficher les messages appropriés à l’aide du setText méthode de la TextView.

Quand le onSuccess méthode est appelée, un LoginResult est passé en paramètre. Récupérez le jeton d’accès qu’il contient à l’aide de getAccessToken et utilisez son getUserId méthode pour obtenir l’ID de l’utilisateur. Pour obtenir le jeton sous la forme d’un String, utilisation getToken. Affichez ces valeurs dans le TextView en ajoutant le code suivant au onSuccess méthode:

info.setText(
    "User ID: " 
    + loginResult.getAccessToken().getUserId() 
	+ "n" +
    "Auth Token: "
	+ loginResult.getAccessToken().getToken()
);

Si l’utilisateur annule la tentative de connexion, nous affichons un message disant « Tentative de connexion annulée ». Ajoutez le code suivant au onCancel méthode:

info.setText("Login attempt canceled.");

De même, ajoutez le code suivant au onError méthode:

info.setText("Login attempt failed.");

Appuyez sur le bouton de connexion pour lancer un nouveau Activity, qui renvoie un résultat. Pour recevoir et gérer le résultat, remplacez le onActivityResult méthode de votre Activity et transmettez ses paramètres au onActivityResult méthode de CallbackManager.

@Override
protected void onActivityResult(int requestCode, int resultCode, Intent data) {
    callbackManager.onActivityResult(requestCode, resultCode, data);
}

4. Ajouter l’ID d’application Facebook

L’ID d’application que vous avez reçu lors de l’enregistrement de votre application doit être ajouté en tant que chaîne dans votre projet res / values ​​/ strings.xml. Pour ce didacticiel, appelez la chaîne facebook_app_id.

<string name="facebook_app_id">123456908761030</string>

5. Modifier le manifeste

Définissez votre Activity dans le AndroidManifest.xml. Si c’est le premier Activity de votre application, vous devez également ajouter un intent-filter qui répond à l’action android.intent.action.MAIN.

<activity android:name="com.hathy.fblogin.MainActivity">
    <intent-filter>
        <action android:name="android.intent.action.MAIN"/>
        <category android:name="android.intent.category.LAUNCHER"/>
    </intent-filter>
</activity>

Ajoutez l’ID de l’application comme meta-data.

<meta-data android:name="com.facebook.sdk.ApplicationId" 
   android:value="@string/facebook_app_id"/>

Définir FacebookActivity comme un autre Activity qui appartient à votre application. Il gère lui-même la plupart des changements de configuration. Vous devez mentionner que l’utilisation du configChanges attribut.

<activity android:name="com.facebook.FacebookActivity"
  android:configChanges=
         "keyboard|keyboardHidden|screenLayout|screenSize|orientation"
  android:theme="@android:style/Theme.Translucent.NoTitleBar"
  android:label="@string/app_name" />

Enfin, vous devez demander android.permission.INTERNET pour pouvoir se connecter aux serveurs de Facebook.

<uses-permission android:name="android.permission.INTERNET"/>

6. Construire et exécuter

Votre application est maintenant terminée. Lorsque vous le construisez et le déployez sur votre appareil Android, vous verrez le bouton de connexion Facebook.

Appuyez sur le bouton de connexion pour accéder à une page Facebook qui vous demande de vous connecter et d’autoriser l’application.

Une fois la connexion réussie, le TextView affichera l’ID utilisateur et le jeton d’authentification.

Conclusion

Dans cette astuce rapide, vous avez appris à utiliser le SDK Facebook pour ajouter Facebook Login à votre application Android. Vous avez également appris à gérer les résultats possibles d’une tentative de connexion. Pour en savoir plus sur la connexion Facebook, vous pouvez consulter la référence de la SDK Facebook pour Android.