Unlimited Plugins, WordPress themes, videos & courses! Unlimited asset downloads! From $16.50/m
Advertisement
  1. Code
  2. PHP
Code

Pertikaian dengan grafik Facebook API

by
Difficulty:IntermediateLength:LongLanguages:

Indonesian (Bahasa Indonesia) translation by Muhammad Gufron (you can also view the original English article)

Pernahkah anda ingin belajar bagaimana untuk membuat aplikasi anda lebih sosial dengan Facebook? Itu jauh lebih mudah daripada yang anda pikirkan!

Dalam tutorial ini, kita akan membangun sebuah aplikasi yang membaca dan menerbitkan data ke dan dari Facebook dengan menggunakan Facebook Graph API. Tertarik? Bergabung dengan saya setelah melompat!


Pengenalan Singkat ke Open Graph Protocol

Facebook Open Graph

Open Graph Protocol

Image courtesy of http://ogp.me

Open Graph protocol memungkinkan halaman web untuk menjadi kaya obyek dalam grafik sosial. Misalnya, ini adalah yang digunakan di Facebook untuk memungkinkan setiap halaman web memiliki fungsi yang sama dengan objek lain di Facebook.

Sementara banyak teknologi yang berbeda dan skema yang ada dan dapat dikombinasikan bersama-sama, tidak ada satu teknologi yang menyediakan informasi yang cukup untuk kaya mewakili setiap halaman web dalam grafik sosial. Open Graph protocol didasarkan pada teknologi yang sudah ada ini dan memberikan pengembang satu hal yang harus melaksanakan. Pengembang kesederhanaan adalah tujuan utama dari Open Graph protocol yang telah menginformasikan banyak teknis keputusan desain.

Singkatnya, Open Graph Protocol ternyata setiap halaman web menjadi obyek dalam grafik. Masing-masing objek, setidaknya di Facebook graph benda, dapat memiliki banyak benda-benda lain yang terkait dengan itu. Misalnya, Facebook Page dapat memiliki beberapa Pos benda, yang adalah tulisan yang dibuat oleh halaman tersebut. Pada gilirannya, masing-masing Pos objek dapat memiliki beberapa Komentar benda-benda yang melekat padanya, mengacu pada komentar-komentar yang ditulis oleh orang-orang di pos. Hubungan antara objek grafik adalah dasar untuk Facebook Graph API, yang pada gilirannya memungkinkan kita untuk melakukan operasi CRUD pada benda tersebut.

Dalam tutorial ini, kita akan belajar bagaimana cara menggunakan dan mengintegrasikan Facebook Graph API ke dalam aplikasi. Kita juga akan belajar bagaimana menggunakan data dari Graph API untuk melakukan operasi seperti login pengguna melalui Facebook account. Pada akhirnya, kita akan membuat sebuah aplikasi kecil yang memungkinkan dari orang-orang untuk membuat dan membaca posting dari Facebook Page mereka mengelola, mirip dengan HootSuite atau TweetDeck.


Langkah 1: Membuat Facebook Aplikasi

Hal pertama yang harus anda lakukan ketika anda berencana untuk menggunakan Facebook Graph API untuk membuat Facebook aplikasi. Ini tidak berarti bahwa kita akan menempatkan aplikasi pada Facebook (meskipun kita dapat); kita hanya perlu Facebook aplikasi (khusus APP ID dan APP SECRET) untuk mengakses API.

Buka http://developers.facebook.com dan klik pada Aplikasi link di bar navigasi.

Facebook's Developer Site

Facebook adalah Situs Pengembang

Anda akan diminta untuk log in (jika anda tidak) dan memungkinkan Pengembang aplikasi untuk mengakses akun anda. Klik pada Memungkinkan dan anda akan diarahkan ke Pengembang Aplikasi homepage.

Allow the Developer application access

Memungkinkan Pengembang aplikasi akses

Pada Pengembang Aplikasi homepage, klik Create New App di pojok kanan atas halaman.

Developer App homepage

Pengembang Aplikasi homepage

Anda akan disambut dengan modal jendela yang meminta untuk App Display Name dan App Namespace. Memberikan apa pun yang anda inginkan di sini, tapi untuk keperluan tutorial ini, saya akan menggunakan Nettuts+ Halaman Manajer dan nettuts-halaman-manajer masing-masing. Klik Lanjutkan.

