【インストール不要】PHPのフレームワークCodeigniterでFacebookログインを実装する方法

2021.04.22

この記事は下記のような人におすすめ！

Codeigniter初級の方。簡単なログイン画面やフォーム制作を作成することができるスキルを有していること。localで作成したプログラムをレンタルサーバーに導入済の方。私の場合は、レンタルサーバーはロリポップです。しかし、学びを深めたいのならばレンタルサーバーはさくらVPSがおすすめです。

  • Facebookのログイン情報でログインしたい
  • FACEBOOK for DevelopersでアプリIDとapp secretの取得の仕方が分からない
  • 以上のことをCodeigniterで実現したい

ソフトのバージョン

  • Codigniter3(Ver 3.1.11)
  • PHP用Facebook SDK v5(Ver 5.7.0)

バージョンが違うと上手くいかない可能性が大いにあります。これで私は非常に苦労しました。バージョン違いや記事が古いおかげで無駄な時間を費やすのは止めましょう。時間の無駄です。
ソフトのバージョンは必ず確認してください。
CodigniterとFacebookのバージョンの確認方法を下記に明記しました。ご確認ください。

CodeIgniterのバージョン確認方法です。
system/core/Codeigniter.phpに定数として定義されています。

const CI_VERSION = '3.1.11';

PHP用Facebook SDKのバージョン確認方法です。
下記のリンク先で確認してください。 
PHP用Facebook SDK v5

バージョン確認はできましたか？要件に明記したスキルセットは有していますか？準備はできましたか？

それでは、どうぞ！

PHP用Facebook SDKをダウンロードする。

まず、ログイン画面から目的の画面に遷移するまでの一連を見ていただきます。

私が作成したログイン画面です。どうです？かっこいいでしょうw
初心者はここまでくるだけでも大変なんです。
ここであらかじめ登録したEmailやPasswordでログインする方法もあるのですが、今回はFacebookのログイン情報でログインするのが目的となります。
Sign in using Facebookを押すとどうなるか確認してみましょう。

Facebookのログイン画面まで見事に遷移しました。ここまで来たら成功したも同然です。
ここでログイン情報を入力してログインをクリックします。

目的の画面に遷移しました。私の場合は、掲示板の画面に遷移すれば成功です。

PHP用Facebook SDKすなわちphp-graph-sdk-5.xをダウンロードする。

PHP用Facebok SDKバージョン確認用のURLからGithubでPHP SDKを入手してもよいですが、直のリンク先も明記しました。

facebookarchive/php-graph-sdk

Gig Hubでcodeをクリックしてください。Download ZIPが表示されるのでクリックして保存先を選んでダウンロードしてください。
ダウンロードしたら、圧縮ファイルなので展開するのも忘れずに。

Codeigniterのthird_partyにphp-graph-sdk-5.xフォルダをコピーする

先ほどダウンロードし、展開したフォルダphp-graph-sdk-5.xをCodeigniterのthrid_partyにコピーしてください。

設置場所：application/third_party

Facebookの開発者向けサイトでFacebookアプリの登録を行い、「アプリID」「アプリのシークレットキー(app secret)」を取得する。

Facebookの開発者向けサイトでFacebookアプリの登録を行い、「アプリID」「アプリのシークレットキー(app secret)」を取得する。

ここからが他のサイトとは違うところです。「アプリID」と「アプリのシークレットキー」の取得の方法を詳しく説明します。

まず、ホーム画面で緑色のアプリの作成をクリックして下さい。

コネクテッドエクスペリエンスを構築を選択し、次へをクリックして下さい。

アプリ表示名（なんでもよいです。私の場合、ドメインにしました）とアプリの連絡先（Emailのアドレスです）を記入し、青色のアプリを作成をクリックして下さい。

ホーム画面に自分が作成したアプリの表示名でアプリが作成されました。ヘンテコなマークですが、これをクリックして下さい。

