Build

Login untuk Game di Facebook

The Web Games on Facebook and Facebook Gameroom platforms are no longer available for new submissions. This documentation is intended solely for developers with existing games. To learn more, read our blog post.

Ketika Anda membuat game untuk dimainkan di Facebook.com, Anda sedang membuat aplikasi web yang akan disajikan di dalam kontainer iframe di Facebook.com. Karena Facebook hanya menyajikan game untuk pemain yang telah login, ini berarti Anda dijamin memiliki pengguna Facebook yang telah login tersedia untuk autentikasi.

Dengan demikian, Anda harus selalu menyertakan dukungan Facebook Login ke game Anda, guna memberikan ID yang konsisten untuk menyinkronkan dan melanjutkan kemajuan game, dan untuk menerapkan fitur sosial yang diharapkan gamer dalam game yang dimainkan. Jika game Anda ada di berbagai platform, Anda dapat menggunakan ID yang sama ini untuk menyinkronkan status game bagi pemain Anda di seluruh perangkat yang mereka gunakan.

Dokumen ini menjelaskan berbagai pendekatan dalam menggunakan Facebook Login dan bagaimana Anda dapat memanfaatkannya sebaik mungkin dalam game Anda.

Sumber Autentikasi

Ada sejumlah cara yang dapat dilakukan pemain untuk mengautentikasi pertama kalinya, dan beberapa pendekatan untuk memverifikasi identitas setelah autentikasi pertama.

Autentikasi Pusat Aplikasi

Ketika pemain meluncurkan game melalui tombol Main Sekarang di Pusat Aplikasi, mereka memberikan autentikasi kepada aplikasi Anda untuk set izin tertentu seperti yang dikonfigurasikan di tab Detail Aplikasi di Dasbor Aplikasi.

Tombol Mainkan Sekarang di Pusat Aplikasi

Mengingat tingginya persentase pemain yang akan masuk ke aplikasi Anda melalui Pusat Aplikasi, ini akan menjadi jalur autentikasi umum. Untuk memastikan login yang lancar dari Pusat Aplikasi, Anda harus mengonfigurasi set izin yang diberikan melalui Pusat Aplikasi agar sesuai dengan izin yang diharapkan game Anda di Facebook.com dan di perangkat seluler.

Lihat panduan Pusat Aplikasi untuk detail selengkapnya.

Autentikasi di platform lain

Jika game Anda ada di platform seluler, dan mendukung Facebook Login dalam versi seluler, ada kemungkinan beberapa pemain Anda sudah diautentikasi ketika mereka masuk untuk bermain game Anda di Facebook.com. Penting untuk memastikan bahwa versi game Anda di Facebook.com mengharapkan set izin yang sama dengan game seluler Anda.

Mendeteksi Status Login

Seperti yang dijelaskan di atas, pemain akan masuk ke game Anda dengan status login atau tidak login , tergantung apakah mereka telah mengautentikasi game Anda sebelumnya, baik dengan pernah memainkan game Anda di Facebook, melalui Pusat Aplikasi, atau melalui versi seluler game Anda.

Anda dapat mendeteksi apakah pemain telah masuk ke game Anda sebelumnya dengan salah satu dari dua cara:

  • Sisi klien, menggunakan metode FB.getLoginStatus() JavaScript SDK
  • Sisi-server, dengan mendekode signed_request

Menggunakan Facebook SDK untuk JavaScript

Dengan memanggil FB.getLoginStatus() pada muatan dokumen, Anda dapat memastikan bahwa pemain segera login ketika mereka memuat game. Anda kemudian dapat menggunakan FB.api() untuk mengakses status game pemain melalui ID pengguna mereka, dan untuk mengambil informasi yang digunakan untuk personalisasi, seperti nama pemain, foto profil, dan daftar teman.

FB.getLoginStatus(function(response) {
  if (response.status === 'connected') {
    // the user is logged in and has authenticated your
    // app, and response.authResponse supplies
    // the user's ID, a valid access token, a signed
    // request, and the time the access token 
    // and signed request each expire
    var uid = response.authResponse.userID;
    var accessToken = response.authResponse.accessToken;
  } else if (response.status === 'not_authorized') {
    // the user is logged in to Facebook, 
    // but has not authenticated your app
  } else {
    // the user isn't logged in to Facebook.
  }
 });

Jika pemain belum login, Anda dapat memanggil FB.login(...) untuk menampilkan versi modal dari dialog login di atas layar awal game Anda. Panggilan balik untuk dialog ini harus menjadi metode panggilan yang sama yang Anda gunakan saat memanggil FB.getLoginStatus

Menggunakan Permintaan yang Ditandatangani

Saat game Anda dimuat di Facebook, permintaan HTTP POST dibuat ke URL Game Web Facebook yang Anda tentukan. Permintaan POST ini akan berisi beberapa parameter termasuk parameter signed_request yang dapat Anda gunakan untuk otorisasi.