Birth of the Nettuts+ Page Manager

Kelahiran Nettuts+ Page Manager

Setelah beberapa wajib captcha memeriksa, anda akan diarahkan untuk anda yang baru dicetak aplikasi halaman. Di sini anda akan melihat APP ID dan APP SECRET yang kita butuhkan. Copy dan paste nilai-nilai ini di suatu tempat untuk kemudian digunakan.

The APP ID and APP SECRET

APP ID dan APP SECRET

Ketika itu selesai, pergi ke bagian bawah halaman dan klik pada "Website" kotak, dan di bawah ini akan muncul form yang meminta URL Situs.Ketika itu selesai, pergi ke bagian bawah halaman dan klik pada "Website" kotak, dan di bawah ini akan muncul form yang meminta URL Situs. Karena aku hanya menggunakan mesin lokal untuk membangun aplikasi, saya akan menggunakan http://localhost/nettuts/pagemanager. Ketika anda selesai, klik pada tombol Save Changes di bawah ini.

Nettuts+ Page Manager Settings

Nettuts+ Halaman Pengaturan Manajer

Langkah 2: Download dan Set Up Facebook PHP SDK

Facebook's GitHub page

Facebook adalah halaman GitHub

Tugas kita selanjutnya adalah untuk men-download dan mengatur Facebook PHP SDK. Lokasi terbaik untuk mendapatkan itu akan berada di Facebook adalah halaman GitHub, karena ini adalah di mana versi terbaru dan terbesar dari PHP SDK akan.

Downloading Facebook's PHP SDK

Men-download Facebook PHP SDK

Arahkan browser anda ke https://github.com/facebook/php-sdk dan klik pada "ZIP" tombol. Ini harus cepat download untuk versi terbaru dari SDK. Simpan di mana saja anda suka.

Sekarang, ekstrak ini ke PHP include_path untuk membuatnya dapat diakses oleh aplikasi apapun. Atau, jika anda hanya menggunakan ini untuk satu aplikasi, ekstrak dalam aplikasi ini folder — hanya pastikan untuk mengambil catatan di mana, karena kami harus mencakup facebook.php dalam kode kita nanti.


Langkah 3: Baca dari Facebook melalui Graph API

Mari kita mulai membuat proyek kami dan menggunakan Facebook Graph API untuk membaca informasi dari Facebook. Untuk pemula, membuat index.php file dimana pengguna dapat log in melalui Facebook. Yang index.php file harus berisi kode berikut:

Jika anda bertanya-tanya, reset.css adalah standar reset stylesheet, dan bootstrap.min.css Twitter Bootstrap. Saya juga telah menambahkan jQuery ke dalam campuran untuk membuatnya lebih mudah untuk melakukan client-side barang-barang. Sekarang, jika anda me-refresh halaman, seharusnya terlihat seperti ini:

Nettuts+ Page Manager First Run
Nettuts+ Halaman Manajer Pertama Yang Menjalankan

Sekarang mari kita membuat kita connect.php file, yang akan memungkinkan kita untuk menghubungkan pengguna Facebook dengan akun dan halaman yang dia atau dia berhasil. Mari kita mulai dengan memasukkan Facebook perpustakaan kita download sebelumnya. Menurunkannya menggunakan APP ID dan APP SECRET:

$Facebook variabel sekarang dapat digunakan untuk membuat panggilan API ke Facebook atas nama aplikasi.

  • AppID pengaturan memberitahu Facebook aplikasi yang kita gunakan.
  • Rahasia setting "mengotentikasi" panggilan API, memberitahu Facebook bahwa mereka datang dari seseorang yang memiliki aplikasi. Ini seharusnya tidak pernah diperlihatkan ke publik, yang mengapa itu bernama "Aplikasi Rahasia."
  • Cookie pengaturan menceritakan perpustakaan untuk menyimpan sesi pengguna menggunakan cookie. Tanpa itu, kita tidak akan dapat mengetahui apakah pengguna yang login melalui Facebook atau tidak.

Sekarang, kita memeriksa apakah pengguna saat ini telah diizinkan akses ke aplikasi. Jika tidak, aplikasi untuk mengarahkan mereka ke Facebook "Memungkinkan Permissions" halaman.