ここからが、本章の本題です。左のNavbarに設定があります。クリックするとベーシック表示されます。選択してクリックして下さい。
ここに目的の「アプリID」「アプリのシークレットキー(app secret)」が記載されています。メモするなどして取りおいてください。他の人に決してみせないようにして下さい。文字通り、シークレットです。

最後にクライアントOAuth設定を確認します。ログイン認証後の画面遷移先に関係してくるので、しっかりとチェックしてください。
有効なOAuthリダイレクトURlに遷移先に関連するURlは必ず記載してください。重要なポイントです。
参考コードは、後ほど解説いたします。

CodeigniterにFacebook APIを実装する。プログラミング、コーティングする。

login.phpを作成

さあ、それではいよいよCodeigniterに実装します。と、そのまえに必要なログインのview画面に次のようにコーティングして下さい。ログインの最初の画面のfacebookログインのところです。classの記載は好きにしてください。重要なのは、href以降です。
base_url()の説明はさすがに省きますよ。といいつつ参考URLは下記に明記しました。
codeigniterでbase_url()を使用する方法

設置場所：application/views/login_view.php（login_view.phpの名前はお好きにどうぞ！！）

        <a href="<?php echo base_url();?>token/fblogin" class="btn btn-block btn-primary">
          <i class="fab fa-facebook mr-2"></i> Sign in using Facebook
        </a>

コントローラーToken.phpを作成

3.の項目で取得した「アプリID」「アプリのシークレットキー(app secret)」をここで使用します。
アプリID、アプリのシークレットキーに記載してください。

画面の遷移先URlは、53行目のbase_url().’画面遷移先のURl’が該当します。
このURlが、FACEBOOK for DevelopersのクライアントOAuth設定画面内の有効なOAuthリダイレクトURlに入力するURlです。
とても重要なポイントです。忘れずに！！

設置場所：application/controllers/Token.php（Token.phpの名前はお好きにどうぞ！！コントローラなのでファイル名の一文字目は大文字であることを忘れずに！！）

<?php

class Token extends CI_Controller{

	public function __construct(){		
		parent::__construct();
		date_default_timezone_set('Asia/Tokyo');      
	}

	function fblogin(){
		require_once(APPPATH.'/third_party/php-graph-sdk-5.x/src/Facebook/autoload.php');

		$fb = new Facebook\Facebook([
					'app_id' => 'アプリID',
					'app_secret' => 'アプリのシークレットキー',
					'default_graph_version' => 'v2.7',
				]);

		$helper = $fb->getRedirectLoginHelper();

		$scope = ['public_profile'];
		$loginUrl = $helper->getLoginUrl( base_url().'token/callback', $scope);

		header("location: ".$loginUrl);
		}

	function callback(){

		require_once(APPPATH.'/third_party/php-graph-sdk-5.x/src/Facebook/autoload.php');

		$fb = new Facebook\Facebook([
					'app_id' => 'アプリID',
					'app_secret' => 'アプリのシークレットキー',
					'default_graph_version' => 'v2.7',
		]);
		
		$helper = $fb->getRedirectLoginHelper();

		try {
			$access_token = $helper->getAccessToken();
			$res = $fb->get( '/me', $access_token);

		} catch(Facebook\Exceptions\FacebookResponseException $e) {
			echo $e->getMessage();
			exit();

		} catch(Facebook\Exceptions\FacebookSDKException $e) {
			echo $e->getMessage();
			exit();
		}

		// var_dump($res->getDecodedBody());
		redirect(base_url().'画面遷移先のURl');

	}		

}
?>

以上で完了です(^_-)-☆とても難しかったのではないでしょうか？？
私には、とても難しく感じました。特に設定のところが本当に辛かった。。。

さらにCodeigniterには参考にすべき文献が少ないのが本当に難点です。
この点で苦労している初心者は本当に多いと思います。この記事が少しでも力になれれば幸いです。

以上、最後まで読んでいただきありがとうございました。

スポンサーリンク

コメント

タイトルとURLをコピーしました