Integración de Autenticación con API de Platzi Tweets

Clase 25 de 52 • Curso de Desarrollo de Apps para iOS

Resumen

¿Cómo integrar el login con los servicios de Platzi Tweets?

Integrar el login de nuestra aplicación con los servicios de Platzi Tweets es un paso esencial para implementar la autenticación real. Debemos familiarizarnos con el API de Platzi Tweets y las entidades necesarias. Si no has completado el reto previo, te proporcionamos el material descargable para que puedas seguir adelante.

¿Qué entidades y endpoints se necesitan crear?

Es crucial definir las entidades que interactuarán con el API, como LoginResponse y Error. Estas entidades deben estar organizadas en un directorio de modelos, asegurando que cada estructura representa correctamente las entidades del API. Además, es fundamental identificar los endpoints, es decir, las URLs a las que apuntaremos para las diferentes operaciones como autenticación y registro.

¿Cómo se realizan las validaciones y configuraciones iniciales?

Primero, importa las librerías necesarias: SimpleNetworking para manejar las peticiones de red y una librería de indicadores de carga para mejorar la experiencia del usuario.

import SimpleNetworking
import MyLoadingIndicatorLibrary

Asegúrate de que las validaciones de los campos de email y password son correctas. Estos datos ya estan disponibles y verificamos que no estén vacíos antes de proseguir.

¿Cómo configurar y manejar la peticion de login?

Sigue los pasos de la documentación de SimpleNetworking para realizar una petición POST:

let loginRequest = LoginRequest(email: userEmail, password: userPassword)
SN.request.post(endpoint: Endpoints.login, model: loginRequest) { (response: Response<LoginResponse, ErrorResponse>) in 
    switch response {
    case .success(let user):
        // Maneja el éxito
    case .error:
        // Maneja un error desconocido
    case .errorWithResponse(let error):
        // Maneja los errores controlados
    }
}

loginRequest utiliza los datos validados.
Configura el endpoint y el modelo que utilizaremos.
Utiliza un switch para manejar los diferentes casos de respuesta del API.

¿Cómo mostrar al usuario que la petición está en proceso?

Utiliza una librería de indicadores de carga para notificar al usuario y optimizar la usabilidad:

LoadingIndicator.show()

Al completar la petición, asegúrate de realizar la siguiente acción:

LoadingIndicator.dismiss()

¿Cómo responder al usuario tras el login?

Una vez controlados los diferentes escenarios del switch, muestra un banner de notificación al usuario:

NotificationBanner.show(style: .success, message: "Bienvenido, \(user.name)")

Este banner le indica al usuario que ha iniciado sesión exitosamente. También puedes gestionar errores desconocidos o conocidos mostrando banners con estilos y colores apropiados según el tipo de error.

Ahora, es tu turno. Desafíate a implementar banners para cada caso de error y lleva al usuario a la pantalla principal de la aplicación si el login es exitoso. ¡Continúa aprendiendo y mejorando tus habilidades de desarrollo!

Wilson Montenegro