Pada dasarnya, ini adalah semua yang terjadi di sini:

  • Aplikasi membuat API sederhana call untuk mendapatkan pengguna Facebook User ID (juga dikenal sebagai FB UID) melalui $facebook->getUser() metode.
  • Jika $user variabel memiliki nilai, itu berarti bahwa pengguna telah diizinkan izin dasar untuk aplikasi.
  • Jika tidak, maka itu berarti pengguna tidak diperbolehkan izin aplikasi, dan aplikasi kebutuhan untuk redirect ke Facebook izin halaman untuk mendapatkan izin yang diperlukan.
  • Hal ini kemudian menghasilkan URL Login, yang mana aplikasi harus mengarahkan pengguna ke show Facebook ini halaman izin untuk aplikasi. Yang getLoginUrl() metode yang diperlukan dalam parameter berikut:
    • lingkup ini adalah daftar dipisahkan koma permissions aplikasi kebutuhan
    • fbconnect - ini harus menjadi 1 untuk memberitahu Facebook bahwa aplikasi akan menggunakan Facebook untuk mengotentikasi pengguna
    • redirect_uri - ini adalah halaman Facebook untuk mengarahkan setelah pengguna telah melalui Facebook halaman izin

    Anda dapat membaca lebih lanjut tentang getLoginUrl() metode berikut: https://developers.facebook.com/docs/reference/php/facebook-getLoginUrl/

  • Setelah itu, aplikasi akan mengarahkan pengguna untuk Login URL dan pengguna melihat Facebook izin halaman.
Facebook's Permissions Page

Facebook adalah Halaman Izin

Facebook Permissions

Mari kita luangkan waktu sebentar untuk berbicara tentang Facebook izin. Mirip dengan ketika anda menginstal sebuah aplikasi pada ponsel Android anda, Facebook izin berbagai tingkat akses Facebook aplikasi dapat melakukan atas nama pengguna. Misalnya, jika kita ingin akses ke alamat email pengguna, kita dapat menambahkan email izin untuk lingkup pengaturan yang kita gunakan untuk menghasilkan login URL.

Ingat, dengan kekuatan besar datang tanggung jawab besar, jadi pastikan untuk hanya menggunakan izin anda untuk kebaikan, bukan untuk kejahatan.

Itu penting bahwa aplikasi anda hanya akan meminta pengguna untuk izin yang benar-benar dibutuhkan. Jika anda hanya perlu untuk melakukan otentikasi pengguna melalui Facebook, anda bahkan tidak perlu meminta izin sama sekali! Ingat, dengan kekuatan besar datang tanggung jawab besar, jadi pastikan untuk hanya menggunakan izin anda untuk kebaikan, bukan untuk kejahatan.

Dalam aplikasi, kami menggunakan izin berikut:

  • publish_stream - memungkinkan aplikasi untuk mempublikasikan update ke Facebook atas nama pengguna
  • read_stream - memungkinkan aplikasi untuk membaca dari pengguna kabar Berita
  • offline_access - mengubah access_token satu yang tidak berakhir, dengan demikian membiarkan aplikasi membuat panggilan API kapan saja. Tanpa ini, aplikasi ini access_token akan berakhir setelah beberapa menit, yang tidak ideal dalam hal ini
  • manage_pages - memungkinkan aplikasi mengakses pengguna Facebook Pages. Karena aplikasi kami sedang membangun kesepakatan dengan Facebook Halaman, kita akan membutuhkan ini juga.

Ada banyak permissions Facebook membutuhkan untuk hal-hal yang berbeda. Anda dapat membaca semua tentang mereka di Facebook dokumentasi untuk izin.

Kembali ke aplikasi tersebut, sekarang yang pengguna telah diizinkan izin yang diperlukan oleh aplikasi ini, kita dapat melakukan beberapa panggilan API untuk Facebook! Tempat ini di dalam if-else blok dari kode di atas:

Hal pertama yang kami lakukan adalah mendapatkan $access_token bagi pengguna bahwa aplikasi hanya dikonfirmasi. Hal ini sangat penting, sebagai aplikasi yang akan membutuhkan access token untuk hampir segala sesuatu yang kita lakukan. Untuk mendapatkannya, kita gunakan getAccessToken() metode. $Access_token bertindak sebagai 'password' bagi pengguna. Itu selalu unik untuk setiap pengguna pada setiap aplikasi, jadi pastikan untuk menyimpan ini bila diperlukan.