signed_request berenkode base64url dan ditandatangani dengan versi HMAC Rahasia Aplikasi Anda, berdasarkan spesifikasi OAuth 2.0.

Apa artinya ini adalah bahwa ketika di-POST ke aplikasi Anda, Anda perlu parsing dan memverifikasinya sebelum dapat digunakan. Ini dilakukan dalam tiga langkah:

  1. Pisahkan permintaan yang ditandatangani menjadi dua bagian yang digambarkan dengan karakter '.' (misalnya: 238fsdfsd.oijdoifjsidf899)
  2. Dekode bagian pertama - tanda tangan berenkode - dari base64url
  3. Decode bagian kedua - payload - dari base64url dan kemudian dekode objek JSON yang dihasilkan

Langkah-langkah ini dimungkinkan dalam bahasa pemrograman modern apa pun. Di bawah ini adalah contoh dalam PHP:

function parse_signed_request($signed_request) {
  list($encoded_sig, $payload) = explode('.', $signed_request, 2); 

  $secret = "appsecret"; // Use your app secret here

  // decode the data
  $sig = base64_url_decode($encoded_sig);
  $data = json_decode(base64_url_decode($payload), true);

  // confirm the signature
  $expected_sig = hash_hmac('sha256', $payload, $secret, $raw = true);
  if ($sig !== $expected_sig) {
    error_log('Bad Signed JSON signature!');
    return null;
  }

  return $data;
}

function base64_url_decode($input) {
  return base64_decode(strtr($input, '-_', '+/'));
}

Ini akan menghasilkan objek JSON yang terlihat seperti ini:

{
   "oauth_token": "{user-access-token}",
   "algorithm": "HMAC-SHA256",
   "expires": 1291840400,
   "issued_at": 1291836800,
   "user_id": "218471"
}

Dengan parsing parameter signed_request, Anda akan dapat mendeteksi apakah pemain saat ini telah mengautentikasi game Anda. Jika sudah login, signed_request akan berisi ID pengguna pemain, yang dapat Anda gunakan untuk mengambil informasi personalisasi dan status permainan. Anda dapat menukar signed_request ini dengan token akses, dan menggunakannya untuk mengakses Graph API untuk personalisasi yang lebih mendalam.

Autentikasi Pertama Kali

Saat pertama kali seorang pemain masuk ke game, Anda harus mengundang mereka untuk autentikasi dengan menyajikan Dialog Login. Login sisi-klien melalui JavaScript SDK adalah alur login yang direkomendasikan untuk autentikasi. Developer dapat menampilkan grafik game sederhana sebelum meluncurkan dialog login dan setelah membatalkan dialog.

Happy Acres, yang menggunakan latar belakang khusus saat login

Login sisi klien melalui JavaScript SDK

Khusus game di Facebook, versi JavaScript dari Dialog Login akan terpicu dalam mode async di dalam iframe. Ini berarti Dialog Login muncul sebagai pop-up modal di seluruh konten game, dan bukan sebagai jendela browser pop-up terpisah.

Hal ini penting, karena ini berarti bahwa dialog dapat dipanggil langsung dari kode, dan bukan sebagai bagian dari peristiwa UI, tanpa diblokir oleh metode deteksi yang memblokir pop-up browser.

Akibatnya, Anda bisa menggunakan FB.getLoginStatus() untuk memeriksa apakah pemain saat ini telah mengautentikasi game Anda sebelumnya, dan jika belum, segera tampilkan Dialog Login di atas konten game Anda dengan memanggil <FB.login(), tanpa perlu menampilkan tombol 'Login'.

Lihat contoh di bawah ini:

// Place following code after FB.init call.

function onLogin(response) {
  if (response.status == 'connected') {
    FB.api('/me?fields=first_name', function(data) {
      var welcomeBlock = document.getElementById('fb-welcome');
      welcomeBlock.innerHTML = 'Hello, ' + data.first_name + '!';
    });
  }
}

FB.getLoginStatus(function(response) {
  // Check login status on load, and if the user is
  // already logged in, go directly to the welcome message.
  if (response.status == 'connected') {
    onLogin(response);
  } else {
    // Otherwise, show Login dialog first.
    FB.login(function(response) {
      onLogin(response);
    }, {scope: 'email'});
  }
});

Langkah Berikutnya

Metode apa pun yang Anda pilih untuk fungsi login, identitas nyata dalam game akan membantu Anda membangun fitur sosial yang hebat yang akan membantu retensi dan distribusi game Anda.

Login adalah langkah pertama menuju banyak fitur ini, dan Anda dapat membuatnya menggunakan produk di bawah ini:

Lihatlah Praktik Terbaik untuk Game di Facebook untuk tips selengkapnya tentang menggunakan Facebook Login secara efektif dalam game Anda.