WP7 Integración de Twitter con su aplicación

Con la integración de Twitter, los usuarios pueden compartir el contenido de la aplicación en su línea de tiempo. Por ejemplo, en las aplicaciones multimedia, un usuario puede twittear la canción que está escuchando, o si la aplicación es un juego, se puede twittear un nuevo logro desbloqueado. La integración de Twitter a su aplicación lo ayudará a destacar y permitirá a los usuarios promocionarlo..

Paso 1: Creación de proyectos de Visual Studio

Para comenzar, necesitamos crear un nuevo proyecto en Visual Studio. Para este tutorial necesitamos 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 preguntará acerca de la versión del sistema operativo Target para Windows Phone. Si ese es el caso, seleccione el sistema operativo 7.1.

Paso 2: Construyendo la interfaz de usuario

Ahora que se creó el proyecto, abra el archivo "MainPage.xaml", si aún no está abierto, y cambie el cuadro de texto predeterminado de la aplicación y el nombre de la página:

Ahora, en la cuadrícula de ContentPanel, agregue dos filas, una para un TextBox donde el usuario ingresará el nuevo estado y la otra para que el botón envíe el estado:

Luego, agregue un TextBox en la primera fila con el nombre "Mensaje" y un botón en la segunda fila:

Al final debes tener esto:

Paso 3: Crear una cuenta de desarrollador de Twitter

Para conectarse a Twitter, primero necesitará una cuenta de desarrollador. Vaya a la página de inicio de desarrolladores de Twitter e inicie sesión con su cuenta de Twitter o cree una si todavía no tiene una.

Paso 4: Registro de la nueva aplicación

Una vez que haya iniciado sesión, vaya a la página "Mis aplicaciones" y luego haga clic en el botón "Crear una nueva aplicación". En la siguiente página, complete los Detalles de la aplicación y, si ya tiene un sitio web, ingrese su sitio en los campos URL del sitio web y de devolución de llamada. De lo contrario, utilice un marcador de posición como "http://www.google.com". Después de este paso, aparecerá una nueva página con dos tokens, el "Token de acceso" y el "Secreto del token de acceso". Copie estos códigos y agréguelos como cadenas constantes en la parte superior de su constructor "MainPage.xaml.cs":

 private const string consumerKey = "su clave aquí"; private const string consumerSecret = "su secreto aquí"; // Constructor public MainPage () InitializeComponent ();

Paso 5: Introducción a Tweetsharp

Twitter tiene una API completa que le permite conectar su aplicación al servicio de varias maneras. Es claro y fácil de seguir, por lo que es un gran complemento para cualquier aplicación. Tenga en cuenta que la API de autenticación se ha creado utilizando OAuth, lo que la hace muy segura, pero a los desarrolladores les resulta difícil conectarse a la API. Los pasos para conectarse a la API se explican en la Documentación de OAuth de la API. Hay diferentes formas de conectarse, pero en este tutorial vamos a utilizar la autorización de 3 patas. Este método solicita un token de solicitud, luego lleva al usuario a una página de inicio de sesión y recopila el AccessToken. Este proceso puede ser un poco complicado, especialmente si está intentando agregar solo una o dos características de la API. Afortunadamente, hay una biblioteca desarrollada por Daniel Crenna llamada Tweetsharp. Tweetsharp es una gran herramienta que simplificará la comunicación entre tus aplicaciones WP7 y Twitter. Es muy fácil de usar y le da acceso a toda la API de Twitter desde una sola biblioteca:

TweetSharp es una biblioteca de API de Twitter que simplifica la tarea de agregar Twitter a su escritorio, web y aplicaciones móviles. Puede crear widgets simples o conjuntos de aplicaciones complejas con TweetSharp.

Puede encontrar más información sobre el proyecto visitando su sitio web y observando los proyectos de ejemplo alojados..

Paso 6: Descargando Tweetsharp

