Snelle tip Facebook-aanmelding aan uw Android-app toevoegen

Facebook Login biedt een handige en veilige manier voor mensen om in te loggen bij een app zonder eerst een aanmeldproces te hoeven doorlopen. Als u de nieuwste versie van de SDK van Facebook voor Android gebruikt, duurt het slechts enkele minuten om deze functie aan uw app toe te voegen.

In deze snelle tip leert u hoe u een Facebook-aanmeldknop toevoegt aan een Android-app en de gebeurtenissen afhandelt om een ​​gebruiker te loggen via Facebook Login.

Premium-optie

Als u een snelle oplossing wilt voor het instellen van gebruikersverificatie in uw Android-apps, probeer dan Android Authentication System op Envato Market. Het is een broncodeproject waarmee ontwikkelaars aanmeldingen en aanmeldingen kunnen maken en gebruikers kunnen autoriseren voor hun app.

Android-verificatiesysteem op Envato Market

U kunt Android-ontwikkelaars ook vinden op Envato Studio om u te helpen met uw projecten. 

Android-ontwikkelaars op Envato Studio

voorwaarden

Zorg voordat u begint dat u toegang heeft tot het volgende:

  • de nieuwste versie van Android Studio
  • een Facebook-account

1. Registreer uw app

Alle apps die de Facebook SDK gebruiken, moeten geregistreerd zijn bij Facebook. Log in op de Facebook Developers-website en klik op Maak een nieuwe app in de rechterbovenhoek.

U krijgt een formulier aangeboden dat naar de app's vraagt Weergavenaam, namespace, en Categorie. Voer de vereiste velden in en klik op Maak een app-ID.

In het volgende scherm kunt u uw Applicatie ID. Noteer het, want je hebt het later nodig in deze tutorial.

Open instellingen van links en klik op de Platform toevoegen knop. Selecteer in de pop-up Android.

Voer in de volgende vorm de pakketnaam van uw app en de naam van uw app in Activiteit. Als u uw app of niet hebt gemaakt Activiteit maar vergeet niet de waarden die je hebt ingevoerd te onthouden.

Om in te vullen Key Hashes veld, open een terminalvenster en voer de belangrijk hulpmiddel commando om een ​​sleutelhash te genereren met behulp van de debug keystore gelokaliseerd op ~ / .Android / debug.keystore. Dit is hoe het commando eruit zou moeten zien.

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

Het standaard wachtwoord voor de debug keystore is android. Voer dat wachtwoord in wanneer daarom wordt gevraagd. De uitvoer van de opdracht moet een reeks van 28 tekens zijn. Kopieer het, ga terug naar uw browser en plak de tekenreeks in de Key Hashes veld zoals hieronder getoond.

Zorg ervoor dat Eenmalig inloggen ingesteld op Ja en klik op de Wijzigingen opslaan knop. Uw app is nu geregistreerd.

2. Voeg Facebook SDK toe aan uw project

De Facebook SDK is beschikbaar op Maven Central. Om deze repository te gebruiken, bewerk de build.gradle bestand in uw project app map en voeg de volgende code toe voordat de lijst met afhankelijkheden:

opslagplaatsen mavenCentral ()

U kunt nu de Facebook SDK aan uw project toevoegen als een compileren afhankelijkheid. Voeg de volgende code toe aan de lijst met afhankelijkheden:

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

3. Maak een activiteit

Stap 1: Definieer de lay-out

Maak een nieuwe lay-out met de naam main_activity.xml in res / layout. Dit wordt een heel eenvoudige lay-out met slechts twee widgets:

  • een LoginButton om de gebruiker toe te staan ​​om in te loggen op Facebook
  • een Tekstweergave om het resultaat van de laatste inlogpoging weer te geven

Je kunt ze in een Relatieve layout. Na het opnemen van attributen voor opvulling en positionering van de widgets, ziet de XML van de lay-out er ongeveer zo uit:

    

Stap 2: Maak de klas

Maak een nieuwe Java-klasse die wordt uitgebreid Activiteit en noem het MainActivity.java. Onthoud dat de naam van deze klasse en het pakket waartoe het behoort, overeenkomen met de waarden die je hebt ingevoerd tijdens het registreren van je app met Facebook.

Verklaar de widgets die u hebt gedefinieerd in de lay-out van de activiteit als velden van deze klasse.

privé TextView-info; privé LoginButton loginButton;

Verklaren a CallbackManager als een ander veld. De CallbackManager, zoals de naam al doet vermoeden, wordt gebruikt om de callbacks te beheren die in de app worden gebruikt.

private CallbackManager callbackManager;

