มาลองพัฒนาเว็บแอพพลิเคชันด้วย PHP กับ Foursquare API กันซักหน่อยดีกว่า เพราะตอนนี้ Foursquare เองก็เป็นเหมือนแอพพลิเคชันที่มียอดผู้ใช้เติบโตขึ้นมา และการใช้ Location Based Service ในตอนนี้ก็เริ่มเป็นอะไรที่เสรีเอาเป็นว่าลองมาฝึกเขียน API ของ foursquare ด้วย PHP สำหรับโชว์สถานที่ล่าสุดที่เราได้ Check-in เพื่อว่า บัญชีผู้ใช้พวก คนดัง ทั้งหลายจะเอาไปประยุกต์ใช้ในการแสดงผลเป็น Widget ไว้ติดบน Blog ก็เก๋ไม่เบาครับมาเริ่มกันหน่อยดีกว่า

พัฒนา Widget บนเว็บด้วย Foursquare API กับ PHP

มาเริ่มกันครับก่อนอื่นนั้นเราต้องเข้าสู่ระบบไปที่หน้าเว้บไซต์ foursquare ก่อนครับ แล้วให้เข้าไปที่เว็บไซต์ https://developer.foursquare.com/ เพื่อทำการขอ API มาใช้พัฒนาร่วมกับภาษาโปรแกรม PHP ครับ ให้เราทำการ Register API ของเราเลยครับ ซึ่งในที่นี้ผมตั้งชื่อ API ของผมว่า doTips และใช้ URL สำหรับ Call Back เพื่อแสดงผลบนเว็บของผมคือ https://www.daydev.com/dotips ครับ

ทำการเข้าสู่ระบบหน้าเว็บไซต์ foursquare ก่อน

เมื่อเราได้ทำการ Register ขอ API แล้วเราจะได้ข้อมูล CLIENT ID สำหรับขอ Token Key ของ foursquare ครับ ดังรูปที่ปรากฏด้านล่าง

ข้อมูล รหัส Client ID ของ fousquare สำคัญนะครับอย่าให้คนอื่นรู้เลยเชียวนา

ให้สังเกตนะครับว่าผมจะวงตัวแดง ไว้คืออันดับที่ 1 นั่นคือ client ID และ 2 คือ CallBack URL ซึ่งเราจะเอาไว้ใช้ในการเขียนโปรแกรมครับ

ต่อมาให้เราไปดาวน์โหลด ไฟล์ Librarry ของ foursquare API ครับที่

http://code.google.com/p/foursquare-php

จะเป็นไฟล์แค่ไฟล์เดียวที่ชื่อ foursquare.php ให้ทำการดาวน์โหลดลงมาไว้บน Folder ที่เราจะใช้พัฒนาโปรแกรมครับ ของผมคือ Folder “dotips” ดังรูป

ต่อมาให้สร้างไฟล์ที่ชื่อว่า index.php ครับเอาไว้ทำงาน โดยต้องอยู่ Path เดียวกับ foursquare.php นะครับ

ไฟล์ index.php กับ foursquare.php อยู่ที่เดียวกัน

ต่อมาให้ไปขอ Token ID โดยไปที่ URL ดังต่อไปนี้

https://foursquare.com/oauth2/authenticate?client_id=ใส่ Client ID&response_type=code&redirect_uri=ใส่ CallBack URL

เราก็จะได้รหัส Token ID มาให้ Copy มันมาเก็บไว้ใน Notepad ก่อนนะครับ

เปิดโปรแกรมแก้ไขไฟล์ อย่าง Notepad, Notepad++ หรือ eclipse for PHP ขึ้นมาครับเพิ่ม Code ลงไปในไฟล์ index.php ตามนี้

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html>
<?php require_once ‘foursquare.php’; //including the class
$fq = new fourSquare(“ใส่ Token ของคุณ”); //fetching the checkins data
?>
<body>
<div id=”foursquare” style=”text-align:center”>

<h2>Test Foursquare API with PHP:</h2>
<!–displaying the foursquare logo for the venue type–>
<img src=”<?php echo $fq->venueIcon ?>” />
<!–displaying the venue name and the venue type–>
<?php echo $fq->venueName ?> (<?php echo $fq->venueType ?>)<br/>
<!– displaying the venue address –>
<?php echo $fq->venueAddress . “, ” . $fq->venueCity . “, ” . $fq->venueState . “, ” . $fq->venueCountry ?><br/>
<!–Displaying the map–>
<img src=”<?php echo $fq->getMapUrl(500, 250) ?>” /><br/>
<!– displaying the user comment–>
<i><?php echo $fq->comment ?></i><br>
</div>
</body>
</html>

หรือดาวน์โหลดไฟล์ที่แก้ไขแล้วได้ที่นี่ https://www.daydev.com/dotips/source.zip

ทดสอบลอง Upload ไฟล์ index.php และ foursquare.php ขึ้นไปบน Server ของเว็บไซต์ ในที่นี้คือโฟล์เดอร์ doTips ของตัวอย่างที่ผมทำ

เปิด URL ขึ้นมา ตัวอย่างของผม ผมทำไว้ที่ https://www.daydev.com/dotips/index.php จะเห็นว่ามันจะบอก ตำแหน่งที่ผม check-in ครั้งล่าสุด แผนที่โดย Google Maps และข้อความที่ผมทำการ Shout ออกไป ขนาดของแผนที่นั้นสามารถแก้ไขที่ไฟล์ index.php ได้เลยนะครับ

เอาเป็นว่านี่ก็คงเป็นตัวอย่างอีกวิธีหนึ่งในการใช้ foursquare API ร่วมกับ PHP ได้อย่างมีประสิทธิภาพ และไม่ยากเลย ทำตามได้สบายๆ ไว้โอกาสหน้าจะมาปล่อยของอีกนะครับ