AndroidアプリでのFacebookログインの実装ガイド

androidアプリにfacebookログインを追加する方法 はじめに このガイドでは、facebookログインを使用してログインする方法と、 parse user parse user クラスをback4app経由で使用する方法を学びます。このチュートリアルでは、android studio 4 1 1で作成された基本的なアプリを使用します。 buildtoolsversion=30 0 3 buildtoolsversion=30 0 3 、 compile sdk version = 30 compile sdk version = 30 、および targetsdkversion 30 targetsdkversion 30 いつでも、このチュートリアルで構築された完全なandroidプロジェクトにアクセスできます。私たちのgithubリポジトリで kotlinのサンプルリポジトリ javaのサンプルリポジトリ 目標 parseとback4appを使用して、androidアプリにfacebookでのログイン機能を作成します。 前提条件 このチュートリアルを完了するには、 android studio back4appで作成されたアプリ。 注意 次の 新しいparseアプリのチュートリアル に従って、back4appでparseアプリを作成する方法を学んでください。 back4appに接続されたandroidアプリ。 注意 次の parse sdkのインストールチュートリアル に従って、back4appに接続されたandroid studioプロジェクトを作成してください。 android 4 1（jelly bean）以上を実行しているデバイス（または 仮想デバイス )。 1 facebookの設定 facebookの機能を使用するには、次のことを行う必要があります。 次の facebook開発者サイト にアクセスして、アカウントとアプリを作成します。 次のリンクをクリックして、facebookのクイックスタートガイドに従い、 こちらをクリック し、次の推奨事項に注意してください。 こちらはfacebookのクイックスタートガイドに含まれる手順です。facebookが提案する通りに正確に従うわけではないので、注意深く従う必要があります。 ステップ3では追加する代わりに 「 dependencies{} dependencies{} 」セクションで、 build gradle (module\ app) build gradle (module\ app) に次のコードを追加します。「 dependencies{} dependencies{} 」セクションで、 build gradle (module\ app) build gradle (module\ app) parse facebook utils sdk for androidのバージョンを最新のものに更新することを忘れないでください。最新のバージョンは次の jitpackウェブサイト で確認できます。次の手順に従ってください jitpackのウェブサイトに貼り付けてください parse community\ parsefacebookutils android parse community\ parsefacebookutils android の gitリポジトリurl gitリポジトリurl ボックス。 それを行った後、次をクリックします。 調べる 調べる ボタン。次に、次の画像に示されているように、android用のparse sdkの利用可能なバージョンが表示されるはずです。 ステップ4では、インターネットの権限を追加するように求められます アプリケーション アプリケーション 要素を /app/manifest/androidmanifest xml /app/manifest/androidmanifest xml ファイルに追加しますが、すでに parse sdkのインストール チュートリアルに従って追加しているので、これを行う必要はありません。 ステップ6では、キーのハッシュを提供する必要があるため、 open ssl をインストールしておく必要があります。facebookのガイドには、linuxでキーのハッシュを生成するためのコマンドラインは提供されていませんが、それを行うのは簡単です。必要なのは、ターミナルウィンドウを開いて、次のコマンドを実行することだけです facebookのクイックスタートガイドの手順に従わないでください ステップ6 。 sha 1とは何ですか (セキュアハッシングアルゴリズム) sha 1は、セキュアハッシングアルゴリズムと呼ばれ、最も一般的な暗号化アルゴリズムです。sha 1は、アメリカ合衆国国家安全保障局によって設計されました。sha 1フィンガープリントは、サイン用に使用できるpc用に生成されたユニークなキーです。主にいくつかのapi（このガイドで使用するfacebook apiなど）を使用するために提出するために使用されます。詳細を学びたい場合は、sha 1のwikipediaページを訪れることができます。 facebookのクイックスタートガイドに記載されている他の手順に従うべきであり、ここでは言及されていません。 2 facebookアプリをback4appにリンクする アプリのダッシュボードに移動し、 back4appウェブサイト をクリックします。 サーバー設定 サーバー設定 を選択します。 「facebookログイン」ブロックを見つけて、 設定 設定 をクリックします。「facebookログイン」ブロックは次のようになります 3\ facebookガイドから取得したfacebook idをstrings xmlに追加する必要があります（facebookガイドに従ってこれを行っているはずです）。android studioプロジェクトに移動し、stringsファイルを開きます /app/src/main/res/values/strings xml /app/src/main/res/values/strings xml , あなたの facebook app id facebook app id をコピーし、back4appの最後のページの facebook appid facebook appid フィールドに貼り付けます。最後に、 + + ボタンを押します。 3 マニフェストファイルにプロバイダー要素を追加する android studioプロジェクトに戻り、 application application 要素の中で、 /app/manifest/androidmanifest xml /app/manifest/androidmanifest xml ファイルの meta data meta data 要素の直後に、次のコードを追加します。 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" /> 上記のコードにfacebookアプリidを入れるのを忘れないでください。 4 parse facebook util sdkの初期化 android studioプロジェクト内で、parse sdkを初期化するために作成したapplicationを拡張する app app という名前のjavaファイルの oncreate oncreate メソッド内で、 parse initialize() parse initialize() の呼び出しの直後に、以下のコードを使用してparse facebook utils sdkを初期化します。 このステップで説明されているように app java app java ファイルがない場合は、 android用parse sdkのインストール https //www back4app com/docs/android/parse android sdk ドキュメントにアクセスし、parse sdkを正しくインストールするために必要なすべての手順を実行したことを確認してください。parse sdkを正しくインストールしないと、parseでのfacebookログインは機能しません。 5 設定 各parseアクティビティの開始時に、以下をインポートします 6 ログイン ログインアクティビティを実装するには、次の手順を行います あなたの loginactivity loginactivity , に加えて ステップ 4 2\ facebookログインを実装するには、次のコードを使用してください 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 } この例のプロジェクトでは、このコードは facebookでログイン facebookでログイン ボタンのコールバック内に配置されています。 3\ facebookを通じて私たちのアプリに成功裏にログインした後、基本的なログインユーザー情報を取得できます。上記のコードには、さらに多くのメソッドが含まれています。 getuserdetailfromfb getuserdetailfromfb メソッドはユーザーの詳細を取得する役割を担っています。このメソッドのコードは以下の通りです 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\ アラートダイアログを表示するメソッドを追加して、プロセスをよりプロフェッショナルに見せるのは興味深いです。この関数では、ユーザーのパラメータも取得します。mainactivityページに移動する際に、このユーザーパラメータをインテントで送信し、mainactivityではこのユーザーの情報を引き出して画面に表示します。以下のメソッドがこれを行います 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\ 既存のparseuserをfacebookアカウントに関連付けたい場合は、次のようにリンクできます 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 } この例のプロジェクトでは、このコードは アカウントをfacebookにリンクする アカウントをfacebookにリンクする ボタンのコールバック内に配置されています。 6\ ユーザーからfacebookのリンクを解除したい場合は、次のようにします 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 } この例のプロジェクトでは、このコードは アカウントをfacebookからリンク解除する アカウントをfacebookからリンク解除する ボタンのコールバック内に配置されています。 7\ 非常に重要です 次のメソッドを oncreate() oncreate() メソッドの外で使用して、ログイン結果をloginmanagerにcallbackmanager経由で渡し、エラーを回避してください。 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 ログアウト facebookログアウトを実装するには、以下のコードを使用してください 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 } この例のプロジェクトでは、このコードは ログアウト ログアウト ボタンのコールバック内に配置されています。 メソッド alertdisplayer alertdisplayer は、あなたが loginactivity loginactivity に追加したものと同じですので、 intent intent の引数を変更するのを忘れないでください。 完了しました! この段階で、parse serverのコア機能を通じてback4appを使用して、facebookでアプリにログイン、登録、ログアウトできます!