De SDK moet worden geïnitialiseerd voordat een van de methoden wordt gebruikt. U kunt dit doen door te bellen sdkInitialize en de context van de toepassing doorgeven. Voeg de volgende code toe aan de onCreate methode van uw Activiteit:

FacebookSdk.sdkInitialize (getApplicationContext ());

Initialiseer vervolgens uw exemplaar van CallbackManager de ... gebruiken CallbackManager.Factory.create methode.

callbackManager = CallbackManager.Factory.create ();

telefoontje setContentView om de lay-out die in de vorige stap is gedefinieerd in te stellen als de lay-out hiervan Activiteit en gebruik dan findViewById om de widgets te initialiseren.

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

Het is tijd om een ​​callback te creëren om de resultaten van de inlogpogingen te verwerken en deze te registreren bij de CallbackManager. Aangepaste callbacks moeten worden geïmplementeerd FacebookCallback. De interface heeft methoden om elk mogelijk resultaat van een inlogpoging te behandelen:

  • Als de inlogpoging is gelukt, onSuccess wordt genoemd.
  • Als de gebruiker de inlogpoging annuleert, onCancel wordt genoemd.
  • Als er een fout optreedt, OnError wordt genoemd.

Om de aangepaste callback te registreren, gebruikt u de registerCallback methode. De code voor het maken en registreren van de callback zou er als volgt uit moeten zien:

loginButton.registerCallback (callbackManager, nieuwe FacebookCallback() @Override public void onSuccess (LoginResult loginResult)  @Override public void onCancel ()  @Override public void onError (FacebookException e) );

U kunt nu code aan deze methoden toevoegen om de juiste berichten weer te geven met behulp van de setText methode van de Tekstweergave.

Wanneer de onSuccess methode wordt genoemd, a LoginResult wordt doorgegeven als een parameter. Haal het toegangstoken op dat het bevat met getAccessToken en gebruik de getUserId methode om de ID van de gebruiker te krijgen. Om het token in de vorm van een te krijgen Draad, gebruik getToken. Toon deze waarden in de Tekstweergave door de volgende code toe te voegen aan de onSuccess methode:

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

Als de gebruiker de aanmeldingspoging annuleert, wordt het bericht 'Aanmeldingspoging geannuleerd' weergegeven. Voeg de volgende code toe aan de onCancel methode:

info.setText ("Aanmeldingspoging geannuleerd.");

Voeg op dezelfde manier de volgende code toe aan de OnError methode:

info.setText ("Aanmeldpoging mislukt.");

Als u op de aanmeldknop tikt, wordt er een nieuw gestart Activiteit, die een resultaat oplevert. Als u het resultaat wilt ontvangen en verwerken, overschrijft u het onActivityResult methode van uw Activiteit en geeft de parameters door aan de onActivityResult methode van CallbackManager.

@Override beschermde leegte onActivityResult (int requestCode, int resultCode, Intent-gegevens) callbackManager.onActivityResult (requestCode, resultCode, data); 

4. Voeg de Facebook-applicatie-ID toe

De app-ID die u heeft ontvangen toen u uw app registreerde, moet worden toegevoegd als een draad in je project res / waarden / strings.xml. Bel voor deze zelfstudie de tekenreeks facebook_app_id.

123456908761030

5. Bewerk het manifest

Bepaal uw Activiteit in de AndroidManifest.xml. Als het de eerste is Activiteit van uw app, moet u ook een toevoegen intent-filter die reageert op de actie android.intent.action.MAIN.

     

Voeg de applicatie-ID toe als meta-data.

Bepalen FacebookActivity als een ander Activiteit die bij je app hoort. Het behandelt de meeste configuratiewijzigingen zelf. U moet vermelden dat het gebruik van de configChanges attribuut.

Eindelijk, je moet vragen android.permission.INTERNET om verbinding te kunnen maken met de servers van Facebook.

6. Build and Run

Uw app is nu voltooid. Wanneer u het bouwt en implementeert op uw Android-apparaat, ziet u de Facebook-aanmeldknop.

Tik op de login-knop om naar een Facebook-pagina te gaan waarin je wordt gevraagd om in te loggen en de app te autoriseren.

Na het succesvol aanmelden, de Tekstweergave toont de gebruikers-ID en auth token.

Conclusie

In deze snelle tip heb je geleerd hoe je de Facebook SDK kunt gebruiken om Facebook Login toe te voegen aan je Android-app. Je hebt ook geleerd hoe om te gaan met de mogelijke uitkomsten van een inlogpoging. Voor meer informatie over Facebook Login, kunt u de referentie voor de Facebook SDK voor Android doornemen.