NEWS ABOUT Solution WORKS TEAM BLOG お問い合わせ JP EN

【完全保存版】FacebookのAPIを使って画像を取得!(第2回 / 全3回)

こんにちは!システムエンジニアの長澤です!

前回は「Facebookのアプリ登録」について紹介しましたが、今回は「graphAPIの使い方」について行いたいと思います。
※前回はver2.5でご紹介しましたが、月日が経ってしまった為、今回からver2.7でご紹介します。

○このようなアプリを作ります

Facebook認証で許可したユーザのアクセストークンを取得し、そのアクセストークンでユーザが投稿した最新のタイムライン画像を表示

○パートは全3回

①Facebookのアプリ登録(前回)
②graphAPIの使い方(このブログ記事です)
③Facebookのアプリ申請(※近日公開予定)

■テストユーザ作成

特定のアクセス権限をもったfacebookユーザを作成します。

developersの自分のアプリ(今回はtestという名前のアプリ)にログインしてサイドメニューの「役割」→「テストユーザ」をクリック
②「追加」ボタンをクリック
テストユーザ1

③「このアプリのテストユーザーを許可しますか?」を「はい」をクリック
④「ログイン許可」に「user_photos」「user_posts」を入力
⑤「リアルタイムフィードを有効にしますか?」を「はい」を選択
⑥「テストユーザーの作成」をクリック
テストユーザ2

⑦作成テストユーザの右横の「編集」ボタンをクリックし、「このテストユーザーの名前またはパスワードを変更」をクリック

 

 

⑧「新しいパスワード」と「新しいパスワードを確認」にパスワードを入力し「保存する」ボタンをクリック
テストユーザ4

■テストユーザで画像を投稿

①上記作成のテストユーザでFacebookへログインし、画像を投稿
テストユーザで画像を投稿2

■各種設定

①サイドメニューの「アプリレビュー」をクリック
各種設定の有効化1

②「アプリを公開しますか?」ウィンドウの「確認」をクリック

各種設定の有効化2

③サイドメニューの「ダッシュボード」をクリック
④「APIバージョン」と「アプリID」を取得
テスト

⑤サイドメニューの「設定」→「ベーシック」をクリック
⑥「app secret」の「表示」ボタンをクリック
⑦パスワードを入力し「app secret」を取得
⑧アプリドメインに今回使用するドメインを設定
⑨「プラットフォームを追加」をクリック

⑩ウェブサイトを選択
テスト4

⑪サイトURLに今回使用するURLを設定
テスト5⑫「変更を保存」をクリック

■PHP SDKの準備

①以下のサイトからSDKをダウンロード
https://github.com/facebook/facebook-php-sdk-v4
②解凍ファイルの「Facebook」ディレクトリを以下の様な形に変更
facebook-php-sdk-v4-master\src\Facebook

facebook-php-sdk-v4

■ディレクトリ構成とソース

今回のディレクトリは以下のような構成とします。
url:http://nagasawa.local/facebook/index.php

/facebook
├facebook-php-sdk-v4
├Authentication ex…
└autoload.php ex…
├index.php
└index_callback.php

▼index.php

<?php
// 事前にセッションの利用を開始する 
session_start(); 
// autoloaderを読み込む 
require_once './facebook-php-sdk-v4/autoload.php'; 
// Facebook\Facebook にアプリの情報をロードする 
$fb = new Facebook\Facebook(array( 
        'app_id' => 'xxxxxxxxxx', // ここにアプリID
        'app_secret' => 'xxxxxxxxxx', // ここにapp secret
        'default_graph_version' => 'v2.7', // ここにAPIバージョン
));

$helper = $fb->getRedirectLoginHelper();
$permissions = ['user_photos', 'user_posts']; // optional
$loginUrl = $helper->getLoginUrl('http://nagasawa.local/facebook/index-callback.php', $permissions);
?>
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>graphAPI テスト</title>
</head>

<body>

<div>


アクセスキーを取得し、タイムラインに保存されている画像を取得します。

    <a href="<?php echo $loginUrl;?>"><button>画像情報の取得を許可します</button></a>
</div>

</body>
</html>

▼index_callback.php

<?php 
// 事前にセッションの利用を開始する 
session_start(); 
// autoloaderを読み込む 
require_once './facebook-php-sdk-v4/autoload.php'; 
// Facebook\Facebook にアプリの情報をロードする 
$fb = new Facebook\Facebook(array( 
        'app_id' => 'xxxxxxxxxx', // ここにアプリID
        'app_secret' => 'xxxxxxxxxx', // ここにapp secret
        'default_graph_version' => 'v2.7', // ここにAPIバージョン
));
$helper = $fb->getRedirectLoginHelper();

try {
  $accessToken = $helper->getAccessToken();
  $oAuth2Client = $fb->getOAuth2Client();
  // 短期トークンを長期トークンにアップグレード
  $longLivedAccessToken = $oAuth2Client->getLongLivedAccessToken((string)$accessToken);
} catch(Facebook\Exceptions\FacebookResponseException $e) {
  // Graph api がエラーを返した場合
  echo '通信に失敗: ' . $e->getMessage();
  exit;
} catch(Facebook\Exceptions\FacebookSDKException $e) {
  // 認証エラーorローカルエラー
  echo '認証エラーorローカルエラー: ' . $e->getMessage();
  exit;
}

// Facebookオブジェクトにアクセストークンを設定
$fb->setDefaultAccessToken($longLivedAccessToken);

$tmp = array();
$temporary = array();

/*
 * 自身のアルバム情報を取得
 * 
 */
try {
    $response = $fb->get('/me/albums');
    $plainOldArray = $response->getDecodedBody();
} catch(Facebook\Exceptions\FacebookResponseException $e) {
    // When Graph returns an error
    echo 'Graph returned an error: ' . $e->getMessage();
    exit;
} catch(Facebook\Exceptions\FacebookSDKException $e) {
    // When validation fails or other local issues
    echo 'Facebook SDK returned an error: ' . $e->getMessage();
    exit;
}

foreach($plainOldArray['data'] as $album) {
    if($album['name'] == 'Timeline Photos') {
        try {
            $response = $fb->get('/'.$album['id'].'/photos');
            $photos = $response->getDecodedBody();
        } catch(Facebook\Exceptions\FacebookResponseException $e) {
            // When Graph returns an error
            echo 'Graph returned an error: ' . $e->getMessage();
            exit;
        } catch(Facebook\Exceptions\FacebookSDKException $e) {
            // When validation fails or other local issues
            echo 'Facebook SDK returned an error: ' . $e->getMessage();
            exit;
        }
    }
}

/*
 * 画像情報を取得
 * 
 */
$picuture  = array();
if(isset($photos)) {
    if(empty($jb_jsons)) {
        // 初回インサート
        foreach($photos['data'] as $photo) {
            /*
             * 画像パスを取得
             *
             */
            $response = $fb->get('/'.$photo['id'].'/picture');
            $picuture = $response->getHeaders();
            var_dump($picuture['Location']);exit;// 画像パス
        }
    }
}

?>

 

■実際にアクセス

①index.phpにアクセス

②var_dumpで画像パスを取得
実践2

③その画像パスをブラウザからアクセス
実践3
※var_dumpを用いてファイルパスを画面上に表示させただけですが、file_get_contents等を使用してファイルを保存することも可能です。

今回はテストユーザに「user_posts」「user_photos」のアクセス権限を付与している為画像を取得することが出来ましたが、今の状態ではまだ実際のfacebookユーザから画像を取得することはできません。

そのため、次回は「Facebookのアプリ申請」について学び、実際のFacebookユーザから画像を取得できる準備をしましょう。