La biblioteca solo está disponible a través de NuGet, por lo que, en caso de que Visual Studio no incluya el administrador de paquetes NugGet, debe descargarla desde la página de inicio 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 TweetSharp.

Paso 7: Agregar Tweetsharp al Proyecto

Ahora que tenemos la biblioteca, podemos agregarla a nuestro proyecto. Agregue una nueva importación en el archivo "MainPage.xaml.cs":

 utilizando Tweetsharp

Paso 8: Agregar un navegador

Para conectar una aplicación a la cuenta de Twitter de un usuario, primero debemos tener acceso y permiso a la cuenta de Twitter. Esto se hace a través de la página web de Twitter. Por lo tanto, tenemos que añadir un navegador web. El navegador debe cubrir la mayor parte de la página, por lo que inicialmente se colapsará y luego cambiará a visible solo cuando el usuario necesite iniciar sesión. En el archivo "MainPage.xaml" agregue un nuevo WebBrowser justo debajo de ContentPanel:

Paso 9: Conectarse a Twitter

Ahora que hemos agregado Tweetsharp y el navegador web, podemos continuar y conectar nuestra aplicación a Twitter. La conexión se realiza a través de un objeto TwitterService. Por lo tanto, necesitamos crear una variable global privada e inicializarla en el constructor:

 cliente privado de TwitterService; // Constructor public MainPage () InitializeComponent (); cliente = nuevo TwitterService (consumerKey, consumerSecret);

Paso 10: Agregar el evento Click

La primera vez que un usuario haga clic en el botón "Tweet", debe enviarlo a la página de inicio de sesión de Twitter para que pueda darle el permiso necesario para su aplicación. Para ello, solicite un RequestToken. Una vez que tenga el token, vaya a la página de inicio de sesión. Primero, debe agregar el evento de clic en su botón de clic:

Ahora agregue ese método al código:

 twid privado twittClick (remitente del objeto, RoutedEventArgs e) // Solicitar el token

Antes de que podamos agregar el código para el token, necesitamos dos cosas, una variable booleana que nos indica si el usuario ya ha iniciado sesión y una variable que guardará el RequestToken. Agreguemos esto al código sobre el constructor:

 solicitud privada OAuthRequestTokenToken; private bool userAuthenticated = false;

Paso 11: Procesando el RequestToken

Con las variables listas, podemos ir y crear el método para procesar nuestro RequestedToken. Esto comprobará los errores. Si todo se hizo correctamente, guarde el token y lleve al usuario a la URL de inicio de sesión desde RequestToken:

 private void processRequestToken (token de OAuthRequestToken, respuesta de TwitterResponse) if (token == null) Dispatcher.BeginInvoke (() => MessageBox.Show ("Error al recibir el token de solicitud");)); else requestToken = token; Dispatcher.BeginInvoke (() => Browser.Visibility = System.Windows.Visibility.Visible; Browser.Navigate (client.GetAuthorizationUri (requestToken)););

Ahora agregue el código para solicitar el token dentro del método de evento Click:

 // Si el usuario ya ha iniciado sesión, simplemente envíe el tweet; de lo contrario, obtenga el RequestToken si (userAuthenticated) // envíe el tweet, esto es solo un marcador de posición, agregaremos el código real más adelante Dispatcher.BeginInvoke (() =>  MessageBox.Show ("Marcador de posición para enviar tweets");); else client.GetRequestToken (processRequestToken);

Paso 12: Agregando Evento Navegado

Después de que el usuario inicie sesión y acepte nuestra aplicación, Twitter nos llevará a una URL que contiene un código verificador que necesitamos para solicitar el AccessToken. Añadamos este método de evento a nuestro navegador.

Usa el código del evento:

 void privado browserNavigated (remitente del objeto, System.Windows.Navigation.NavigationEventArgs e)