student•

  switch response {
                        case .success(let user):
                            //todo lo bueno
                            self.performSegue(withIdentifier: "showHome", sender: nil)
                            DispatchQueue.main.async {
                                NotificationBanner(subtitle: "Bienvenido \(user.user.names)", style: .success).show()
                            }

Percy Bloomfield

student•

El servicio ya no está disponible.!

Maria Isabel Torres Torres

student•

Sigue saliendo el error 503 =(

Alejandro Reyna

student•

Al parecer el servicio que se usaba para el proyecto en heroku ya no está funcionando, seguramente porque heroku pasó a ser de pago.

He estado buscando el repositorio del backend que se utilizó para este proyecto en la cuenta de github de platzi y pues, creo que tampoco existe.

Quizá lo más recomendable sería levantar un proyecto de backend para que responda a los servicios cómo lo hacía el anterior, aunque no cargue nada a la base de datos, yo por mi parte creo que dejo el curso aquí a nivel práctico y sólo lo seguiré tomando a nivel teórico.

Tal vez con más tiempo después cree ese backend y publique el repositorio para que quien pase por aquí lo pueda correr y probar de manera local.

Emmanuel Guerra Sánchez

student•

Si se les crashea el app, es por el SVProgressHUD. Tienen que hacer lo siguiente:

En la clase AppDelegate agregar esta variable:

var window: UIWindow?

Y en la primera función de la clase SceneDelegate, agregar esta linea:

(UIApplication.shared.delegate as? AppDelegate)?.self.window = window

Fuente

Anthony Santiago

student•

Me funcionó! Gracias

Gonzalo Ferrando

student•

Usuario: test@test.com Password: qwerty

Piero Acevedo

student•

Profesor, la API no me funciona, puede actualizarla?

Félix Luján Albarrán

student•

Hola Carlos, Cuando pruebo la aplicación con el email y password me arroja este error:

Error Domain=NSURLErrorDomain Code=-999 &quot;cancelled&quot; UserInfo={NSErrorFailingURLStringKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth, NSLocalizedDescription=cancelled, NSErrorFailingURLKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth}
custom(error: Optional(Error Domain=NSURLErrorDomain Code=-999 &quot;cancelled&quot; UserInfo={NSErrorFailingURLStringKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth, NSLocalizedDescription=cancelled, NSErrorFailingURLKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth}))
2020-03-08 10:00:12.442863+0100 PlatziTweets[5854:126753] Task &lt;7743DB2C-A343-4C09-962E-F03F051EDA59&gt;.&lt;1&gt; HTTP load failed, 0/0 bytes (error code: -999 [1:89])

Por postman lo he probado y va bien, alguna idea ? Gracias!!

Carlos Mejía

teacher•

¡Hola! :)

El error que presentas es algo genérico, si puedes por favor comparte la parte en la que haces el llamado al servicio y yo podré ver con más cuidado cual puede ser tu error, un saludo!

Carlos Mejía

teacher•

Hola de nuevo!

Encontré el error que tienes, asegurate de estar utilizando la versión 0.3.2 del Pod Simple-Networking.

pod 'Simple-Networking', '~> 0.3.2'

o en su defecto, puedes actualizar a la última versión que acabé de probar y funciona bien con el proyecto, es la 0.3.6.

Puedes actualizar tus pods, con el siguiente comando (en la carpeta del proyecto)

pod update

Cuando hagas pod update, podrás ver algo como así en tu consola

Horacio Cantu Garcia

student•

Hola Carlos como le puedo hacer si quisiera usar una base de datos para la autenticacion o que es lo que tengo que hacer para hacer las paginas como las tienen ustedes para tomar la autenticacion y poner informacion guardada ya sea en un archivo o base de datos en una tabla , las conecciones que muestras ya las tienen hechas pero como puedo hacer unas propias

Massimo Di Berardino

student•

Hola Horacio, una manera sencilla y muy eficiente de hacerlo seria con Firebase como base de datos. Te comparto el paso a paso de como agregarlo

Félix Luján Albarrán

student•

Hola Carlos, Cuando pruebo la aplicación con el email y password me arroja este error:

Error Domain=NSURLErrorDomain Code=-999&quot;cancelled&quot; UserInfo={NSErrorFailingURLStringKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth, NSLocalizedDescription=cancelled, NSErrorFailingURLKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth}
custom(error: Optional(Error Domain=NSURLErrorDomain Code=-999&quot;cancelled&quot; UserInfo={NSErrorFailingURLStringKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth, NSLocalizedDescription=cancelled, NSErrorFailingURLKey=https://platzi-tweets-backend.herokuapp.com/api/v1/auth}))
2020-03-0810:00:12.442863+0100 PlatziTweets[5854:126753] Task &lt;7743DB2C-A343-4C09-962E-F03F051EDA59&gt;.&lt;1&gt; HTTP load failed, 0/0 bytes (errorcode: -999 [1:89])```
Por postman lo he probado y va bien, alguna idea ?
Gracias!!

José Javier Cueto Mejía

student•

@catscs ya lo resolviste, me salio lo mismo 🙁

Félix Luján Albarrán

student•

No aun nada :(

Nicolás Pinilla

student•

el endpoint me retorna error 503Service Unavailable.

Edwin Mejia

student•

Señores Platzi. El servicio de heroku ya no esta disponible,, pueden actualizar con algo?

Enrique Espinosa Rodriguez

student•

Una pregunta, el Endpoint sigue funcionando?

Maximiliano A Filsinger

student•

Hola Enrique! también comencémoslos el curso esta semana... Llegue hasta aquí y no logro que me acepte el usuario... Ojalá que todavía siga funcionando!

Nicolás Pinilla

student•

aparentemente no funciona

Daniel Isaac Rocha Gil

student•

quiero mantener la sesion, si el usuario ya inicio la app, alguien sabe sobre este tema. Ayuda!!!

Gonzalo Ferrando

student•

            switch response {
            case .success(let user):
                // todo lo bueno
                NotificationBanner(subtitle: "Bienvenido \(user.user.names)", style: .success).show()
            
            case .error(let error):
                // todo lo malo
                NotificationBanner(title: "Error", subtitle: "No podemos conectarnos con el servidor", style: .warning).show()
                
            case .errorResult(let entity):
                // error pero no tan malo
                NotificationBanner(title: "Error", subtitle: "Verifique sus credenciales", style: .warning).show()
            }```

Maximiliano A Filsinger

student•

Ok! gracias a este al menos ahora puedo saber que el error es que no se conecta al servidor... creo que hasta aquí llego el curso entonces... :'(

Marcos Abdiel Arroyo Gonzalez

student•

me quede un poco estancado porque el servicio siempre me mandaba error, hasta que me di cuenta que trae mas datos del usuario, se los agregue a la clase y ya pude continuar

struct User: Codable {
    let email:String
    let names: String
    let nickname: String
    let createdAt: String
    let id: String
}

David Barreto

student•

Hola Marcos, estoy en camino a iniciar este curso este mes, y queria saber si pudiste desarrollar la App, cuentame por favor.

Paolo Donato Torregrosa Navarro

student•

Las librerias de iOS tienen una calidad muy buena

Paolo Donato Torregrosa Navarro

student•

En caso de que tubieran problemas con la leccion anterior les dejo como me quedo a mi 👀 no sean tramposos.

import Foundation

struct Api {
    static let domain = "https://platzi-tweets-backend.herokuapp.com/api/v1"
    static let login = Api.domain + "/auth"
    static let register = Api.domain + "/register"
    static let tweets = Api.domain + "/posts"
}

struct User: Codable {
    let email: String
    let names: String
    let nickname: String
}

struct Location: Codable {
    let latitude: Double
    let longitude: Double
}

struct ErrorResponse: Codable {
    let error: String
}

// Login /auth
struct LoginRequest: Codable {
    let email: String
    let password: String
}

struct LoginResponse: Codable {
    let user: User
    let token: String
}

// Register /register
struct RegisterRequest: Codable {
    let email: String
    let names: String
    let password: String
}

struct RegisterResponse: Codable {
    let user: User
    let token: String
}

// Tweets
struct TweetResponse: Codable {
    let id: String
    let author: User
    let imageUrl: String
    let text: String
    let videoUrl: String
    let location: Location
    let hasVideo: Bool
    let hasImage: Bool
    let hasLocation: Bool
    let createdAt: String
}

struct Tweet: Codable {
    let imageUrl: String
    let text: String
    let videoUrl: String
    let location: Location
}

struct DeleteTweetResponse: Codable {
    let isDone: Bool
    let message: String
}

Edwin Yovany Orbes Villacorte

student•

Jose Gamiz Espejo

student•

Hola Carlos,

al probar la app con el login, me muestra este error controlado:

es por el mismo motivo que a mi compañero @catscs?

Gracias

Carlos Mejía

teacher•

Lo más probable es que estés apuntando al endpoint incorrecto, el login no te pide token de autenticación :)

Ignacio Castillejo Gómez

student•

Haciendo pruebas me di cuenta de una cosa:

Hay que tener mucho cuidado con el nombre que ponemos en nuestros structs porque tienen que hacer un mach perfecto de la respuesta del servidor.

Yo por ejemplo: cambie en el login request password por pwd y en el login response, en el struct user cambie names por name (porque estoy acostumbrado a esa nomenclatura y me gusta personalmente)

Respuesta: Error no controlable como respuesta al SN.post (ya sabéis, de los dos errores el malo malo)

Como conclusión creo que hay que aprender una forma diferente/mejor de hacerlo. No es aceptable que cuando tienes un app en producción esta falle sin posibilidad a manejar el error porque el binding de variables no hace mach.

Aún así dejar claro que no es hate, es lógico y apoyo que cuando le entras nuevo a una materia hay que darle suave al principio. 🚀

Y tu... ¿Sabes como poder llamar a tus variables name (por ejemplo) cuando la respuesta del server es names? Me gustaría mucho saber cómo hacerlo.

Fabrizzio Chávez Tejada

student•

struct Person: Codable {
    var name: String
    
    enum CodingKeys: String, CodingKey {
        case name = "names"
    }
}

Hay opciones para ajustar la encodificación y decodificación de las propiedades: https://developer.apple.com/documentation/foundation/archives_and_serialization/encoding_and_decoding_custom_types

Carlos Mejía

teacher•

Ignacio, tu apunte es excelente y es una pregunta que nos hacemos cuando avanzamos más hacia el mundo en producción, si bien existen los coding keys, como mencionan en el comentario de arriba, tu puedes serializar manualmente las respuestas de los servicios de diccionarios a tus estructuras, así por ejemplo, podrías manejar casos en los que no venga una propiedad y quieras poner una por defecto, o parecidos.

Un saludo!