En este tutorial, hablaremos sobre cómo interactuar con la API de Facebook y todas las herramientas que necesita para conectarse. Específicamente, la aplicación que vamos a crear podrá conectarse con la cuenta de Facebook del usuario y actualizar su estado. Empecemos!
Paso 1: Creación de proyectos de Visual Studio
En primer lugar, necesitamos crear un nuevo proyecto con Visual Studio. Simplemente construiremos una aplicación simple, así que seleccione la opción "Aplicación de Windows Phone":
Si está utilizando Visual Studio 2012 con el nuevo WP8 SDK, se le pedirá la versión del sistema operativo Target para Windows Phone. Si ese es el caso, entonces simplemente selecciona el sistema operativo 7.1.
Paso 2: Agregar la interfaz de usuario
Con el proyecto ya creado, abra el archivo "MainPage.xaml" si aún no está abierto y cambie la aplicación predeterminada y el cuadro de texto del nombre de la página:
Ahora, en nuestra Cuadrícula de Panel de Contenido, agregaremos dos Filas, una para un Cuadro de Texto donde el usuario ingresará el nuevo estado, y la otra para el botón para enviar el estado:
Y luego simplemente agregue un TextBox en la primera fila con el nombre de "Mensaje", y un botón en la segunda fila:
Al final debes tener esto:
Paso 3: Crear cuentas de desarrollador
Facebook tiene una API muy completa para permitir la interacción entre las aplicaciones y el sitio. La API permite que su aplicación se conecte e interactúe con la cuenta FB del usuario.
Para conectar nuestra aplicación a Facebook, debemos registrarnos como Desarrolladores de Facebook. Para crear una cuenta de desarrollador de Facebook, vaya al sitio de desarrollador de Facebook, luego inicia sesión con tu cuenta de Facebook o crea una si todavía no tienes una. Una vez que haya iniciado sesión, haga clic en el botón "Registrarse" y siga las instrucciones.
Paso 4: Registro de una nueva aplicación
Ahora, cree una nueva aplicación yendo a su menú de aplicaciones, y luego seleccione el botón "Crear nueva aplicación".
Una vez que haya creado su aplicación, verá la página de configuración de la aplicación y en ella un número de clave de ID / API de aplicación.
Copie este número, regrese al proyecto y dentro del archivo "MainPage.xaml.cs", cree una nueva cadena de constante global en la parte superior de su constructor:
private const string FBApi = "SU CLAVE DE LA API VA AQUÍ"; // Constructor public MainPage () InitializeComponent ();
Paso 5: Elegir el SDK C # de Facebook
Facebook tiene algunos excelentes SDK para iOS y Android, pero lamentablemente ninguno para WP7, por lo que para conectarnos a Facebook desde una aplicación WP7, tenemos dos opciones: (1) crear todas las llamadas manualmente o (2) usar Facebook C # SDK, un SDK no oficial creado específicamente para aplicaciones de C #.
Para este tutorial, usaremos C # SDK. Tiene todos los métodos de la API de Facebook ya integrados, por lo que hará nuestra tarea mucho más fácil.!
Paso 6: descargando el SDK
Este SDK solo está disponible a través de NuGet, por lo que en caso de que Visual Studio no incluya el administrador de paquetes NugGet, Necesitará descargarlo de la página de NuGet.. Para descargar el paquete, abra la Consola del Administrador de paquetes en Visual Studio (Herramientas> Administrador de paquetes de la biblioteca> Consola del Administrador de paquetes), e ingrese el siguiente comando:Instalar el paquete de Facebook . En caso de que tenga problemas con la versión descargada, intente usar este comando: Instalar el paquete de la versión de Facebook 6.0.24
Paso 7: Agrega el FB SDK a tu aplicación
Ahora que tenemos el SDK, lo agregaremos a nuestro proyecto. Agregue una nueva importación en el archivo "MainPage.xaml.cs":
utilizando Facebook;
Paso 8: Agregar un navegador
Para que un usuario se conecte a Facebook, primero debe darnos acceso y permiso a su cuenta de FB. Esto se hace a través de la página web de Facebook y, por lo tanto, debemos agregar un navegador web a nuestra aplicación. El navegador debe cubrir la mayor parte de la página, por lo que inicialmente se colapsará y luego cambiará para que sea visible justo cuando el usuario necesita iniciar sesión. En el archivo "MainPage.xaml", agregue un nuevo WebBrowser justo debajo del Panel de contenido:
Paso 9: Conectar con Facebook
Con todo correctamente configurado, ahora podemos comenzar a codificar nuestra aplicación. Cree una nueva variable de FacebookClient y asígnele el nombre de cliente. Aquí es donde se harán todas las conexiones. Además, inicie la variable dentro del constructor:
cliente privado de FacebookClient; // Constructor public MainPage () InitializeComponent (); cliente = nuevo FacebookClient ();
Paso 10: Agregar el evento Click
Para poder publicar algo, el usuario tiene que hacer clic en el botón "Publicar". Vamos a agregar un evento de clic a ese botón:
En el lado del código, cuando el usuario hace clic en el botón, debe iniciar sesión con Facebook y autorizar aceptar nuestra aplicación. Para este proceso, debemos hacer que el navegador sea visible y navegar a una url que el cliente nos dará, pero antes debemos enviar algunos parámetros iniciales:
private void PostClicked (objeto remitente, RoutedEventArgs e) // Parámetros del cliente var parameters = new Dictionary(); parámetros ["client_id"] = FBApi; parameters ["redirect_uri"] = "https://www.facebook.com/connect/login_success.html"; parámetros ["response_type"] = "token"; parámetros ["display"] = "touch"; // El ámbito es lo que nos da acceso a los datos de los usuarios, en este caso // solo queremos publicar en sus parámetros de pared ["scope"] = "publish_stream"; Browser.Visibility = System.Windows.Visibility.Visible; Browser.Navigate (client.GetLoginUrl (parámetros));
Si ejecuta su código ahora mismo y hace clic en el botón Publicar, debería aparecer el navegador, que muestra la página de inicio de sesión de Facebook:
Paso 11: Agregar un evento de navegación
Después de que el usuario haya iniciado sesión en Facebook, el navegador será navegado a una URL que contendrá nuestro token de acceso para llamadas a la API. Una vez que lo recuperamos, solo tenemos que asignarlo a nuestro cliente. Una cosa a tener en cuenta es que hay muchas páginas en las que el navegador puede navegar (contraseña incorrecta, usuario rechazó nuestra aplicación, etc.), por lo que debemos intentar obtener el token justo cuando estamos seguros de que estamos en el página correcta.
Agregue el evento navegado al navegador web:
Luego agregue las siguientes líneas al controlador de eventos:
private void BrowserNavitaged (objeto remitente, System.Windows.Navigation.NavigationEventArgs e) FacebookOAuthResult oauthResult; // Asegurarse de que la URL realmente tenga el token de acceso if (! Client.TryParseOAuthCallbackUrl (e.Uri, out oauthResult)) return; // Comprobando que el usuario aceptó exitosamente nuestra aplicación, de lo contrario, solo muestra el error if (oauthResult.IsSuccess) // Process result client.AccessToken = oauthResult.AccessToken; // Ocultar el navegador Browser.Visibility = System.Windows.Visibility.Collapsed; Postear en el muro(); else // Process Error MessageBox.Show (oauthResult.ErrorDescription); Browser.Visibility = System.Windows.Visibility.Collapsed;
Paso 12: Agregar un método de publicación
Ahora que tenemos acceso, podemos continuar y publicar en la pared del usuario. Cree un nuevo método de anulación privado llamado postToWall y agregue las siguientes líneas:
Private void PostToWall () var parameters = new Dictionary(); parámetros ["mensaje"] = Mensaje.Texto; client.PostAsync ("me / feed", parámetros);
El único parámetro que debemos enviar a esta llamada es el mensaje que publicaremos en el muro del usuario. El mensaje que enviaremos será el texto de nuestro TextBox llamado "Mensaje". El mensaje se publicará de forma asíncrona, por lo que se llamará al evento PostCompleted una vez que la tarea haya finalizado, por lo tanto, no es necesario agregar un controlador de eventos para ello.
Paso 13: Controlador de eventos PostCompletado
Ya que solo queremos agregar el controlador de eventos una vez, lo agregaremos al constructor, justo después de que nuestro cliente se haya inicializado. Dentro del controlador, verifique si la publicación se completó exitosamente o si hubo errores durante las operaciones, luego notifique al usuario:
// Constructor public MainPage () InitializeComponent (); cliente = nuevo FacebookClient (); client.PostCompleted + = (o, args) => // Buscando errores si (args.Error! = null) Dispatcher.BeginInvoke (() => MessageBox.Show (args.Error.Message)); else Dispatcher.BeginInvoke (() => MessageBox.Show ("Mensaje publicado con éxito")); ;
Paso 14: Probando el Código
Con este código, nuestra aplicación ya debería poder publicar un mensaje a través de la cuenta de Facebook del usuario.
Ejecute la aplicación en el emulador, intente publicar cualquier mensaje de prueba que desee y al final debe recibir un mensaje que le dice: "Mensaje publicado con éxito".
Ahora abra la cuenta de Facebook en un navegador web, y debería ver el mensaje que acaba de publicar:
¡Felicidades! Ahora tiene una aplicación que puede conectarse a Facebook, pero todavía hay algunas cosas que podemos mejorar. Por ejemplo, podríamos intentar guardar el token de acceso para que los usuarios no tengan que iniciar sesión cada vez que abren la aplicación..
Paso 15: Guardar el token de acceso
Vamos a guardar el token para la configuración de la aplicación, pero para hacer esto, primero debemos importar la biblioteca IsolatedStorage:
utilizando System.IO.IsolatedStorage;
Con esta biblioteca ahora podemos continuar y crear el método:
private void SaveToken (String token) // Si es la primera vez que se guarda, cree la clave en ApplicationSettings y guarde el token; de lo contrario, modifique la clave if (! IsolatedStorageSettings.ApplicationSettings.Contains ("token")) IsolatedStorageSettings.ApplicationSettings. Añadir ("token", token); else IsolatedStorageSettings.ApplicationSettings ["token"] = token; IsolatedStorageSettings.ApplicationSettings.Save ();
Paso 16: Recuperar con el Token Guardado
Ahora necesitamos obtener el token de IsolatedStorage:
cadena privada GetToken () // Si no hay un token en la memoria, simplemente devuelva nulo, de lo contrario, devuelva el token como una cadena si (! IsolatedStorageSettings.ApplicationSettings.Contains ("token")) devuelve un nulo; de lo contrario, devuelve IsolatedStorageSettings.ApplicationSettings ["token"] como cadena;
Paso 17: Iniciar sesión con el token guardado
Con estos dos métodos, ahora podemos recuperar el token y asignarlo a nuestro cliente cada vez que se abre la aplicación:
// Constructor public MainPage () InitializeComponent (); cliente = nuevo FacebookClient (); client.PostCompleted + = (o, args) => // Buscando errores si (args.Error! = null) Dispatcher.BeginInvoke (() => MessageBox.Show (args.Error.Message)); else Dispatcher.BeginInvoke (() => MessageBox.Show ("Mensaje publicado con éxito")); ; // Comprobando el token guardado si (GetToken ()! = Null) client.AccessToken = GetToken ();
Paso 18: Verificando Tokens Vencidos
Otra cosa a tener en cuenta es que el usuario puede rechazar los permisos de nuestra aplicación, por lo que debemos detectar esto y solicitar permisos nuevamente. Esta detección se debe hacer en nuestro controlador de PostCompletado, ya que ahí es donde Facebook nos notificará de un problema con nuestra publicación. Agregue las siguientes líneas a nuestro controlador PostCompletado:
client.PostCompleted + = (o, args) => // Buscando errores if (args.Error! = null) // Error de autorización if (args.Error is FacebookOAuthException) Dispatcher.BeginInvoke (() => MessageBox .Show ("Error de autorización")); // Eliminar el token real ya que ya no funciona. SaveToken (null); client.AccessToken = null; else Dispatcher.BeginInvoke (() => MessageBox.Show (args.Error.Message)); else else Dispatcher.BeginInvoke (() => MessageBox.Show ("Mensaje publicado con éxito")); ;
Paso 19: Modificar el botón Atrás
Solo como último paso, debemos dar al usuario la opción de cerrar el navegador cuando lo desee.. Esta acción debe asignarse al botón Atrás, por lo que solo necesitamos modificar el controlador de eventos para lograrlo..
Agregue el siguiente método a su código:
protegido anular el vacío OnBackKeyPress (System.ComponentModel.CancelEventArgs e) // Si el navegador está visible, ocúltelo y cancele el evento de navegación si (Browser.Visibility == System.Windows.Visibility.Visible) Browser.Visibility = System.Windows .Visibilidad.Collapsed; e.Cancelar = verdadero; base.OnBackKeyPress (e);
Paso 20: El producto final
Prueba tu aplicación una vez más, ahora tienes una aplicación de Facebook completamente operativa!
A dónde ir desde aquí
Facebook no solo se trata de actualizar tu estado. Hay muchas otras cosas que podría agregar a su aplicación, como compartir fotos, enviar recomendaciones de aplicaciones a amigos, etc. El C # SDK de Facebook ofrece muchas posibilidades para la integración de Facebook. Para obtener más información al respecto, visite su página web y comience a trabajar para que su aplicación sea más social!
Share
Accentsconagua