Setelah itu, kita dapat melihat bagaimana untuk membuat panggilan API ke Facebook menggunakan api() metode. Metode ini mengambil parameter berikut:

  • $graph_path - ini adalah Facebook graph jalan, yang pada dasarnya adalah "URL" untuk open graph objek yang ingin kita akses. Ini dapat berupa grafik objek di Facebook, seperti Posting (misalnya '/'), Komentar (misalnya '/'), atau bahkan Pengguna ('/me' adalah sebuah jalan pintas bagi pengguna saat ini siapa $access_token milik. Hal ini juga dapat '/' atau '/', tapi $access_token yang anda gunakan harus memiliki akses kepada pengguna tersebut, atau anda hanya akan bisa mendapatkan pengguna informasi publik).
  • $metode - ini adalah jenis metode yang ingin anda lakukan. Biasanya DAPATKAN ketika anda mencoba untuk "mendapatkan" informasi, dan POSTING ketika anda mencoba untuk "posting" atau memperbarui informasi dan HAPUS jika anda ingin menghapus informasi. Jika anda tidak yakin, Grafik dokumentasi API memberitahu anda metode yang digunakan untuk menemukan panggilan API.
  • $params - ini adalah parameter yang datang dengan permintaan API. Biasanya untuk MENDAPATKAN metode anda hanya perlu untuk menyediakan pengguna $access_token. Untuk POSTING metode meskipun, anda juga akan perlu untuk memberikan parameter lainnya. Misalnya, jika anda ingin posting baru update status, anda bisa memberikan status update pesan di sini.

Selain itu, kita juga dapat menggunakan api() metode untuk melaksanakan FQL (Facebook Query Language) query, yang memungkinkan kita mendapatkan data melalui SQL-gaya bahasa. Ini bagus untuk mengambil informasi tidak tersedia dalam Grafik API, serta menjalankan beberapa query dalam satu panggilan. Sebagai contoh, kita bisa mendapatkan nama pengguna dan rincian lainnya melalui FQL API call:

Kita tidak perlu ini untuk tutorial ini, tapi itu baik untuk menjaga ini dalam pikiran ketika anda menemukan sesuatu Graph API tidak bisa.

Sekarang bahwa kita memiliki daftar izin pengguna telah diizinkan untuk aplikasi, kita perlu memeriksa apakah pengguna memberikan semua aplikasi yang diperlukan. Sejak Facebook izin halaman memungkinkan pengguna untuk mencabut izin tertentu, kita perlu memastikan bahwa semua dari mereka telah diizinkan untuk memastikan aplikasi bekerja. Jika pengguna telah dicabut salah satu izin, kami akan mengarahkan mereka kembali ke halaman izin.

var_dump() of the $permissions_list variable

var_dump() dari $permissions_list variabel

Ketika itu dilakukan, itu berarti kita sudah siap dan kita akan mampu menjalankan aplikasi tanpa masalah. Mari kita mulai dengan melakukan panggilan API, kali ini untuk mengambil daftar Facebook Halaman pengguna yang memiliki hak administratif, dan tabungan ini menjadi variabel sesi. Setelah itu, kami akan mengarahkan pengguna ke manage.php halaman, dimana halaman manajemen kode akan.

var_dump() of the $accounts variable

var_dump() dari $akun variabel

/Me/akun grafik jalan memberikan kita sebuah daftar dari halaman-halaman yang pengguna memiliki hak administratif. Ini mengembalikan sebuah array dari semua halaman, ditambah tertentu $access_tokens untuk masing-masing halaman tersebut. Dengan orang-orang $access_tokens, kita akan dapat melakukan panggilan API pada nama Facebook Page juga!

Simpan ini di $_SESSION array dan redirect ke manage.php halaman.

Mari kita mulai bekerja pada kami manage.php file. Ingat bahwa kita sudah diselamatkan pengguna $daftar akun ke $_SESSION array, serta mengatur akun pertama pada daftar sebagai default halaman aktif. Mari kita MENDAPATKAN bahwa akun ini news feed dan menampilkannya:

