
Instagram ถือเป็น social media อีกหนึ่งเจ้าที่คนนิยมเล่นกัน ซึ่งทำให้งานเทำเว็บจำนวนมากต้องการเอารูปหรือโพสต์ล่าสุดมาแสดงในเว็บเพื่อให้เว็บมีการอัปเดทข้อมูลของเว็บไปด้วย
ขั้นตอนในการสมัครขอใช้ api กับ instagram
1 ไปที่ https://www.instagram.com/developer/ และ login ถ้ามี user instagram แล้วแต่หากยังไม่มีก็สมัครใหม่
2 หลังจากสมัครและ login แล้วจะมาหน้า Dashboard กดเลือก Manage Clients และเลือก Register a New Client

3 หลังจากนั้นจะมาหน้า Register new Client ID กรอกรายละเอียดลงไปครับ

4 เมื่อกรอกเสร็จแล้วเราจะได้ Client Id มา

5 หลังจากได้ค่า Client id มาเราจะมาทำการขอ Token โดยพิมพ์
https://api.instagram.com/oauth/authorize/?client_id=74f33836b340e5135135&redirect_uri=http://webunique.in.th&response_type=token
อย่่าลืมเปลี่ยน Client id และ redirect url ครับ
และ copy ไปวางใน browser
6 ถ้าไม่มี Error อะไรเราจะมาอยู่หน้ายืนยันกด Authorize

7 เราก็จะได้ Token Access ซักที (หลายขั้นตอนจริงๆ)

เรามาดูตัวอย่างกันครับ
จากตัวอย่างผมใช้ javascript ในการดึงข้อมูลมาแสดง 6 รูปล่าสุดที่โพสต์
var token = '5447071285.9ad93e2.xxxxxxxxxxxxxxxxxx', //ใส่ค่า Token ที่ได้มาจากวิธีด้านบน
userid = 555555555, // เป็น user id ของเราครับ ได้มาจากเข้าไป view source ใน instagram ของเราครับ (เราต้อง login อยู่ )
num_photos = 10; // จำนวนรูป
$.ajax({ // เรียก ajax
url: 'https://api.instagram.com/v1/users/' + userid + '/media/recent', // จริงๆมีการดึงข้อมูลหลายแบบ สามารถดูใน Doc Endpoints
dataType: 'jsonp',
type: 'GET',
data: {access_token: token, count: num_photos}, // ค่าที่ส่งไป
success: function(data){
for( x in data.data ){ // loop รูปที่ได้มา
// ใส่ li list ใน class ที่ต้องการ
$('.instx').append('<li><img src="'+data.data[x].images.low_resolution.url+'"></li>');
}
},
error: function(data){
console.log(data);
}
});