Para recuperar el código del verificador de la URL necesitamos un analizador, que en este caso es un método que se encuentra en la biblioteca de extensiones de Hammock. Copia este código y agrégalo a tu proyecto:

 // De Hammock.Extensions.StringExtensions.cs IDICtionary estático público ParseQueryString (cadena consulta) // [DC]: este método no descodifica URL, y no puede manejar la entrada descodificada si (query.StartsWith ("?")) Query = query.Substring (1); if (query.Equals (string.Empty)) return New Dictionary();  var parts = query.Split (new [] '&'); devuelva las partes.Seleccione (parte => parte.Split (nuevo [] '=')). ToDictionary (pair => pair [0], pair => pair [1]);

Con este método podemos ir y obtener el código del verificador en el método de evento browserNavigated:

 private void browserNavigated (emisor de objetos, System.Windows.Navigation.NavigationEventArgs e) if (e.Uri.AbsoluteUri.Contains ("oauth_verifier")) var values = ParseQueryString (e.Uri.AbsoluteUri); verificador de cadena = valores ["oauth_verifier"]; // getTheAccessToken Dispatcher.BeginInvoke (() => Browser.Visibility = System.Windows.Visibility.Collapsed;);

Paso 13: Procesando el AccessToken

Al igual que con RequestToken, tenemos que crear un método que maneje el resultado de la solicitud de AccessToken. Una vez que recibamos el resultado debemos comprobar si hay errores. Si la solicitud se realizó con éxito, autentificamos al usuario y enviamos el Tweet:

 private void processAccessToken (token de OAuthAccessToken, respuesta de respuesta de Twitter) if (token == null) Dispatcher.BeginInvoke (() => MessageBox.Show ("Error al obtener el token de acceso");)); else client.AuthenticateWith (token.Token, token.TokenSecret); userAuthenticated = true; // Enviar el Tweet, agregaremos este código más adelante

Una vez completado, vaya al método browserNavigated y cambie el comentario getTheAccessToken con la siguiente línea:

 client.GetAccessToken (requestToken, verifier, processAccessToken);

Paso 14: Manejo de una respuesta de Tweet

Cuando enviemos un Tweet, queremos saber si se envió con éxito. Es por eso que necesitamos otro método para manejar un Tweet. Aquí está el código que necesitamos agregar:

 private void tweetResponse (tweet de TwitterStatus, respuesta de TwitterResponse) if (response.StatusCode == HttpStatusCode.OK) Dispatcher.BeginInvoke (() => MessageBox.Show ("Tweet publicado correctamente");)); de lo contrario Dispatcher.BeginInvoke (() => MessageBox.Show ("Error, inténtalo de nuevo más tarde"););

Finalmente, vaya y cambie el comentario Enviar Tweet sobre los métodos processAccessToken y tweetClick con la siguiente línea:

 Dispatcher.BeginInvoke (() => client.SendTweet (Message.Text, tweetResponse));

Paso 15: Probando tu aplicación

En este momento su aplicación debería ser completamente funcional, así que vaya y pruébela. Ingrese cualquier mensaje, haga clic en el botón "Tweet" y aparecerá la siguiente pantalla.

Después de eso, debería aparecer un mensaje que dice "Tweet publicado correctamente":

Si va a la cuenta de Twitter, también debería poder ver el Tweet que acaba de enviar:

¡Felicidades! ¡Ahora tienes una aplicación que puede conectarse a Twitter! Pero aún no hemos terminado. Hay algunas áreas que podemos mejorar..

Paso 16: Guardando el AccessToken

