Hinzufügen von 2FA zu einer Android-App mit Nexmo und Firebase Login
Lesedauer: 7 Minuten
Die Firebase Auth Schnellstart bietet eine großartige Anleitung zum Hinzufügen von Authentifizierung zu Ihrer Anwendung, aber ohne Zwei-Faktor-Authentifizierung (2FA) ist es ein bisschen unsicher! Mit dem Nexmo Verify SDK ist es ganz einfach, eine zusätzliche Sicherheitsebene zu Ihrer Applikation hinzuzufügen. Lassen Sie uns anfangen!
Beginnen Sie mit dem Klonen des GitHub-Projektarchivs in Ihrem Terminal. Das ursprüngliche Repo ändert sich ständig, daher können Sie den Startzweig für das Tutorial von einem geforkten Repo von nexmo-community klonen.
Um dieses Tutorial durchzuführen, benötigen Sie ein Vonage API-Konto. Wenn Sie noch keines haben, können Sie sich noch heute anmelden und mit einem kostenlosen Guthaben beginnen. Sobald Sie ein Konto haben, finden Sie Ihren API-Schlüssel und Ihr API-Geheimnis oben auf dem Vonage-API-Dashboard.
In diesem Lernprogramm wird auch eine virtuelle Telefonnummer verwendet. Um eine zu erwerben, gehen Sie zu Rufnummern > Rufnummern kaufen und suchen Sie nach einer Nummer, die Ihren Anforderungen entspricht.
Melden Sie sich bei Firebase mit Ihrem Google Account an und rufen Sie die Konsole auf. Erstellen Sie ein neues Projekt, indem Sie ihm einen Namen geben und das Land, in dem Sie wohnen, aktualisieren. Sobald es erstellt ist, klicken Sie auf die Option "Firebase zu Ihrer Android-App hinzufügen". Geben Sie Ihren Paketnamen (Standard für die Demo-App ist: com.google.firebase.quickstart.auth) und das Debug-Signatur-Zertifikat SHA-1. Ignorieren Sie die heruntergeladene Datei "google-services.json", da Sie eine neue Version herunterladen müssen, sobald wir die OAuth-Anmeldemethoden zur App hinzufügen. Sie brauchen die build.gradle-Dateien nicht zu bearbeiten, da dies bereits im Beispielprojekt für Sie erledigt wurde.
Die Beispielanwendung verfügt über die folgenden Anmeldemethoden: E-Mail/Passwort-Anmeldung, anonyme Anmeldung und OAuth-Anmeldungen. Beide OAuth-Anbieter (Google und Twitter) müssen eingerichtet werden und der Twitter Sign In API-Schlüssel/Geheimnis sollte in "ids.xml" eingegeben werden. Wenn Sie Probleme haben, diese Datei zu finden, suchen Sie sie mit dem Suchwerkzeug in der oberen rechten Ecke von Android Studio. Sobald die Authentifizierungsmethoden eingerichtet sind, navigieren Sie zu Ihren Projekteinstellungen, laden Sie die Datei "google-services.json" herunter und fügen Sie sie dem App-Ordner in der Projektansicht hinzu.
E-Mail & Anonyme Anmeldung: Aktivieren Sie beide Methoden im Abschnitt Authentifizierung der Firebase-Konsole.
Google: Google Sign In sollte für Ihre Android-App eingerichtet werden, nachdem Sie das Debug SHA-1 Signierzertifikat in der Firebase-Konsole hinzugefügt haben. Aktivieren Sie die Google OAuth-Methode im Abschnitt Authentifizierung der Konsole.
Twitter: Aktivieren Sie in der Firebase-Konsole Twitter für die Authentifizierung. Erstellen Sie anschließend eine neue Anwendung im Twitter-Entwicklerportal. Kopieren Sie die Callback-URL (verfügbar im Abschnitt "Twitter-Authentifizierung" der Firebase-Konsole) und geben Sie sie in das entsprechende Feld ein, um die Erstellung der Twitter-Anwendung abzuschließen. Gehen Sie abschließend zu den Twitter-Anwendungseinstellungen und klicken Sie auf "Schlüssel und Zugriffstoken verwalten". Kopieren Sie den Verbraucherschlüssel (API Key) und das Verbrauchergeheimnis (API Secret) in die Firebase-Konsole und in die Datei "ids.xml".
Wählen Sie in Android Studio die Option zum Öffnen eines bestehenden Projekts. Navigieren Sie zu dem Ort, an dem das Repository geklont wurde, und wählen Sie den Ordner "auth" im Ordner "quickstart-android". Sie müssen das Android SDK auf Version 25 und die Build-Tools auf Version 25.0.0 aktualisieren. Außerdem müssen Sie die JDK-Version auf 1.8 aktualisieren, da Sie diese Updates benötigen, um die gradle-Dateien erfolgreich zu kompilieren. Sobald das Projekt in Android Studio geladen ist, installieren Sie alle fehlenden Abhängigkeiten und synchronisieren Sie das Projekt, um Fehler zu beseitigen. Erstellen Sie eine AVD, die API 24 verwendet, um die App am Ende des Tutorials korrekt auszuführen. Aktualisieren Sie abschließend die Google Play Services Ihres Projekts unter Tools > Android > SDK Manager > SDK Tools auf Version 38.
Nach Erstellung eines Nexmo Accountswerden Sie zum Nexmo Dashboard weitergeleitet. Klicken Sie auf die Registerkarte "Verify" und unter "SDK" auf den Link "Your apps". Erstellen Sie eine neue Applikation (mit der maximalen Leerlaufzeit auf Sofort) und notieren Sie sich die Application ID und das Shared Secret. Die maximale Leerlaufzeit ist eine Einstellung, die festlegt, wie lange der Benutzer verifiziert bleibt.
Fügen Sie die Nexmo-Anmeldeinformationen (sowie die OAuth-Anmeldeinformationen, falls Sie dies im obigen Schritt nicht getan haben) zu "ids.xml" hinzu.
Fügen Sie die folgende Codezeile zu Ihrer Build.gradle-Datei auf App-Ebene hinzu, um das Nexmo Verify SDK als Abhängigkeit in Ihre Anwendung zu bringen. Synchronisieren Sie die gradle-Datei, um fehlende Abhängigkeiten aufzulösen.
compile 'com.nexmo:verify:4.0.0'
Erstellen Sie eine neue Klasse in Ihrem Projekt mit dem Namen "TwoFactorApplication.java" und geben Sie den folgenden Code in die Datei ein. Hier erstellen Sie den Nexmo-Client und versehen ihn mit den Werten, die Sie zuvor in "ids.xml" gespeichert haben.
package com.google.firebase.quickstart.auth;
import android.app.Application;
import android.content.Context;
Import android.util.Log;
import com.nexmo.sdk.NexmoClient;
import com.nexmo.sdk.core.client.ClientBuilderException;
import com.nexmo.sdk.verify.client.VerifyClient;
public class TwoFactorApplication extends Application {
private VerifyClient verifyClient;
private NexmoClient nexmoClient;
private boolean verified;
private static final String TAG = “TWOFACTORAPPLICATION”;
public VerifyClient getVerifyClient(boolean verifiedValue) {
verified = verifiedValue;
return this.verifyClient;
}
@Override
public void onCreate() {
super.onCreate();
acquireVerifyClient();
}
public void acquireVerifyClient() {
Context context = getApplicationContext();
try {
this.nexmoClient = new NexmoClient.NexmoClientBuilder()
.context(context)
.applicationId(getResources().getString(R.string.nexmo_application_id))
.sharedSecretKey(getResources().getString(R.string.nexmo_shared_secret))
.build();
} catch (ClientBuilderException e) {
e.printStackTrace();
Log.d(TAG, e.toString());
return;
}
this.verifyClient = new VerifyClient(nexmoClient);
}
}Fügen Sie in der Datei "AndroidManifest.xml" die erforderlichen Berechtigungen für das Verify SDK und den Anwendungsnamen zum Anwendungs-Tag hinzu:
<application
android:name="com.google.firebase.quickstart.auth.TwoFactorApplication"
Deklarieren Sie die folgenden Variablen in der BaseActivity:
Anwendung (vom Typ: TwoFactorApplication)
verifiziert (vom Typ: boolesch)
In einer "onCreate()"-Methode wird der durch den Aufruf von "this.getApplication();" zurückgegebene Anwendungskontext gecastet. Dadurch wird die Anwendung zurückgegeben, die Eigentümer der Aktivität ist (TwoFactorApplication). Dann erstellen wir eine Methode namens 'addVerificationListener', die als Listener fungiert, um den Anwendungs-Workflow bei einer erfolgreichen 2FA-Verifizierung fortzusetzen. Innerhalb dieser Methode erhalten wir den VerifyClient, der von der Nexmo-Bibliothek bereitgestellt wird, und fügen die Methode addVerifyListener() hinzu.
//Import Statements
import java.io.IOException;
import com.nexmo.sdk.verify.client.VerifyClient;
import com.nexmo.sdk.verify.event.UserObject;
import com.nexmo.sdk.verify.event.VerifyClientListener;
import com.nexmo.sdk.verify.event.VerifyError;
Import android.os.Bundle;
//Declaration
public TwoFactorApplication twoFactorApp;
protected boolean verified;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
twoFactorApp = (TwoFactorApplication) this.getApplication();
}
protected void addVerificationListener() {
twoFactorApp.getVerifyClient(verified).addVerifyListener(new VerifyClientListener() {
@Override
public void onVerifyInProgress(VerifyClient verifyClient, UserObject user) {
}
@Override
public void onUserVerified(VerifyClient verifyClient, UserObject user) {
verified = true;
}
@Override
public void onError(VerifyClient verifyClient, VerifyError errorCode, UserObject user) {
}
@Override
public void onException(IOException exception) {
}
});
}
Verschieben Sie den Aufruf der Methode "signIn()" von der Funktion "onClick" zur Methode "onStart()", wenn der Wert von "verified" gleich "true" ist. Wenn der Benutzer auf die Schaltfläche "Anmelden" klickt, starten Sie stattdessen die vom Verify SDK verwaltete Benutzeroberfläche und rufen die Methode "addVerificationListener()" auf. Ändern Sie schließlich den Wert von 'verified' auf false, wenn die Aktivität gestoppt wird, um sicherzustellen, dass sich der Benutzer jedes Mal anmelden muss.
@Override
public void onStart() {
super.onStart();
if (verified == true) {
signIn();
}
mAuth.addAuthStateListener(mAuthListener);
}
@Override
public void onStop() {
super.onStop();
verified = false;
mAuth.signOut();
if (mAuthListener != null) {
mAuth.removeAuthStateListener(mAuthListener);
}
}
@Override
public void onClick(View v) {
if (i == R.id.sign_in_button) {
twoFactorApp.getVerifyClient(verified).getVerifiedUserFromDefaultManagedUI();
addVerificationListener();
} else if (i == R.id.sign_out_button) {
signOut();
} else if (i == R.id.disconnect_button) {
revokeAccess();
}
}
Verschieben Sie wie im letzten Schritt den Aufruf der Anmeldemethode von der onClick-Funktion in die 'onStart()'-Methode. Starten Sie stattdessen die vom Verify SDK verwaltete Benutzeroberfläche und rufen Sie die Methode 'verificationCallback()' auf, wenn der Benutzer auf die Anmeldeschaltfläche klickt. Ändern Sie in der 'onStop()'-Methode erneut 'verified' in false.
@Override
public void onStart() {
super.onStart();
if (verified == true) {
signIn(mEmailField.getText().toString(), mPasswordField.getText().toString());
}
mAuth.addAuthStateListener(mAuthListener);
}
@Override
public void onStop() {
super.onStop();
verified = false;
mAuth.signOut();
if (mAuthListener != null) {
mAuth.removeAuthStateListener(mAuthListener);
}
}
@Override
public void onClick(View v) {
if (i == R.id.sign_in_button) {
twoFactorApp.getVerifyClient(verified).getVerifiedUserFromDefaultManagedUI();
addVerificationListener();
} else if (i == R.id.sign_out_button) {
signOut();
} else if (i == R.id.disconnect_button) {
revokeAccess();
}
}
private void signOut() {
mAuth.signOut();
verified = false;
updateUI(null);
}
Auch hier verschieben wir den Aufruf der Anmeldemethode von "onClick" in die Methode "onStart()", die aufgerufen wird, wenn der Benutzer verifiziert wurde. Wenn der Benutzer auf die Schaltfläche "Anmelden" drückt, wird die von Verify verwaltete Benutzeroberfläche ausgelöst und die Methode "addVerificationListener()" aufgerufen, wenn der Benutzer auf die Schaltfläche "Anmelden" klickt.
@Override
public void onStart() {
super.onStart();
mAuth.addAuthStateListener(mAuthListener);
if (verified) {
signInAnonymously();
}
}
@Override
public void onStop() {
super.onStop();
mAuth.signOut();
verified = false;
if (mAuthListener != null) {
mAuth.removeAuthStateListener(mAuthListener);
}
}
private void signOut() {
mAuth.signOut();
verified = false;
updateUI(null);
}
@Override
public void onClick(View v) {
int i = v.getId();
if (i == R.id.button_anonymous_sign_in) {
twoFactorApp.getVerifyClient(verified).getVerifiedUserFromDefaultManagedUI();
addVerificationListener();
} else if (i == R.id.button_anonymous_sign_out) {
signOut();
} else if (i == R.id.button_link_account) {
linkAccount();
}
}
Der Anmeldefluss für die TwitterLoginActivity ist ein wenig komplizierter als die vorherigen Anmeldeaktivitäten. Die Twitter Login-Schaltfläche initialisiert die Twitter OAuth Login-Sequenz. Hier erlauben Sie einem Benutzer, mit dem Anmeldefluss fortzufahren, nachdem er den richtigen PIN-Code eingegeben hat (onUserVerified).
@Override
public void onStart() {
super.onStart();
mAuth.addAuthStateListener(mAuthListener);
if(!verified) {
twoFactorApp.getVerifyClient(verified).getVerifiedUserFromDefaultManagedUI();
addVerificationListener();
}
}
@Override
public void onStop() {
super.onStop();
verified = false;
mAuth.signOut();
if (mAuthListener != null) {
mAuth.removeAuthStateListener(mAuthListener);
}
}
private void signOut() {
mAuth.signOut();
verified = false;
Twitter.logOut();
updateUI(null);
}
mLoginButton.setCallback(new Callback() {
@Override
public void success(Result result) {
Log.d(TAG, "twitterLogin:success" + result);
verified = true;
handleTwitterSession(result.data);
}
@Override
public void failure(TwitterException exception) {
Log.w(TAG, "twitterLogin:failure", exception);
updateUI(null);
}
});Jetzt haben alle OAuth-Anbieter zusammen mit den E-Mail/Passwort- und anonymen Anmeldemethoden einen Ablauf, der sicherstellt, dass der Benutzer den zweiten Authentifizierungsfaktor für den Zugriff auf den Account ausfüllt. Die 2FA-aktivierte Version dieses Tutorials ist im 'final' Zweig des Repos.
Mit dem Verify SDK können Sie mehr Zeit für die Entwicklung Ihrer App aufwenden, da es eine verwaltete UI-Lösung bietet, mit der Sie sicher und einfach Verifizierungsanfragen stellen können. Ich würde mich freuen, von Ihnen zu hören, wenn Sie Fragen oder Anregungen haben. Twittern Sie mir https://twitter.com/sidsharma_27 oder mailen Sie mir direkt.