El post que buscas se encuentra eliminado, pero este también te puede interesar

Como crear aplicaciones para FaceBook

Hola Taringeros! Hoy les voy a enseñar como crear una/unas aplicaciones para FaceBook:

Lean atentamente:

Detrás de los tres pilares “integración profunda”, “distribución masiva” y “nuevas oportunidades”, la red social Facebook ofrece una completa API para que los desarrolladores aprovechen al máximo las virtudes inherentes de una red social.

Facebook logró su popularidad siendo una red social capaz de contener aplicaciones realizadas por terceros, permitiendo así la realización de negocios a partir de la misma. Más allá de las aplicaciones propias que presenta, como es el caso de: “The Wall”.

Suerte de pizarra virtual del usuario donde otros usuarios pueden dejarle mensajes o “Status”, que permite a los usuarios indicar sus actividades o estados de ánimo al resto de la red, Facebook permite la creación de aplicaciones mediante la utilización de web services para el acceso a los datos de la red.

Creando aplicaciones en Facebook

Los recursos disponibles a los desarrolladores se agrupan en 3 categorías:

API: es una interfaz basada en REST que permite el acceso a los datos del perfil, amigos, fotos y eventos del usuario mediante la utilización de mensajes GET o POST.

Consultas (FQL, “Facebook Query Language”): es un lenguaje de consultas similar a SQL utilizado para acceder a los mismos datos que la API pero permitiendo consultas más complejas.

Maquetación (FBML, “Faceboook Markup Language”): es un lenguaje de markup similar a HTML que permite ser intercalado con el HTML a utilizar para integrar las aplicaciones a la experiencia de usuario Facebook. Utilizando FBML se pueden acceder distintos puntos de la red como ser el perfil, acciones del perfil, canvas y feeds. Este lenguaje también incluye soporte para AJAX y Javascript.

Anatomía de una aplicación en Facebook:

Una aplicación en Facebook posee una compleja estructura que permite brindar una experiencia de usuario completa:

Product Directory: cuando un usuario navega el directorio de aplicaciones de Facebook, por cada aplicación se muestra una pequeña sección con el nombre, una imagen y una pequeña descripción.

About: esta página muestra información general de la aplicación. Debe inducir al usuario a instalar la aplicación.

Left Nav: es el panel de navegación izquierdo. Las aplicaciones pueden tener su ícono y nombre en este panel.

Canvas Page: es la página principal de la aplicación. Home: esta página es accedida utilizando el panel de navegación de la izquierda, en general muestra información de los amigos del usuario. User Dashboard: es la página donde el usuario administra sus datos en una aplicación y determina de que forma las aplicaciones acceden a sus datos personales.

Profile: es la representación online de la identidad del usuario. La API provee múltiples puntos de integración con el perfil del usuario permitiendo actualizar datos del mismo. Profile Box: presenta información actualizada sobre las acciones recientes del usuario. Profile Actions Links: debajo de la foto del usuario en el perfil, se pueden agregar enlaces para invocar acciones en la aplicación.

Privacy Settings: se utiliza para definir los niveles de privacidad de los datos del perfil por aplicación.

News Feed: como su nombre lo indica es un “feed” de noticias, allí las aplicaciones pueden “publicar” información del usuario de la misma.

Alerts: las aplicaciones pueden enviar notificaciones a los usuarios a través del correo electrónico.
Message Attachments: las aplicaciones pueden incluir archivos adjuntos que aparecen en la ventana para componer mensajes.

Requests: las aplicaciones pueden crear peticiones que aparecen en la parte superior izquierda de la página principal. En general son iniciados por amigos que solicitan realizar alguna acción.ç

Hola mundo! paso a paso:

El primer paso consiste en agregar la aplicación “Developer“. Todo contenido que se agrega a Facebook es una aplicación, es así que para desarrollarlas es necesaria una aplicación que las contenga.

Como crear aplicaciones para FaceBook

Luego debemos presionar el botón “Set Up New Application”: allí se nos preguntará el nombre de nuestra aplicación y clickeando en “Optional Fields” encontramos información necesaria para el desarrollo.

Por el momento solo le daremos atención a la “Callback URL” que será la dirección a la que Facebook enviará a nuestros usuarios luego de su autenticación y a “Canvas Page URL” que será la URL mapeada de Facebook a nuestra aplicación y por la que los usuarios accederán a la misma. Definimos entonces:

Callback URL = http://miserver/blanconetmaestros
Canvas Page URL = http://apps.facebook.com/blanconetmaestros/

Elegimos:

La opción “Can your application be added on Facebook?” para poder agregar nuestra aplicación.
La opción “Who can add your application to their Facebook account?” marcamos Users y All Pages.
La opción “Developer Mode”.
Por último hacemos click en “Save”
Ahora debemos agregar nuestra aplicación: para esto nos dirigimos a Developers y allí buscamos nuestra aplicación (en la barra derecha) y hacemos un click en el nombre.

Allí vemos un botón que dice “Add Application”, lo apretamos y en la página siguiente hacemos lo mismo con “Add NOMBRE_DE_LA_APLICACION”. Bien, está todo listo para nuestro “Hola Mundo” en Facebook:

Lo primero que necesitamos es alguna máquina visible desde Internet (tanto por nombre o por IP).
Luego necesitamos que esta máquina tenga instalado un servidor Web (Apache por ejemplo).
Con estos dos requerimientos satisfechos, simplemente tenemos que ubicar un documento HTML en la ubicación que definimos para Callback URL en la configuración de la aplicación (ej: http://miserver/blanconetmaestros).

Por ejemplo:

<h1>
Mi primer canvas!
</h1>

Probamos que la nuestro primer canvas sea accesible utilizando un navegador(Yo utilizare el Mozilla FireFox):

aplicaciones

Ahora probamos accediendo a nuestra aplicación dentro de Facebook:

Como

La configuración inicial de nuestra aplicación está lista, ahora mejoremos la misma para aprovechar alguna de las virtudes de la API provista por Facebook.

Usando la API:

En primer lugar hay que obtener la librería para conectarse a la API:

Librería PHP 4 & 5

Librería Java

Bajamos la librería PHP en nuestro caso.
Creamos un archivo ‘appinclude.php’ que vamos a incluir en la parte superior de todas nuestras páginas y colocamos dentro los datos que se obtienen de la página, allí buscamos nuestra aplicación y tomamos nota de: API Key y Secret Key.

Luego reemplazamos [API Key], [Secret Key] y [CallbackURL] por nuestros datos. Con respecto al require_once debemos indicar la ubicación del archivo ‘facebook.php’ dependiendo de que versión de PHP usamos:

PHP 4

PHP 5

appinclude.php

<?php
require_once 'facebook.php';

$appapikey = '[API Key]';
$appsecret = '[Secret Key]';
$facebook = new Facebook($appapikey, $appsecret);
$user = $facebook->require_login();

$appcallbackurl = '[Callback URL]';

//catch the exception that gets thrown if the cookie has an invalid session_key in it
try {
if (!$facebook->api_client->users_isAppAdded()) {
$facebook->redirect($facebook->get_add_url());
}
} catch (Exception $ex) {
//this will clear cookies for your application and redirect them to a login prompt
$facebook->set_user(null, null);
$facebook->redirect($appcallbackurl);
}


Ahora modificamos nuestra página inicial por esta:

1 <?php require_once 'appinclude.php';?>
2 <h1>
3 Mi primer canvas!</p>
4 Hola <fb:name uid="<?=$user;?>" useyou="false"/></p>
5 Tus amigos son:</p>
6 <table>
7 <?php
8 $i = 1;
9 foreach ($facebook->api_client->friends_get() as $friend_id) {
10 if ($i == 1){
11 echo "<tr>";
12 }
13 echo "<td>" . "<fb:profile-pic uid='" . $friend_id . "'/>" . "</td>";
14 echo "<td>" . "<fb:name uid='" . $friend_id . "'/></br>" . "</td>";
15 if ($i == 4) {
16 $i = 0;
17 echo "</tr>";
18 }
19 $i++;
20 }
21 ?>
22 </table>
23 </h1>


crear

Analicemos las secciones resaltadas:

Línea 1: se incluye el archivo appinclude.php creado anteriormente.

Línea 4: se utiliza el tag FBML este requiere únicamente al atributo uid (user id) que es el id de facebook del usuario que se desea mostrar, se agrega en este caso también el atributo useyou en false para que no escriba “you” en caso de ser uno mismo el usuario visitante. Como uid se pasa el valor $user que fue obtenido en el archivo appinclude.php haciendo $user = $facebook->require_login();

Línea 9: se obtiene mediante la llamada $facebook->api_client->friends_get() los amigos del usuario logueado como un array de ids.

Línea 13: se utiliza otro tag de FBML que renderiza como un elemento de HTML la foto del perfil de un usuario (el indicado en uid).

Línea 14: se vuelve a utilizar el tag pero en este caso se utiliza como uid el id de cada amigot.
Vimos entonces como con solo algunas líneas de HTML y FBML se puede obtener una aplicación simple que muestre los amigos del usuario logueado.

Gracias por ver...

Facebook

Anuncios

Comentarios Destacados

@maxicerro +18
pero no enseñaste nada, solo pusiste lo que estaba en facebook en español, no te doy puntos por esto.
@wyxx +2
Rayos, ya le dejé 10

Como crear aplicaciones para FaceBook

23 comentarios - Como crear aplicaciones para FaceBook

@pituloquendo +2
jajaj el post fue creado hace 6 minutos, tiene 47 visitas y 2 comentarios xD, que loco, encima de llevar tan poco tiempo ya tiene 10 pts xD
@The_Gizmo -4
Vos decis que siguiendo paso a paso tu post me creo una aplicacion de Faisbuc?
@Darel
Buena info, te deje 5. Saludos
@homerocastro94
debe ser alguna copia pirata de FaceBook,no??
@pituloquendo
que zarpado, ya 8 coments, bue con el mio 9, xD y encima 15 pts jajaja, yo creo que vas a tener muy buen futuro en taringa xD jajajajaja
@pituloquendo
Peiz dijo:
pituloquendo dijo:que zarpado, ya 8 coments, bue con el mio 9, xD y encima 15 pts jajaja, yo creo que vas a tener muy buen futuro en taringa xD jajajajaja

Se...
Ojala llegue a Great User, xD!


si yo tambie digo lo mismo, si llegamos a great user, la rompemos xD
@maxicerro +18
pero no enseñaste nada, solo pusiste lo que estaba en facebook en español, no te doy puntos por esto.
@wyxx +2
Rayos, ya le dejé 10

Como crear aplicaciones para FaceBook
@Barbol_mza +4
hay algunos links caidos, como la libreria de java y php. Voy a hacer el intento de hacer una aplicación copada de facebook con java.
les cuento como me va.
@oasico +2
YA NO SIRVE PARA NADA!!! FACEBOOK CAMBIÓ TODO!
@EL_RETADOR
Brother...
Te mereces los 10, los 20 y mas puntos Felicitaciones tendrás muchos éxitos.
Esta de lujo... Esto quiere decir que si creo una aplicacion de Facebook puedo hacerme rico... tendré acceso a la info de todos mis suscriptores y fuera de eso de forma viral y expandible dentro de la red social es decir facebook.... el poder del verdadero apalancamiento esta del dinero... esta en la red que puedes crear, al final el dinero que buscas no esta en los bancos los tienen las personas.... Si te paras justo frente a su camino y les ofreces mas de lo que buscan te entenderan y te seguiran... Les dejo un ejemplo de algo que se puede hacer en Facebook.... Excelentes recuersos tinen es una maquina de hacer dinero...

https://www.facebook.com/pages/Erbuin-Alberto-Rodriguez/420726301345811?id=420726301345811&sk=app_208195102528120
@matias_arcuri
disculpa, soy nuevo en esto... como agrego la aplicacion developer?
@pepu007
ajajaj es plagio y se llevo 15 pts xD!
@lukss007
te quiero hacer una pregunta