Cada vez que un usuario abre su aplicación, tendrá que pasar por la página de inicio de sesión de Twitter. Esto es algo que a los usuarios no les gusta. Quieren registrarse una vez y poder twittear sin problemas. Este problema es fácil de resolver. Necesitamos guardar el AccessToken que obtuvimos la primera vez que el usuario inicia sesión. Una vez que se completa, se guarda en IsolatedStorage y siempre estará accesible. Esto se puede hacer usando el siguiente método:

 private void saveAccessToken (OAuthAccessToken token) if (IsolatedStorageSettings.ApplicationSettings.Contains ("accessToken")) IsolatedStorageSettings.ApplicationSettings ["accessToken"] = token; else IsolatedStorageSettings.ApplicationSettings.Add ("accessToken", token); IsolatedStorageSettings.ApplicationSettings.Save ();

E importando la librería IsolatedStorage:

 utilizando System.IO.IsolatedStorage;

Ahora podemos guardar el AccessToken obtenido del método processAccessToken:

 private void processAccessToken (token de OAuthAccessToken, respuesta de respuesta de Twitter) if (token == null) Dispatcher.BeginInvoke (() => MessageBox.Show ("Error al obtener el token de acceso");)); else client.AuthenticateWith (token.Token, token.TokenSecret); saveAccessToken (token); userAuthenticated = true; Dispatcher.BeginInvoke (() => client.SendTweet (Message.Text, tweetResponse));

Paso 17: Recuperando el AccessToken

Con el token ya en IsolatedStorage, necesitamos un método para recuperarlo. Anímate y agrega el siguiente método:

 OAuthAccessToken privado getAccessToken () if (IsolatedStorageSettings.ApplicationSettings.Contains ("accessToken")) devuelve IsolatedStorageSettings.ApplicationSettings ["accessToken"] como OAuthAccessToken; de lo contrario devuelve nulo;

Esta función debe llamarse desde el constructor porque queremos iniciar sesión desde el principio:

 // Constructor public MainPage () InitializeComponent (); cliente = nuevo TwitterService (consumerKey, consumerSecret); // Chek si ya tenemos los datos de Autehntification var token = getAccessToken (); if (token! = null) client.AuthenticateWith (token.Token, token.TokenSecret); userAuthenticated = true;

Paso 18: Verificando Tokens Vencidos

Además, tenga en cuenta que el usuario puede rechazar el permiso de nuestra aplicación, por lo que debemos detectar esto y pedir permiso nuevamente. Esta detección se debe realizar en nuestro método tweetResponse, ya que ahí es donde Twitter le notifica cualquier problema con su publicación. Cambie el código de tweetResponse a lo siguiente:

 private void tweetResponse (tweet de TwitterStatus, respuesta de TwitterResponse) if (response.StatusCode == HttpStatusCode.OK) Dispatcher.BeginInvoke (() => MessageBox.Show ("Tweet publicado correctamente");));  else if (response.StatusCode == HttpStatusCode.Unauthorized) saveAccessToken (null); userAuthenticated = false; Dispatcher.BeginInvoke (() => MessageBox.Show ("Error de autenticación"););  else Dispatcher.BeginInvoke (() => MessageBox.Show ("Error, inténtalo más tarde"););

Paso 19: Modificar el botón Atrás

Una última característica para agregar a su aplicación es permitir al usuario cerrar el navegador si lo desea. Ahora mismo, si aparece el navegador, la única forma de cerrarlo es iniciar sesión o con un error. Puedes darle al usuario esta opción usando el botón Atrás:

 anulación protegida nula OnBackKeyPress (System.ComponentModel.CancelEventArgs e) if (Browser.Visibility == System.Windows.Visibility.Visible) Browser.Visibility = System.Windows.Visibility.Collapsed; e.Cancelar = verdadero;  base.OnBackKeyPress (e);

A dónde ir desde aquí

Este tutorial es una breve explicación de lo que puedes hacer con Tweetsharp y Twitter. Si está interesado en aumentar la funcionalidad de su aplicación, como obtener menciones, retweets, mensajes directos y otras características, vaya al sitio web de Tweetsharp y encontrará todo lo que necesita para comenzar a desarrollar una gran aplicación. Espero que hayan disfrutado este tutorial y que sea útil para sus futuros proyectos..

Código