Comunidad de diseño web y desarrollo en internet online

Como crear una aplicación en Facebook con PHP

Hace algún tiempo escribí un tip en Cristalab de cómo crear una aplicación Hello World en Facebook utilizando PHP, pero ya hace mucho de ello, y como estamos en un área de constante evolución, el tip ya se encuentra obsoleto con los constantes cambios que le han realizado a la famosa red de amigos en Internet.

Los requisitos que necesitamos para crear una aplicación en Facebook son:


  • Una cuenta en Facebook, la cual debe de estar en el grupo de desarrolladores de Facebook (http://www.facebook.com/developers/)
  • Un servidor web con PHP y que tenga la librería cURL instalada.

NOTA: Como tengo mi cuenta de Facebook configurada en ingles los textos e imágenes de este tip aparecen en dicho idioma, pero no creo que no sea una barrera si quieres aprender.

Lo primero que hacemos es ir al área de Facebook Developer y aceptar que la aplicación de Developers pueda acceder a nuestros datos.


Depues veremos un botón en la parte superior derecha de la pantalla(que en mi caso dice “Set Up New Application”) que nos permitirá crear nuestras aplicaciones.

Luego de presionar el botón, lo primero que veremos será una pantalla que nos preguntara como se llamara nuestra aplicación super-hiper-mega-cool y que debemos aceptar los términos y condiciones de Facebook.


Al presionar el botón “Create App” registramos la aplicación y lo que nos queda es especificar cuál es el URL en donde se encuentran los archivos de nuestra aplicación.

Es importante mencionar que Facebook no aloja los archivos de nuestras aplicaciones, por eso mencione al principio de este artículo que necesitamos de un hosting en donde colocar los archivos de la aplicación.

¿Pero si Facebook no aloja nuestro archivos, como le decimos en donde están los archivos de mi aplicación super-hiper-mega-cool?


Sencillo, eso lo configuramos en sección “Facebook Integration” de nuestra aplicación.

Vayamos a la sección “Facebook Integration” de nuestra aplicación y en donde dice “CanvasPage” colocamos el nombre de nuestra aplicación, en mi caso psychoblogapp el cual va a ser el URL de mi aplicación en Facebook para que los usuarios puedan acceder a ella (http://apps.facebook.com/psychoblogapp/). Luego en “Canvas URL” colocamos la ruta mi servidor en donde se encuentran los archivos de la aplicación, en mi caso los archivos de la aplicación están en http://www.psycho.hielocreativo.com/ejemplos/01/

[nota]NOTA: En la sección de Facebook Integration obtenemos el “Application ID” y “Application Secret” que es necesario cuando trabajamos con la librería de Facebook./nota]
Estamos listos por la parte de la configuración en Facebook, ahora vamos a codificar un poco. Abrimos nuestro editor de código favorito, creamos un documento en blanco y lo guardamos con el nombre index.php y en el colocamos el siguiente código:

Código :

<?php
echo 'Hola clabers, soy una aplicacion super-hiper-mega-cool';

Subimos el archivo a nuestro servidor a la capeta que especificamos en el “Canvas URL”, vamos al URL de nuestra aplicación en Facebook y gualá, allí esta la aplicación funcionando.

Ahora bien, para poder acceder al id del usuario lo hacemos de la siguiente manera, abrimos el archivo index.php y modificamos su contenido por:

Código :

<?php
// Aqui colocamos el ID de nuestra aplicación en Facebook que lo obtenemos en la sección de "Facebook Integration" 
de nuestra aplicación
$app_id = "YOUR_APP_ID";
// Aqui colocamos el canvas(URL) de nuestras aplicación en Facebook
// en mi ejemplo seria http://apps.facebook.com/psychoblogapp/
$canvas_page = "YOUR_CANVAS_PAGE_URL";

// URL para que el usuario instale nuestra aplicacin en su perfil
$auth_url = 'http://www.facebook.com/dialog/oauth?client_id='
    . $app_id . '&redirect_uri=' . urlencode( $canvas_page );
 
$signed_request = $_REQUEST['signed_request'];
 
list($encoded_sig, $payload) = explode('.', $signed_request, 2);
 
$data = json_decode(base64_decode(strtr($payload, '-_', '+/')), true);
 
// Preguntar si obtenemos el id del usuario
if ( empty ( $data['user_id'] ) )
{
   // Redireccion al dialogo de instalación
    echo( '<script type="text/javascript"></script>"' );
}
else
{
    echo ( 'Hola claber, tu ID en Facebook es: ' . $data['user_id'] );
}

Si entramos de nuevo a la aplicación en Facebook deberíamos de ver algo como esto.


En el siguiente tip explicare como integrar la librería de Facebook con Codeigniter y hacer algunas búsquedas en las tablas de Facebook.

Para mas info pueden consultar la documentación oficial de Facebook en http://developers.facebook.com/.

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate