Empezando a jugar con Facebook Apps

Comienzo a escribir ahora después de bastante rato, y cuando digo bastante rato ha sido cosa de unas tres horas dando vueltas por ‘San Google’.

Cuando he amanecido el objetivo para esta mañana era escribir una entrada sobre crear una primera aplicación en Facebook, un «Hola Mundo», nunca antes había creado nada para Facebook y ayer a raíz del máster me picó el gusanillo de la curiosidad y hacia mis adentros pensé: «¿Podría el hecho de ser informático generar valor en el mundo del Community Management en Facebook?«. Entonces pensé sobre el hecho de la posibilidad de ofrecer a clientes Apps personalizadas para sus páginas, para sus necesidades concretas y que no exista ya en el listado de Apps creadas, puede ser un buen punto a incorporar a la hora de convencer a un cliente.

Pues tan feliz yo me empiezo a registrar como Developer (más abajo explico un poco el tema) y veo que ahora las aplicaciones y tabs para Facebook requieren una conexión segura SSL así que mi gozo inicial en un pozo. Mi alojamiento web no tiene SSL así que tras buscar por Google he encontrado opciones interesantes como fbssl.me que permite transoformar una URL HTTP a HTTPS, pero si hubiese funcionado a la primera la diversión no hubiese existido.

El caso es que me ha tocado cocinarme a mí el servidor web en mi ordenador de casa, toqueteando la configuración del router para habilitar el servidor web e instalar OpenSSL siguiendo varios tutoriales encontrados por «San Google», así que una vez dispongo de servidor web, con conexión SSL ya he podido avanzar en lo referente a Facebook.

Luego me ha surgido otro problema, y es que al intentar acceder a la aplicación de Facebook desde Mozilla Firefox, me lanza un error de certificado, y es que parece que se detectan los certificados autofirmados (deberian ser de terceros) así que no es posible su acceso, para poder acceder desde Firefox hay que hacer un truco del almendruco que en el blog Informático de Guardia viene muy bien explicado, con imágenes y todo :). Si no se hace esto los resultados no se verán. ¡Mi primer resultado ha sido este!

Mi primer resultado en Facebook

Mi primer resultado en Facebook

Después de todos mis problemas y la historieta anterior, para crear una aplicación en Facebook primero, evidentemente hay que tener una cuenta en la red social y posteriormente registrarse como Developer en https://developers.facebook.com. Decir que el paso de confirmar el teléfono móvil (te lo piden sí o sí) me ha traído algunos quebraderos de cabeza, pues no me llegaba el código de confirmación, al final he usado un número Movistar y enseguida me ha llegado, mi recomendación es que si tenéis una compañía generalista pongáis enviar SMS, pero si no, como yo, que tengo Pepephone, marcad la opción de la llamada, tardan un poco más, pero te llama un «robot» y te dice el código. He caído en el error de no sacar la captura a estas pantallas, pero es un proceso secuencial sin mucha complicación.

Posteriormente ya registrados, confirmados y logeados podemos empezar a crear nuestra primera Facebook App accediendo a https://developers.facebook.com/apps y siguiendo el proceso de la imagen.

Screenshot de la creación

Screenshot de la creación

Se nos piden una serie de datos:

  • Nombre de la aplicación: El que queramos.
  • Namespace: Será el nombre de la ruta de la aplicación. Si os fijáis en la primera imagen, en la URL, el namespace seria juanfirsthello.
  • Categoría: La categoría de la aplicación.

Después de rellenar una Captcha accedemos a la configuración de la aplicación.

Podemos elegir entre diversos tipos de aplicaciones: para móvil, IOS, Android, Facebook Login, Page App o Facebook App, de momento para empezar me he centrado en la Facebook App.

Parámetros

Parámetros

Los primeros datos están claros son.

  • El nombre de la aplicación.
  • El namespace.
  • El email de contacto.
  • App domains sirve para habilitar la autenticación en nuestro servidor.
  • El Sandbox Mode hace que solo los desarrolladores, administradores y testers puedan ver la aplicación.
  • La dirección web de la aplicación y la dirección segura es el directorio web (he borrado mi IP pública) donde estará almacenada la aplicación, deben acabar con «/», en la imagen faltan.
  • Los datos del canvas son las dimensiones del ‘lienzo’ de la aplicación.
  • Y la integración con Unity es para integrarlo con el API de Unity de Facebook, en mi caso no me hace falta.

Ahora si en el directorio del servidor indicado creo un index.html y accedo a la Página principal de la aplicación se vería lo que he puesto en la primera imagen.


<h1>Hola a todos!!!</h1>
<p>Me ha costado un <strong>HUEVO</strong> llegar hasta aqui</p>

Para insertar la aplicación volvemos a nuestra aplicación y la editamos, marcamos la opción de Page Tab:

Datos de Page Tab

Datos de Page Tab

Cuando guardamos los cambios podemos añadir la pestaña en una página que hayamos creado como admins. Personalmente he creado una página que se llama Juans Developement Sandbox y para añadir la pestaña debemos escribir en la barra de la URL:

http://www.facebook.com/dialog/pagetab?app_id=TU-APP-ID&next=http://www.facebook.com

Podrás elegir la página donde quieres agregarla y luego acceder a ella desde tu página.

Pestaña añadida

Pestaña añadida

Evidentemente Facebook nos ofrece una serie de APIs para hacer aplicaciones externas y enlazarlas con Facebook ¿os suenan esas páginas web que obtienen la información de Facebook para registraros? Pues usan dicha API.

La aplicación la podemos extender todo lo que queramos, podemos crear un slide de imágenes que sea gestionable por el cliente, un sistema de puntuación para platos de un restaurante o incluso si nos apetece programar mucho una tienda online.

Hay mucha más chicha en este mundillo y profundizaré en ello más adelante, quiero ver como tratar de distinguir entre los que son fans de la página y los que no para el tema de sorteos por ejemplo o mostrarles diferente información, su una persona no es usuaria de la página, queremos atraerla, si una persona es fan, queremos convertirla en cliente.

Espero que os haya servido de algo esta entrada, a mí mucho.

¿Qué os parece todo este mundillo?

¡No me tiréis muchas piedras que soy novato en el mundillo de las aplicaciones de Facebook! 🙂 ¡Tan novato que he empezado hoy!

Tareas pendientes:

  • Estudiar más sobre la API PHP y Javascript.
  • Ver como añadir las aplicaciones al App Center.
  • Crear una aplicación externa a Facebook con el API.

NOTA: Al final he compartido la IP Pública y demás, pero el servidor web lo voy a desactivar por seguridad 🙂

(Visited 152 times, 1 visits today)

You might also like

No Comments

    Leave a Reply

    Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.