Dar estilo a aplicaciones de Facebook con Fbootstrapp

Una parte importante de una aplicación es su diseño y estructura del contenido, en mi caso por ejemplo se me dificulta más idear esta parte que el mismo desarrollo, pero gracias a Fbootstrapp ahora me puedo olvidar del CSS y lo que ello conlleva. Fbootstrapp es un framework que incluye todo lo necesario para que nuestra aplicación de Facebook se vea bien: Botones, tablas, tipografías, formularios y demás componentes estilizados y no se limita sólo a eso, también trae consigo una librería Javascript (que usa jQuery) que nos permite hacer alertas, tabs, barras de navegación, etc. Este framework se basa en Bootstrap por lo que trae consigo algunas ventajas como poder usar Less o el Scaffolding adaptado para funcionar de maravilla en aplicaciones iFrame (canvas) o pestañas de fanpages.

Sitio web de Fbootstrapp

Publicar una foto con el PHP SDK en Facebook

Continuando el trabajo con el PHP SDK de Facebook veremos como publicar una foto en el muro de una persona. En este caso se debe hacer lo de siempre, autentificar al usuario con nuestra aplicación y pedir permiso de publicación (publish_stream) como lo vimos anteriormente, la única novedad es el uso del método setFileUploadSupport que le indica al SDK que permita la carga de archivos. Después de tener la foto guardada en el servidor, sea cual sea la forma en que tu aplicación la genere se publica la foto de la siguiente forma:

/*Se habilita la carga de archivos 
con setFileUploadSupport.*/
$facebook->setFileUploadSupport(true);
// Se indica la ruta de la imagen en el servidor.
$img = 'ruta_de_la_imagen.png';
// Haciendo uso de POST se envía la foto usando el método llamado api
$photo = $facebook->api('/me/photos', 'POST',
array( 'source' => '@' . $img,
'message' => 'Mensaje a ser publicado con la foto'
));

Facebook automáticamente crea un album con el nombre de la aplicación, en caso de querer crear un album con otro nombre:

$album=array('name'=>'BrianUR.info', 'description'=>'Tutoriales para crear aplicacion
en Facebook');
$facebook->api('/me/albums','post',$album);

Crear un sistema de pago con tweets o publicaciones en Facebook

Es hora de hacer una aplicación real con lo aprendido en anteriores tutoriales, en este caso lo que haremos será una aplicación para loguear al usuario en nuestra web (no una aplicación dentro de Facebook) con el objetivo de que se le publique en el muro lo que queramos a cambio de poder descargar por ejemplo un libro o un tutorial, por decirlo de una mejor forma cambiar una descarga por un tweet o una publicación en Facebook. Es algo sencillo de hacer y bastante útil para hacer conocer tu sitio o producto en redes sociales.

Primero debes editar tu aplicación en el área de desarrolladores, buscas donde diga Selecciona como tu aplicación se intrega con Facebook y en Sitio web escribes la URL del sitio. Posteriormente debemos crear un directorio, en mi caso lo he llamado descargas. Este directorio debe estar protegido para que nadie con solo obtener la URL del archivo pueda descargarlo directamente, posteriormente usando PHP se llama al archivo para que pueda ser descargado solo por usuarios que hagan el “pago”. En la carpeta mencionada anteriormente creamos un archivo .htaccess que debe tener lo siguiente:

AuthUserFile  /home/miweb/descargas/.htpasswd
AuthName "Que coño intentas hacer?"
AuthType Basic

Options All
<Limit GET POST PUT>
require valid-user
</Limit>

Continuar leyendo…

Publicar en el muro con el PHP SDK

Una de las cosas más habituales en una aplicación es publicar contenido del usuario en su muro o en el de un amigo, así que para continuar trabajando con los métodos que nos provee el PHP SDK veremos como hacerlo. Para el caso de querer publicar en el muro de un amigo se debe reemplazar /me/feed por /IDAmigo/feed, no olvides que para que el código funcione tienes que autenticar el usuario y pedir el permiso extendido publish_stream.

<?php
$parametros=array('message' => 'Aprendiendo a desarrollar aplicaciones en Facebook',
				  'name' => 'BrianUR.info',
				  'caption' => 'Mi primer aplicacion en Facebook',
				  'link' => 'http://www.brianur.info',
				  'description' => 'Es genial',
				  'picture' => 'http://brianur.info/brianur.png',
				  'actions' => array(array('name' => 'Entra ya!',
                                      'link' => 'http://www.brianur.info')));
$facebook->api('/me/feed','post',$parametros);
?>

Conociendo el PHP SDK de Facebook

Facebook provee a los desarrolladores un kit de desarrollo para poder trabajar con su API de una manera más sencilla, dentro de estas herramientas se encuentran el JavaScript SDK, PHP SDK, iOS SDK (iPhone & iPad) y el Android SDK. Para este caso veremos el funcionamiento del PHP SDK de Facebook, trabajaremos algunos de sus métodos más usados, eso si, es primordial haber leído antes el funcionamiento de la Graph API de Facebook para entender lo que se hace en el código.

Puedes descargar el archivo facebook.php que necesitamos desde github. La versión actual es la 3.1.1, muy importante en tener en cuenta esto para las personas que ya habían desarrollado aplicaciones antes, ya que algunos métodos no funcionan en las nuevas versiones del SDK, como es el caso de getSession() que hacía parte de la Rest API, así que si ven un Fatal error: Call to undefined method Facebook::getSession() ya saben la razón.

Autenticación

El siguiente código siempre será necesario usarlo para poder autenticar el usuario con una aplicación (obtener un token, pedir permisos), si buscas por la red te podrás encontrar con múltiples formas para hacer este paso, hay personas que hacen varios tipos de validaciones (recomiendo que tu también lo hagas) para evitar errores; en este caso para ahorrar código y para que se entienda mejor he puesto lo estrictamente necesario:

< ?php
/*
	Código de ejemplo para obtener datos del usuario en Facebook
	www.BrianUR.info
*/
// URL de la aplicación
$urlApp = "http://apps.facebook.com/brianur/";
// ID y Secret ID de la aplicación
$appId = "0000000000000";
$secret = "00000000000000000000000000000000";
//Llamada al Facebook SDK
include_once "facebook.php";
// Instanciamos el objeto Facebook
$facebook = new Facebook(array('appId' => $appId,
							   'secret' => $secret,
							   'cookie' => true));
// Obtenemos una session
$user = $facebook->getUser();
if (!$user){
// Si el usuario no está autentificado crea una URL para hacerlo.
// Se usa 'scope' para pedir permisos separados por coma.
// Se usa 'redirect_uri' para redireccionar a esa URL despues de la acción del usuario
$loginUrl = $facebook->getLoginUrl(
            array(
                'scope' => 'user_about_me',
                'redirect_uri' => $urlApp
            )
    );
echo "<script type=\"text/javascript\">top.location.href = '$loginUrl';</script>";
} else {
	// Hasta aquí el usuario tendría que estar autentificado con la aplicación.
	$yo = $facebook->api('/me');
	print_r($yo);
}
?>

El anterior código retorna varios datos del usuario, para ver datos ocultos se requiere el uso de permisos extendidos.
Continuar leyendo…

La nueva plataforma para desarrolladores en Facebook: Creando una aplicación

En los últimos meses la plataforma para desarrolladores de aplicaciones para Facebook ha cambiado bastante, con solo mencionar que ya no se utiliza FBML el cual usé para casi todos los tutoriales anteriores y por lo tanto ya son obsoletos. De esta manera iniciaré otra serie de tutoriales hablando del “nuevo Facebook” y de cómo hacer aplicaciones en específico. Iniciemos por lo más básico, crear una aplicación. Este será el único tutorial en el que mostraré el proceso paso por paso para ayudar a los nuevos, en los próximos prometo ir al grano 😉

Creando una aplicación en Facebook Developers

Antes que nada para poder crear una aplicación debes tener tu cuenta verificada, para eso puedes agregar tu número de móvil y luego esperar a que te llegue un SMS con un código que debes usar para la verificación, he podido ver que a algunas personas no les llega el código y eso se debe al operador móvil que usan (Comcel), en mi caso usando Tigo funcionó perfectamente.

Para crear y editar aplicaciones se usa Facebook Developers, si es la primera vez que accedes a el te pedirá permisos y si ya habías creado una aplicación te darás cuenta que la interfaz cambió. Ahí veremos un botón llamado Crear una nueva aplicación:

Continuar leyendo…