Facebook Graph API ตอนที่ 13 สร้าง Album ภาพและอัพโหลดรูป

สำหรับ Graph API ของ Faecbook ในรอบนี้จะพาทุกคนรู้จักการสร้าง Album และ อัพโหลดภาพถ่ายไปไว้ใน Profile ของเราโดยใช้ Facebook PHP SDK ครับสังเกตเวลาเราเล่นแอพพลิเคชันบน Facebook พวกเกม หรือ Tag เพื่อนๆ บางเกม หรือบางแอพพลิเคชันจะมีการสร้าง Album รูปใหม่ให้เรา อย่างเกมเมื่อก่อนพวก Pet Society ไม่ก็เกมพวกที่มีการถ่ายภาพนั่นแหละครับ ซึ่งฟังก์ชันของมันนั้นไม่ได้ซับซ้อนอะไรเลยครับต้องรุ้ทฤษฏีในการขอ Permission เข้าถึงข้อมูลเพิ่มเติมเล็กน้อยเท่านั้น

ก่อนจะเข้าถึงบทเรียนนี้ จำเป็นจะต้องมีความรู้ในเรื่องของการใช้งาน Facebook SDK สำหรับภาษา PHP นะครับ ซึ่งถ้าใครยังไม่รู้ว่าใช้งานยังไงหรือจะเริ่มต้นยังไง แนะนำให้ไปอ่านบทความเหล่านี้ก่อนนะครับ

ศึกษาก่อนจะเข้าถึงส่วนนี้นะครับ ผมจะไม่อธิบายในเรื่องของ ไฟล์ facebook.php ใน SDK ว่าใช้ร่วมกับการพัฒนายังไง

เริ่มต้นพัฒนา Facebook Graph API เพื่อสร้าง Album และอัพโหลดรูปภาพ
ทำการ ดาวน์โหลด PHP SDK สำหรับ Facebook API มาติดตั้งไว้บน Host หรือเว็บไซต์ของคุณนะครับ แล้วสร้างโฟลเดอร์ใหม่ขึ้นมาว่า “apps” วางไว้ที่เดียวกับ ไฟล์ SDK ของเราเลยครับ

สร้างโฟลเดอร์ใหม่ขึ้นมาว่า "apps" — สร้างโฟลเดอร์ใหม่ขึ้นมาว่า “apps”

หลังจากนั้นสร้างไฟล์ index.php ขึ้นมาบน โฟลเดอร์ “apps” ครับ ใส่ Code นี้ไว้เบื้องต้นก่อนเลย

ถ้าใครที่วาง Path แตกต่างจากผมก็แก้ไข require(‘../src/facebook.php’); ให้ตรงกันเอาเองนะครับ
หลังจากนั้นให้ไปที่ http://developers.facebook.com ทำการสร้าง Apps ใหม่ขึ้นมาครับ เพื่อที่จะใช้ APP ID และ APP SECRET และ URL ที่จะใช้รันแอพพลิเคชันเว็บไซต์ของเรา ตัวอย่างผมจะสร้างไว้ที่ https://www.daydev.com/demo/postntag/apps/ ครับ

ทดสอบการดึงข้อมูลและขอ Permission จาก Graph API Explorors ก่อนก็ดีครับที่ https://developers.facebook.com/tools/explorer เพื่อตั้งค่าขอสิทธิอะไรตามนี้ครับ

ถ้าลองศึกษาดูแล้วกลับไปที่หน้า index.php ของเราครับแล้วใส่ Code ดังนี้





Untitled Document



top.location.href='" . $dialog_url . 
           "'");
       } 
       else {
         $token_url= "https://graph.facebook.com/oauth/"
         . "access_token?"
         . "client_id=" .  $app_id 
         . "&redirect_uri=" . urlencode( $post_login_url)
         . "&client_secret=" . $app_secret
         . "&code=" . $code;
         $response = file_get_contents($token_url);
         $params = null;
         parse_str($response, $params);
         $access_token = $params['access_token'];

         // Create a new album
         $graph_url = "https://graph.facebook.com/me/albums?"
         . "access_token=". $access_token;
   
         $postdata = http_build_query(
         array(
          'name' => $album_name,
          'message' => $album_description
            )
          );
         $opts = array('http' =>
         array(
          'method'=> 'POST',
          'header'=>
            'Content-type: application/x-www-form-urlencoded',
          'content' => $postdata
          )
         );
         $context  = stream_context_create($opts);
         $result = json_decode(file_get_contents($graph_url, false, 
           $context));

         // Get the new album ID
         $album_id = $result->id;

         //Show photo upload form and post to the Graph URL
         $graph_url = "https://graph.facebook.com/". $album_id
           . "/photos?access_token=" . $access_token;
         echo '';
         echo '';
         echo 'Adding photo to album: ' . $album_name .'

';
         echo 'Please choose a photo: ';
         echo '

';
         echo 'Say something about this photo: ';
         echo '

';
         echo '
';
         echo '';
         echo '';
      }
?>

ลองทำการ รันดูครับที่ หน้าตัวอย่างที่ผมทำไว้
https://www.daydev.com/demo/postntag/apps/

ไปหน้า Album แล้วหาภาพ และตั้งชื่อ album

ทำการ คลิกที่ Login แล้วเข้าระบบด้วยบัญชี Facebook จะมีหน้า “สร้าง Album ภาพ” ข้างๆปุ่ม Logout

ทำการ อัพโหลดรูป จากเครื่องเราขึ้นไปหน่อย แล้วใส่ชื่อ Album ลงไปแล้วอัพโหลดเลย

ผลลัพธ์ที่ได้หลังจาก อัพโหลดเสร็จจะ Return เป็น API View

กลับไปที่ Profile ของผมที่อัพดูสักหน่อย ที่ Photo
จะเห็นภาพล่าสุดที่อัพขึ้นไป ถ้ากดเข้าไปที่ Album ก็จะเห็น รายละเอียดเหมือนที่ Code ของเราเขียนไว้ใน PHP ครับ