Sekali lagi, aplikasi ini tidak intialization dari Facebook perpustakaan, dan kemudian api lain() call, kali ini untuk /me/pakan. Perhatikan bahwa alih-alih menggunakan user access token, kami menggunakan halaman aktif akses token (melalui $_SESSION['aktif']['access_token']). Ini memberitahu Facebook bahwa kita ingin mengakses informasi seperti Facebook Page dan bukan sebagai pengguna.

var_dump() of the $page_feed variable

var_dump() dari $page_feed variabel

Wow, banyak informasi tentang Facebook Posting. Mari kita membedah satu Facebook Posting objek dan melihat apa itu terbuat dari.

The Facebook Posting Obyek

Facebook Post Cheat Sheet

Facebook Posting Cheat Sheet

  • id - ini adalah Posting ID
  • dari - berisi informasi tentang pengguna yang memposting pesan
  • pesan (merah) - pesan komponen posting
  • gambar (oranye) - link ke foto yang terpasang ke pos
  • nama (biru) - "judul" dari Facebook post
  • link (juga biru) - link ke mana nama berjalan untuk saat diklik
  • caption (ungu) - beberapa kata-kata untuk menggambarkan link
  • deskripsi (pink) - lebih dari beberapa kata-kata untuk menggambarkan link
  • ikon (abu-abu) - link untuk gambar ikon yang digunakan
  • tindakan - Facebook tindakan yang dapat anda lakukan untuk posting, seperti Menyukai atau Mengomentari hal itu.
  • privasi - privasi post
  • jenis - jenis pos. Posting dapat status, link, foto, atau video.
  • created_time - saat posting ini dibuat
  • updated_time - waktu ketika posting diperbarui
  • komentar - komentar pada posting

Ini akan menjadi bijaksana untuk menyimpan salinan dari lembar contekan di atas, karena kita akan menggunakan itu lagi ketika kita mempublikasikan Posting objek untuk Facebook.

Moving on, biarkan tampilan news feed yang lebih menyenangkan. Tambahkan kode HTML berikut di bawah ini kode PHP:

