Tutorial Tecnico: Implementazione Login Facebook su Android

come aggiungere il login di facebook alla tua app android introduzione in questa guida, imparerai come effettuare il login utilizzando il login di facebook e parse user parse user tramite back4app questo tutorial utilizza un'app di base creata in android studio 4 1 1 con buildtoolsversion=30 0 3 buildtoolsversion=30 0 3 , compile sdk version = 30 compile sdk version = 30 e targetsdkversion 30 targetsdkversion 30 in qualsiasi momento, puoi accedere al progetto android completo costruito con questo tutorial nei nostri repository github https //github com/templates back4app/android parse sdk kotlin https //github com/templates back4app/android parse sdk java obiettivo crea una funzione di login con facebook per la tua app android utilizzando parse e back4app prerequisiti per completare questo tutorial, abbiamo bisogno di https //developer android com/studio/index html un'app creata su back4app nota segui il https //www back4app com/docs/get started/new parse app per imparare a creare un'app parse su back4app un'app android collegata a back4app nota segui il https //www back4app com/docs/android/parse android sdk per creare un progetto android studio collegato a back4app un dispositivo (o https //developer android com/studio/run/managing avds html ) che esegue android 4 1 (jelly bean) o versioni successive 1 configurazione di facebook per iniziare a utilizzare le funzioni di facebook, è necessario vai al https //developers facebook com/ e crea un account e un'app segui la guida rapida di facebook https //developers facebook com/docs/facebook login/android e presta attenzione alle seguenti raccomandazioni ecco i passaggi inclusi nella guida rapida di facebook, che devi seguire attentamente, poiché non li seguirai esattamente come suggerisce facebook nel passo 3 invece di aggiungere implementation 'com facebook android\ facebook login \[8 1)' nella dipendenze{} dipendenze{} sezione in build gradle (modulo\ app) build gradle (modulo\ app) , aggiungi il seguente codice nella dipendenze{} dipendenze{} sezione in build gradle (modulo\ app) build gradle (modulo\ app) 1 // update the versions to the latest ones 2 implementation "com github parse community\ parsefacebookutils android\ latest version here" 3 implementation 'com facebook android\ facebook android sdk\ latest version here' ricorda di aggiornare la versione del parse facebook utils sdk per android all'ultima disponibile puoi scoprire qual è l'ultima versione sul https //jitpack io/ , seguendo questi passaggi sul sito di jitpack incolla parse community\ parsefacebookutils android parse community\ parsefacebookutils android nella url del repo git url del repo git dopo aver fatto ciò, fai clic sul cerca cerca pulsante dovresti quindi vedere le versioni disponibili di parse sdk per android, come mostrato nell'immagine seguente nel passo 4, ti verrà chiesto di aggiungere il permesso di internet all' applicazione applicazione elemento in /app/manifest/androidmanifest xml /app/manifest/androidmanifest xml file, ma lo hai già aggiunto seguendo il https //www back4app com/docs/android/parse android sdk quindi non è necessario farlo nel passo 6, dovrai fornire le chiavi hash, quindi devi avere https //www openssl org/ installato la guida di facebook non fornisce righe di comando per generare chiavi hash in linux, ma farlo è semplice, poiché tutto ciò che richiede da te è aprire una finestra del terminale e eseguire il seguente comando keytool exportcert alias androiddebugkey keystore / android/debug keystore | openssl sha1 binary | openssl base64 non seguire i passaggi della guida rapida di facebook subito dopo passo 6 https //en wikipedia org/wiki/sha 1 (algoritmo di hashing sicuro) sha 1, chiamato algoritmo di hashing sicuro, è l'algoritmo di crittografia più comune sha 1, progettato dalla national security agency degli stati uniti l'impronta sha 1 è una chiave unica generata per il tuo pc che può essere utilizzata per la firma è principalmente utilizzato per l'invio di alcune api (come l'api di facebook che utilizzeremo in questa guida) se desideri ulteriori dettagli, puoi visitare la pagina wikipedia di sha 1 dovresti seguire gli altri passaggi descritti nella guida rapida di facebook e non menzionati qui 2 collega la tua app facebook con back4app vai al tuo cruscotto dell'app su https //www back4app com/ e clicca su impostazioni del server impostazioni del server trova il blocco “accesso facebook” e clicca su impostazioni impostazioni il blocco “accesso facebook” appare così 3\ dobbiamo aggiungere il nostro facebook id, che abbiamo ottenuto dalla guida di facebook a string xml (dovresti aver seguito la guida di facebook e fatto questo prima) vai al tuo progetto android studio, apri il tuo file strings /app/src/main/res/values/strings xml /app/src/main/res/values/strings xml , copia il tuo facebook app id facebook app id e incollalo nel campo appid di facebook appid di facebook dell'ultima pagina di back4app che hai aperto infine, premi il pulsante + + 3 aggiungi l'elemento provider nel file manifest torna al tuo progetto android studio e all'interno dell'elemento applicazione applicazione nel file /app/manifest/androidmanifest xml /app/manifest/androidmanifest xml subito dopo l'elemento meta data meta data aggiungi il seguente codice 1 \<provider 2 android\ name="com facebook facebookcontentprovider" 3 \<! don't forget to put your facebook app id in the following link > 4 android\ authorities="com facebook app facebookcontentprovideryour facebook app id" 5 android\ exported="true" /> non dimenticare di inserire il tuo id app di facebook nel codice sopra 4 inizializza i sdk di parse facebook util nel tuo progetto android studio, nel file java chiamato app app che estende application che hai creato per inizializzare il sdk di parse, nel suo oncreate oncreate metodo, subito dopo la chiamata a parse initialize() parse initialize() usa il seguente codice per inizializzare il sdk di parse facebook utils 1 parsefacebookutils initialize (this); se non hai un app java app java file come descritto in questo passaggio, accedi alla https //www back4app com/docs/android/parse android sdk documentazione e assicurati di aver seguito tutti i passaggi necessari per installare correttamente il sdk di parse se non installi correttamente il sdk di parse, il tuo accesso a facebook con parse non funzionerà 5 configura all'inizio di ogni attività parse, importa quanto segue 1 import androidx appcompat app appcompatactivity ; 2 import android app alertdialog ; 3 import android app progressdialog ; 4 import android content intent ; 5 import android os bundle ; 6 import android widget button ; 7 import com facebook login loginmanager ; 8 import com parse parseuser ; 6 accedi per implementare la tua attività di accesso, fai quanto segue importa nel tuo loginactivity loginactivity , oltre alle dipendenze importate in passo 4 1 import android app alertdialog ; 2 import android app progressdialog ; 3 import android content intent ; 4 import android os bundle ; 5 import android util log ; 6 import android widget button ; 7 import android widget toast ; 8 import com facebook accesstoken ; 9 import com facebook graphrequest ; 10 import com parse parseuser ; 11 import com parse facebook parsefacebookutils ; 12 import org json jsonexception ; 13 import java util arrays ; 14 import java util collection ; 2\ per implementare il login di facebook, utilizza semplicemente il seguente codice 1 final progressdialog dialog = new progressdialog(this); 2 dialog settitle("please, wait a moment "); 3 dialog setmessage("logging in "); 4 dialog show(); 5 collection\<string> permissions = arrays aslist("public profile", "email"); 6 parsefacebookutils loginwithreadpermissionsinbackground(this, permissions, (user, err) > { 7 dialog dismiss(); 8 if (err != null) { 9 log e("facebookloginexample", "done ", err); 10 toast maketext(this, err getmessage(), toast length long) show(); 11 } else if (user == null) { 12 toast maketext(this, "the user cancelled the facebook login ", toast length long) show(); 13 log d("facebookloginexample", "uh oh the user cancelled the facebook login "); 14 } else if (user isnew()) { 15 toast maketext(this, "user signed up and logged in through facebook ", toast length long) show(); 16 log d("facebookloginexample", "user signed up and logged in through facebook!"); 17 getuserdetailfromfb(); 18 } else { 19 toast maketext(this, "user logged in through facebook ", toast length long) show(); 20 log d("facebookloginexample", "user logged in through facebook!"); 21 showalert("oh, you!", "welcome back!"); 22 } 23 });1 val dlg = progressdialog(this) 2 dlg settitle("please, wait a moment ") 3 dlg setmessage("logging in ") 4 dlg show() 5 val permissions collection\<string> = listof("public profile", "email") 6 parsefacebookutils loginwithreadpermissionsinbackground(this, permissions) { user parseuser?, err parseexception? > 7 dlg dismiss() 8 when { 9 err != null > { 10 log e("facebookloginexample", "done ", err) 11 toast maketext(this, err message, toast length long) show() 12 } 13 user == null > { 14 toast maketext(this, "the user cancelled the facebook login ", toast length long) show() 15 log d("facebookloginexample", "uh oh the user cancelled the facebook login ") 16 } 17 user isnew > { 18 toast maketext(this, "user signed up and logged in through facebook ", toast length long) show() 19 log d("facebookloginexample", "user signed up and logged in through facebook!") 20 getuserdetailfromfb() 21 } 22 else > { 23 toast maketext(this, "user logged in through facebook ", toast length long) show() 24 log d("facebookloginexample", "user logged in through facebook!") 25 showalert("oh, you!", "welcome back!") 26 } 27 } 28 } nell'esempio di progetto, questo codice è posizionato all'interno di un accesso tramite facebook accesso tramite facebook callback del pulsante 3\ dopo un accesso riuscito tramite facebook alla nostra app, ora possiamo ottenere alcune informazioni di base dell'utente connesso come puoi vedere, ci sono molti più metodi inclusi nel codice sopra il getuserdetailfromfb getuserdetailfromfb metodo è responsabile per il recupero dei dettagli dell'utente ecco il codice per questo metodo 1 private void getuserdetailfromfb() { 2 graphrequest request = graphrequest newmerequest(accesstoken getcurrentaccesstoken(), (object, response) > { 3 parseuser user = parseuser getcurrentuser(); 4 try { 5 if (object has("name")) 6 user setusername(object getstring("name")); 7 if (object has("email")) 8 user setemail(object getstring("email")); 9 } catch (jsonexception e) { 10 e printstacktrace(); 11 } 12 user saveinbackground(e > { 13 if (e == null) { 14 showalert("first time login!", "welcome!"); 15 } else 16 showalert("error", e getmessage()); 17 }); 18 }); 19 20 bundle parameters = new bundle(); 21 parameters putstring("fields", "name,email"); 22 request setparameters(parameters); 23 request executeasync(); 24 }1 private fun getuserdetailfromfb() { 2 val request = 3 graphrequest newmerequest(accesstoken getcurrentaccesstoken()) { `object` jsonobject, graphresponse? > 4 val user = parseuser getcurrentuser() 5 try { 6 user username = `object` getstring("name") 7 } catch (e jsonexception) { 8 e printstacktrace() 9 } 10 try { 11 user email = `object` getstring("email") 12 } catch (e jsonexception) { 13 e printstacktrace() 14 } 15 user saveinbackground { 16 if (it == null) 17 showalert("first time login!", "welcome!") 18 else 19 showalert("error", it message) 20 } 21 } 22 val parameters = bundle() 23 parameters putstring("fields", "name,email") 24 request parameters = parameters 25 request executeasync() 26 } 4\ è interessante aggiungere un metodo per visualizzare i dialoghi di avviso e rendere il processo più professionale in questa funzione, otteniamo anche un parametro utente quando andiamo alla pagina mainactivity, inviamo questo parametro utente nell'intento, e nella mainactivity, estraiamo le informazioni di questo utente e le stampiamo sullo schermo il metodo qui sotto fa questo 1 private void showalert(string title, string message) { 2 alertdialog builder builder = new alertdialog builder(this) 3 settitle(title) 4 setmessage(message) 5 setpositivebutton("ok", (dialog, which) > { 6 dialog cancel(); 7 intent intent = new intent(this, mainactivity class); 8 intent addflags(intent flag activity clear task | intent flag activity new task); 9 startactivity(intent); 10 }); 11 alertdialog ok = builder create(); 12 ok show(); 13 }1 private fun showalert(title string, message string?) { 2 val builder = alertdialog builder(this) 3 settitle(title) 4 setmessage(message) 5 setpositivebutton("ok") { dialog dialoginterface, which int > 6 dialog cancel() 7 val intent = intent(this\@loginactivity, mainactivity class java) 8 intent addflags(intent flag activity clear task or intent flag activity new task) 9 startactivity(intent) 10 } 11 val ok = builder create() 12 ok show() 13 } 5\ se vuoi associare un parseuser esistente a un account facebook, puoi collegarlo in questo modo 1 collection\<string> permissions = arrays aslist("public profile", "email"); 2 if (!parsefacebookutils islinked(parseuser getcurrentuser())) { 3 parsefacebookutils linkwithreadpermissionsinbackground(parseuser getcurrentuser(), this, permissions, ex > { 4 if (parsefacebookutils islinked(parseuser getcurrentuser())) { 5 toast maketext(this, "woohoo, user logged in with facebook ", toast length long) show(); 6 log d("facebookloginexample", "woohoo, user logged in with facebook!"); 7 } 8 }); 9 } else { 10 toast maketext(this, "you have already linked your account with facebook ", toast length long) show(); 11 }1 val permissions= listof("public profile","email") 2 if (!parsefacebookutils islinked(parseuser getcurrentuser())){ 3 parsefacebookutils linkwithreadpermissionsinbackground(parseuser getcurrentuser(),this,permissions) { 4 if (parsefacebookutils islinked(parseuser getcurrentuser())){ 5 toast maketext(this, "woohoo, user logged in with facebook ", toast length long) show() 6 log d("facebookloginexample", "woohoo, user logged in with facebook!") 7 } 8 } 9 } else { 10 toast maketext(this, "you have already linked your account with facebook ", toast length long) show() 11 } 12 } nel progetto di esempio, questo codice è posizionato all'interno di un collega il tuo account a facebook collega il tuo account a facebook callback del pulsante 6\ se vuoi scollegare facebook da un utente, fai semplicemente questo 1 parsefacebookutils unlinkinbackground(parseuser getcurrentuser(), ex > { 2 if (ex == null) { 3 toast maketext(this, "the user is no longer associated with their facebook account ", toast length long) show(); 4 log d("myapp", "the user is no longer associated with their facebook account "); 5 } else { 6 toast maketext(this, ex getmessage(), toast length long) show(); 7 } 8 });1 parsefacebookutils unlinkinbackground(parseuser getcurrentuser()) { 2 if (it == null) { 3 toast maketext(this,"the user is no longer associated with their facebook account ",toast length long) show() 4 log d("myapp", "the user is no longer associated with their facebook account ") 5 } else { 6 toast maketext(this, it message, toast length long) show() 7 } 8 } nel progetto di esempio, questo codice è posizionato all'interno di un scollega il tuo account da facebook scollega il tuo account da facebook callback del pulsante 7\ è molto importante utilizzare il seguente come metodo al di fuori del oncreate() oncreate() metodo della tua loginactivity loginactivity per passare i risultati di accesso al loginmanager tramite callbackmanager ed evitare errori 1 @override 2 protected void onactivityresult(int requestcode, int resultcode, intent data) { 3 super onactivityresult(requestcode, resultcode, data); 4 parsefacebookutils onactivityresult(requestcode, resultcode, data); 5 }1 override fun onactivityresult(requestcode int, resultcode int, data intent?) { 2 super onactivityresult(requestcode, resultcode, data) 3 parsefacebookutils onactivityresult(requestcode, resultcode, data) 4 } 7 disconnettersi per implementare il logout di facebook, utilizza semplicemente il codice menzionato di seguito 1 final progressdialog dialog = new progressdialog(this); 2 dialog settitle("please, wait a moment "); 3 dialog setmessage("logging out "); 4 dialog show(); 5 loginmanager getinstance() logout(); 6 parseuser logoutinbackground(e > { 7 if (e == null) 8 showalert("so, you're going ", "ok bye bye then", true); 9 else 10 showalert("error ", e getmessage(), false); 11 });1 val dlg = progressdialog(this) 2 dlg settitle("please, wait a moment ") 3 dlg setmessage("logging out ") 4 dlg show() 5 loginmanager getinstance() logout() 6 parseuser logoutinbackground { e > 7 if (e == null) 8 showalert("so, you're going ", "ok bye bye then", true) 9 else 10 showalert("error ", e message, false) 11 } nel progetto di esempio, questo codice è posizionato all'interno di un log out log out callback del pulsante il metodo alertdisplayer alertdisplayer è lo stesso che hai aggiunto in loginactivity loginactivity , non dimenticare di cambiare i suoi intent intent argomenti è fatto! a questo punto, puoi accedere, registrarti e disconnetterti dalla tua app con facebook utilizzando le funzionalità principali di parse server tramite back4app!