Consumiendo servicios RESTful en Xamarin.Forms


Introducción

Normalmente como desarrolladores nos toparemos con la parte en donde debemos de mostrar información que provenga de algún servicio, es por eso que, en este artículo, aprenderemos cómo consumir un servicio RESTful en una aplicación .Net Standard de Xamarin.Forms.

¿Qué son los servicios RESTful?

Representational State Transfer (REST) ​​es un estilo arquitectónico que especifica restricciones como la interfaz uniforme, que, si se aplica a un servicio web, induce propiedades deseables como el rendimiento, la escalabilidad y la modificabilidad que permiten que los servicios funcionen mejor en la Web.

Comencemos

Para este ejemplo voy a suponer que ya han creado su aplicación en Xamarin.Forms, una vez realizado esto vamos a utilizar un servicio RESTful falso en nuestra aplicación. Para esto solo busquemos “JsonPlaceholder” y abramos el primer enlace.

https://jsonplaceholder.typicode.com/

Ahora, tenemos que encontrar un punto final para usar en nuestra aplicación. Desplacémonos hacia abajo en la página del marcador de posición JSON y encontraremos los recursos.

1

Estos son todos los puntos finales, los cuales podemos usarlos en nuestra aplicación. En este ejemplo, vamos a usar el punto final “/posts”. Por lo tanto, hagamos clic en el enlace y veamos el resultado JSON. Posterior a esto, copiemos el enlace del punto final para usarlo en nuestra aplicación.

Después de presionarlo podemos ver los resultados como se muestra a continuación:

2

Ahora, tenemos que convertir este JSON en clase C#. Entonces, vamos a usar una forma fácil de convertir JSON a C# usando “Json2csharp“. Abramos este enlace y peguemos el punto que copiamos con anterioridad. Veremos que esto generará automáticamente una clase C# de JSON, como se muestra a continuación.

3

Ahora, copiemos el código de clase, puesto que lo vamos a usar estos en nuestra aplicación. Regresemos a nuestro proyecto antes creado en Visual Studio.

Generemos una nueva página (ContentPage) a nivel raíz de nuestra solución, la cual denominaremos PostRestPage y en esta peguemos el código de la clase y la URL en el code behind.

4

Para consumir el servicio web, debemos agregar dos paquetes a nuestro proyecto. Estos se deben de agregar en cada proyecto de la solución.

JSON | Net.Http

Para agregar estos, debemos de hacer clic derecho en la solución -> Administrar paquetes NuGet para la solución (Manage NuGet Packages for Solution).

5

Ahora, busquemos Newtonsoft.Json, verifiquemos que todos los proyectos estén seleccionados e instalemos el paquete en la solución.

6

De forma similar, busquemos el segundo paquete “Microsoft.Net.Http” e instálemoslo en todos los proyectos de la solución.

7

Ahora, agreguemos los siguientes espacios de nombres de paquetes en la parte superior de nuestro archivo PostRestPage.xaml.cs

using System.Net.Http;
using Newtonsoft.Json;
using System.Collections.ObjectModel;

Ahora, editemos nuestro XAML para agregar una lista simple, en la cual mostraremos la lista de publicaciones provenientes de nuestro servicio.

8

Lo que hicimos fue declarar una lista en la cual vinculamos el título y el cuerpo a la celda de texto. Posteriormente editemos él .CS, e insertemos el siguiente código para obtener la lista pertinente:

public partial class PostRestPage : ContentPage
	{
        private const string url = "https://jsonplaceholder.typicode.com/posts";
        private HttpClient _Client = new HttpClient();
        private ObservableCollection _post;

        public PostRestPage ()
		{
			InitializeComponent ();
		}

        protected override async void OnAppearing()
        {
            var content = await _Client.GetStringAsync(url);
            var post = JsonConvert.DeserializeObject<List>(content);
            _post = new ObservableCollection(post);
            Post_List.ItemsSource = _post;
            base.OnAppearing();
        }
    }

Explicación del código línea por línea

Dentro de nuestra clase MainPage, se coloca la URL, luego se crea e inicializa el objeto de HttpClient, y después de esto, creamos una colección observable. Esta colección se inicializa más adelante en el método de aparición y se asigna a nuestra vista de lista que se realiza en nuestro archivo XAML.

Ahora, en el método OnAppearing, usamos el objeto de nuestro HttpClient() y pasamos la URL en él. Después de esto, deserializamos el contenido proveniente de nuestra solicitud y luego inicializamos nuestra colección observable. Después de esto, establecemos el origen del elemento de nuestra lista en la colección observable.

Comprobemos que lo que realizamos funcione, por ende, ejecutemos nuestra aplicación, pero antes editemos la vista que se va a lanzar, esto en el App.xaml.cs: MainPage = new PostRestPage();

9.png

Como vemos, aquí se muestra la lista de publicaciones provenientes de nuestro servicio, en el cual se muestran el título y el cuerpo de todas las publicaciones.

Con esto hemos terminado, pueden descargar el código en el siguiente repositorio:

https://github.com/LucioMSP/Xamarin.Forms.Examples/tree/master/RestFul_Demo

Anuncios

Responder

Por favor, inicia sesión con uno de estos métodos para publicar tu comentario:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión /  Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión /  Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión /  Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión /  Cambiar )

Conectando a %s