c-taka/Facebook認証の基本.md

Facebook認証の基本

概要

Facebookでログインが出来るWebサービスの作り方を解説していきます。

##サンプルコード

必要となる知識

OAuth 2.0

##01 開発の準備を進めよう FacebookでログインできるWebサービスの完成版を確認したのち、開発者向けサイト、必要な知識などについて解説していきます。

##02 Facebookアプリを登録しよう Facebook側にてアプリを登録していく手順について説明していきます。

##03 データベースを設定しようユーザー情報を管理するためのデータベースを設定していきます。

create database fb_connect_php;

grant all on fb_connect_php.* to dbuser@localhost identified by '(設定したパスワード)';

use fb_connect_php

create table users (
    id int not null auto_increment primary key,
    facebook_user_id varchar(30) unique,
    facebook_name varchar(255),
    facebook_picture varchar(255),
    facebook_access_token varchar(255),
    created datetime,
    modified datetime
);

##04 アプリ全体の設定をしようアプリ全体に共通する設定を作りこんでいきます。

<?php

define('DB_HOST', 'localhost');
define('DB_USER', 'dbuser');
define('DB_PASSWORD', '(設定したパスワード)');
define('DB_NAME', 'dotinstall_fb_connect_php');

define('APP_ID','(取得したAPP_ID)');
define('APP_SECRET','(取得したAPP_SECRET)');

define('SITE_URL', 'http://dev.dotinstall.com/fb_connect_php/');

error_reporting(E_ALL & ~E_NOTICE);

session_set_cookie_params(0, '/fb_connect_php/');

##05 ひな形ファイルを作ろう Facebookの友達を表示するためのひな形ファイルを作りこんでいきます。

index.php

<?php

require_once('config.php');

session_start();

// ログインチェック
if (empty($_SESSION['user'])) {
    header('Location: '.SITE_URL.'login.php');
    exit;
}

// 友達情報の取得

?>
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>Facebook Friends</title>
</head>
<body>
    <h1>Facebook Friends</h1>
</body>
</html>

##06 認証処理を実装していこうログインするためのファイルを作り、認証処理の準備をしていきます。

login.php

<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="UTF-8">
    <title>Login</title>
</head>
<body>
    <h1>Login</h1>
    <p><a href="redirect.php">Facebookでログイン</a></p>
</body>
</html>

redirect.php

<?php

require_once('config.php');

session_start();

if (empty($_GET['code'])) {
    // 認証の準備
    // facebookに一旦飛ばす

} else {
    // 認証後の処理
    // ユーザー情報の取得
    // DB処理
    // ログイン処理
    // index.php

}

##07 認証ダイアログを作っていこう FacebookのAPIを確認しながら、認証ダイアログを作りこんでいきます。