Kita menggunakan simple Graph API trik berikut ini: Gambar Graph API obyek. Pada dasarnya, anda dapat mengambil Grafik path dari setiap Pengguna atau Halaman objek (misalnya http://graph.facebook.com/293518907333589), tambahkan /gambar di akhir dan anda akan mendapatkan 50x50 foto dari objek tersebut. Misalnya:

https://graph.facebook.com/293518907333589/picture

Menjadi...

Demo Gambar Graph API Obyek

Akan kembali, ketika kita me-refresh manage.php halaman sekarang, seharusnya terlihat seperti ini:

Tambahkan ini di dalam untuk menampilkan feed dari laman:

Ketika anda me-refresh halaman lagi, seharusnya terlihat seperti ini:

Terlihat baik, kan? Kita harus berterima kasih pada Twitter Bootstrap CSS untuk itu!

Sekarang, mari kita tambahkan atas bar navigasi untuk membantu kita beralih dari satu halaman ke halaman lain. Tambahkan kode HTML berikut setelah tag dan sebelum kode tag:

Jangan lupa untuk load library JavaScript dropdown dari Twitter Bootstrap JavaScript halaman. Anda dapat men-download di sini.

Terakhir, mari kita membuat switch.php file, dimana kita bisa mengatur halaman lain seperti halaman aktif:

Menyegarkan manage.php halaman lagi dan anda harus melihat sesuatu seperti ini:

Dan sekarang, dengan menggunakan dropdown switcher, kita dapat beralih halaman.


Langkah 4: Mempublikasikan ke Facebook melalui Graph API

Sekarang kami siap untuk mempublikasikan update baru untuk halaman kami! Pertama-tama, mari kita membuat form HTML di mana kita dapat mengatur apa yang akan kita publish. Tambahkan ini di bawah Posting baru update HTML:

Refresh untuk melihat bagaimana tampilannya:

Mencintai Twitter Bootstrap default bentuk gaya

Posting cheat sheet harus datang berguna ketika kita mencari tahu apa yang harus dimasukkan ke dalam kolom. Sekarang, mari kita membuat newpost.php file dimana kita akan benar-benar menggunakan Facebook Graph API untuk mempublikasikan ke halaman feed.

Mulai dengan membuat file dan inisialisasi Facebook perpustakaan seperti yang kami lakukan untuk halaman-halaman yang lain:

Setelah itu, mari kita mendapatkan semua konten yang kami terima dari permintaan POST:

Mari kita tidak lupa untuk menambahkan $access_token untuk halaman dengan parameter:

Sekarang kita telah memiliki $parameter array, mari kita membangun dan mengirim API Grafik permintaan!

Perhatikan apa perbedaan $metode yang dapat membuat. MENDAPATKAN API panggilan untuk /me/feed akan kembali news feed dari objek tertentu, tetapi sebuah POS API panggilan untuk /me/feed akan posting status baru update ke objek.

Untuk mempublikasikan Posting baru objek untuk Facebook, aplikasi kebutuhan untuk membuat panggilan ke //feed grafik jalan, dan perlu pasokan berikut di $parameter array:

  • access_token - token akses dari akun kami menerbitkan untuk
  • pesan - pesan untuk mempublikasikan
  • gambar (opsional) - link ke foto pos
  • name (opsional) - "judul" posting
  • link (opsional) - link ke mana akan pergi ketika diklik
  • keterangan (opsional) - beberapa kata-kata untuk menggambarkan link/nama
  • deskripsi (opsional) - lebih dari beberapa kata-kata untuk menggambarkan link/nama

Anda dapat melihat bahwa satu-satunya parameter yang diperlukan adalah access_token dan pesan parameter. Dengan hanya menyediakan dua ini, kita dapat mempublikasikan sederhana pesan status, seperti:

Status Update Contoh

Segala sesuatu yang lain adalah opsional. Namun, jika anda memberikan nama, link, teks, atau diskripsi perusahaan, anda harus memberikan semua empat. Sebagai gambaran, jika nilai parameter yang tidak disediakan atau tidak dapat diakses, posting gambar akan kosong.

Akhirnya, mari kita mencoba mempublikasikan ke Facebook menggunakan aplikasi! Kembali ke manage.php halaman dan mengisi formulir, kemudian tekan Posting:

Setelah itu, anda harus diarahkan kembali ke manage.php halaman, tapi harus ada posting baru pada pakan!

Penerbitan ke Facebook sukses!

Anda juga dapat memeriksa Facebook Page itu sendiri. Anda harus melihat posting baru di sana:

Penerbitan ke Facebook Halaman


Kesimpulan

Sekarang, anda sudah harus memiliki pemahaman yang jelas tentang cara menggunakan Facebook Graph API untuk membaca dan mempublikasikan ke Facebook. Dalam tutorial ini, kita hanya membahas dasar-dasar — ada banyak lagi yang dapat anda lakukan dengan menggunakan Graph API. Hal-hal seperti update real-time, yang memungkinkan anda berlangganan ke peristiwa-peristiwa yang terjadi pada aplikasi ini pengguna (misalnya ketika pengguna mengubah nya/foto profil) atau Wawasan Grafik objek, yang memungkinkan anda untuk mendapatkan statistik dari sebuah aplikasi, halaman, atau domain pengguna memiliki akses ke.

Tentu saja, sumber daya terbaik untuk belajar lebih banyak tentang Graph API ini tidak diragukan lagi Facebook Graph API dokumentasi, tapi saya juga sarankan mengambil melihat di FBDevWiki, yang merupakan pihak ketiga host wiki untuk Facebook Pengembangan dokumentasi.

FBDevWiki.com

Selain itu, ada juga yang khusus Facebook versi StackOverflow yang dapat anda kunjungi di http://facebook.stackoverflow.com. Pertanyaan-pertanyaan di sini adalah semua tentang Facebook dan Facebook Pembangunan, sehingga itu juga yang harus dikunjungi jika anda memerlukan bantuan atau memiliki pertanyaan tentang subjek.

Facebook StackOverflow

Mudah-mudahan, anda telah belajar dari tutorial ini cara mudahnya adalah dengan menggunakan Facebook Graph API untuk membuat aplikasi anda lebih sosial.

Apakah anda menggunakan Facebook Graph API di proyek sebelumnya, atau apakah anda berencana untuk menggunakannya sekarang? Ceritakan semua tentang hal itu di komentar di bawah ini dan terima kasih banyak untuk membaca!

Advertisement
Advertisement
Advertisement
Advertisement
Looking for something to help kick start your next project?
Envato Market has a range of items for sale to help get you started.