redirect.php

 if (empty($_GET['code'])) {
     // 認証の準備
+    
+    $_SESSION['state'] = sha1(uniqid(mt_rand(), true));
+    
+    $params = array(
+        'client_id' => APP_ID,
+        'redirect_uri' => SITE_URL.'redirect.php',
+        'state' => $_SESSION['state'],
+        'scope' => 'user_website,friends_website'
+    );
+    
+    $url = "https://www.facebook.com/dialog/oauth?".http_build_query($params);    
+    
     // facebookに一旦飛ばす
 
 } else {

##08 ユーザー情報を取得しよう Facebookで認証したあとにユーザー情報を取得していきます。認証したユーザーのaccess_tokenがうまく取れているか確認していきます。

redirect.php

     $url = "https://www.facebook.com/dialog/oauth?".http_build_query($params);    
     
     // facebookに一旦飛ばす
+    header('Location: '.$url);
+    exit;
 
 } else {
     // 認証後の処理
+    
+    // CSRF対策
+    if ($_SESSION['state'] != $_GET['state']) {
+        echo "不正な処理！";
+        exit;
+    }
+    
     // ユーザー情報の取得
+    $params = array(
+        'client_id' => APP_ID,
+        'client_secret' => APP_SECRET,
+        'code' => $_GET['code'],
+        'redirect_uri' => SITE_URL.'redirect.php'
+    );
+    $url = 'https://graph.facebook.com/oauth/access_token?'.http_build_query($params);    
+    $body = file_get_contents($url);
+    parse_str($body);
+    
+    $url = 'https://graph.facebook.com/me?access_token='.$access_token.'&fields=name,picture';
+    $me = json_decode(file_get_contents($url));
+    var_dump($me);
+    exit;


     // DB処理
     // ログイン処理
     // index.php

##09 ユーザー情報を格納しよう取得したユーザー情報をデータベースに格納していく処理を実装していきます。ユーザー情報をデータベースに挿入し、抽出していく処理について解説していきます。

redirect.php

-    var_dump($me);
-    exit;
-    
+    //var_dump($me);
+    //exit;
     
     // DB処理
+    try {
+        $dbh = new PDO('mysql:host='.DB_HOST.';dbname='.DB_NAME,DB_USER,DB_PASSWORD);
+    } catch (PDOException $e) {
+        echo $e->getMessage();
+        exit;
+    }
+    
+    $stmt = $dbh->prepare("select * from users where facebook_user_id=:user_id limit 1");
+    $stmt->execute(array(":user_id"=>$me->id));
+    $user = $stmt->fetch();
+
+    if (empty($user)) {
+        $stmt = $dbh->prepare("insert into users (facebook_user_id, facebook_name, facebook_picture, facebook_access_token, created, modified) values (:user_id, :name, :picture, :access_token, now(), now());");
+        $params = array(
+            ":user_id"=>$me->id,
+            ":name"=>$me->name,
+            ":picture"=>$me->picture->data->url,
+            ":access_token"=>$access_token
+        );
+        $stmt->execute($params);
+        $stmt = $dbh->prepare("select * from users where facebook_user_id=:last_insert_id limit 1");
+        $stmt->execute(array(":last_insert_id"=>$dbh->lastInsertId()));
+        $user = $stmt->fetch();        
+    }
     // ログイン処理
     // index.php

##10 ログイン処理を完了させようデータベースへの格納処理を確認したのち、ログイン処理を作りこんでいきます。

redirect.php

     $user = $stmt->fetch();
 
     if (empty($user)) {
+        $stmt = $dbh->prepare("insert into users (facebook_user_id, facebook_name, facebook_picture, facebook_access_token, created, modified) values (:user_id, :name, :picture, :access_token, now(), now());");
+        $params = array(
+            ":user_id"=>$me->id,
+            ":name"=>$me->name,
+            ":picture"=>$me->picture->data->url,
+            ":access_token"=>$access_token
+        );
+        $stmt->execute($params);
+        $stmt = $dbh->prepare("select * from users where id=:last_insert_id limit 1");
+        $stmt->execute(array(":last_insert_id"=>$dbh->lastInsertId()));
+        $user = $stmt->fetch();        
     }
     
     // ログイン処理

##11 ユーザー情報を表示させよう認証したユーザーの情報を表示する方法について解説していきます。

redirect.php

     // ログイン処理
+    if (!empty($user)) {
+        session_regenerate_id(true);
+        $_SESSION['user'] = $user;
+    }
+    
     // index.php
+    header('Location: '.SITE_URL);
 }

index.php

 <body>
     <h1>Facebook Friends</h1>
+    <div>
+    <img src="<?php echo h($_SESSION['user']['facebook_picture']); ?>">
+    </div>
+    <p><?php echo h($_SESSION['user']['facebook_name']); ?>としてログインしています。</p>
 </body>

##12 友達情報を表示させよう FacebookのAPIを使って友達の情報を表示していきます。

index.php

 // 友達情報の取得
+$url = "https://graph.facebook.com/me/friends?access_token=".$_SESSION['user']['facebook_access_token'];
+$friends = json_decode(file_get_contents($url));
+//var_dump($friends);
+//exit;
 
 ?>

     <img src="<?php echo h($_SESSION['user']['facebook_picture']); ?>">
     </div>
     <p><?php echo h($_SESSION['user']['facebook_name']); ?>としてログインしています。</p>
+    <ul>
+    <?php foreach ($friends->data as $friend) : ?>
+    <li><?php echo h($friend->name); ?></li>
+    <?php endforeach; ?>
+    </ul>
 </body>

##13 ログアウト処理を実装しよう最後にログアウト処理を実装し、動作を確認していきます。

logout.php

<?php 

require_once('config.php');

session_start();

$_SESSION = array();

if (isset($_COOKIE[session_name()])) {
    setcookie(session_name(), '', time()-86400, '/fb_connect_php/');
}

session_destroy();

header('Location: '.SITE_URL);

c-taka/Facebook認証の基本.md

Select an option

No results found

Select an option

No results found

Facebook認証の基本

概要

必要となる知識

index.php

login.php

redirect.php

redirect.php

redirect.php

redirect.php

redirect.php

redirect.php

index.php

index.php

logout.php