1 00:00:02,120 --> 00:00:07,130 Comencemos por administrar el estado de carga aquí en la pantalla de autenticación porque obviamente quiero 2 00:00:07,130 --> 00:00:10,570 darle al usuario algunos comentarios cuando estamos esperando una respuesta. 3 00:00:10,670 --> 00:00:17,060 Para esto, podemos importar el indicador de actividad que ya conoce y administrar el estado 4 00:00:17,810 --> 00:00:26,990 de carga aquí agregando otro estado aquí, isLoading y set isLoading, que inicializamos en falso porque inicialmente no estamos cargando y ahora 5 00:00:26,990 --> 00:00:36,470 aquí cuando estamos en esta autenticación controlador, puedo agregar asíncrono aquí porque, por supuesto, registrarse aquí devuelve una promesa, lo mismo para el 6 00:00:37,370 --> 00:00:39,860 inicio de sesión, por lo 7 00:00:39,920 --> 00:00:46,040 que estas acciones funciones del creador devuelven promesas. Por lo tanto, podemos esperar el resultado del 8 00:00:46,070 --> 00:00:52,820 envío que finalmente utiliza estas promesas que obtenemos y básicamente inicia todo este proceso y antes de esperar esto, puedo 9 00:00:52,820 --> 00:00:56,890 establecer isLoading en verdadero, por lo que cuando comenzamos todo este proceso, 10 00:00:56,900 --> 00:01:02,720 antes de enviar una solicitud y, a partir de entonces, se establece Cargar en falso una vez que 11 00:01:02,840 --> 00:01:06,480 hayamos terminado con esta solicitud, sin importar si falló o no. 12 00:01:07,720 --> 00:01:10,320 Y ahora isLoading se puede usar para mostrar una 13 00:01:10,330 --> 00:01:15,760 rueda giratoria de carga, depende de usted dónde lo muestre, por ejemplo, podría decir que desea reemplazar este botón de 14 00:01:15,760 --> 00:01:17,890 registro con la rueda giratoria de carga. 15 00:01:17,890 --> 00:01:21,420 Entonces, aquí podríamos decir si isLoading es verdadero, quiero mostrar 16 00:01:21,490 --> 00:01:25,010 el indicador de actividad así, de lo contrario mostraré el 17 00:01:25,090 --> 00:01:27,520 botón, así que esta es la sintaxis 18 00:01:27,520 --> 00:01:29,590 que podríamos usar, establezca el 19 00:01:29,590 --> 00:01:38,510 tamaño aquí en pequeño y el color en Colores. primaria digamos. Ahora, si lo intentamos y volvemos, 20 00:01:38,510 --> 00:01:47,660 aquí en iOS si intento iniciar sesión, de hecho, veo el control de carga y luego estoy de regreso, así que 21 00:01:47,900 --> 00:01:48,410 eso 22 00:01:48,410 --> 00:01:54,800 funciona, ahora para el manejo de errores. Para el manejo de errores, también aprende cómo funciona. 23 00:01:54,830 --> 00:01:58,900 Por supuesto, también puede administrar su estado de error 24 00:01:58,940 --> 00:02:05,180 aquí, nuevamente podría usar el reductor de uso para combinar el estado de carga 25 00:02:05,180 --> 00:02:06,250 y error 26 00:02:06,470 --> 00:02:11,540 en un objeto, pero lo haré así, error y establecer error con 27 00:02:11,570 --> 00:02:22,010 la ayuda del estado de uso que inicialmente no No asigne un valor para que esto sea indefinido inicialmente y luego aquí, podemos ajustar el 28 00:02:22,010 --> 00:02:27,140 problema de este envío aquí donde obtenemos un error potencial y establecemos 29 00:02:27,140 --> 00:02:34,640 nuestro error en este mensaje de error que estamos volviendo y antes de enviar la solicitud, También quiero 30 00:02:34,640 --> 00:02:41,420 volver a establecer mi error en nulo. Así que ahora estamos almacenando un error potencial aquí en el error 31 00:02:41,610 --> 00:02:45,620 establecido y solo quiero lanzar una alerta, mostrarle una alerta al usuario si recibimos un error. 32 00:02:45,630 --> 00:02:52,110 Entonces, para esto, debe asegurarse de importar la alerta de React Native y también usar 33 00:02:52,110 --> 00:02:58,860 el efecto de reaccionar porque usar efecto nos permite reaccionar a los cambios en el estado 34 00:02:58,860 --> 00:03:09,340 de error y mostrar la alerta de error si tenemos un error. Entonces, tal vez aquí después de configurar el reductor, podemos agregar un efecto de uso 35 00:03:09,340 --> 00:03:14,620 y mi dependencia aquí es la variable de estado de error o constante y si 36 00:03:14,620 --> 00:03:23,190 tenemos un error, entonces si esto es verdadero, entonces quiero mostrar una alerta con la alerta API donde digo que ocurrió un error y mi 37 00:03:23,910 --> 00:03:29,580 mensaje es el error que debería ser una cadena y agregaré un botón donde tengo un texto 38 00:03:29,940 --> 00:03:34,840 de OK y, por supuesto, podría agregar más botones donde haga cosas diferentes. 39 00:03:34,930 --> 00:03:41,950 Ahora podemos simular esto en el creador de la acción yendo allí y para iniciar sesión, digamos que eliminamos esa D 40 00:03:42,370 --> 00:03:49,350 aquí, de modo que al final sea una URL incorrecta. Si ahora intentamos iniciar sesión aquí, me 41 00:03:52,500 --> 00:03:54,790 sale este error. 42 00:03:54,810 --> 00:03:55,340 Ahora 43 00:03:55,350 --> 00:04:01,920 eso es bueno, pero también hay otro tipo de errores que quiero manejar, por ejemplo, ¿qué sucede si inicio 44 00:04:01,920 --> 00:04:08,930 sesión con una dirección de correo electrónico que no existe? Por supuesto, también quiero mostrar un error al usuario 45 00:04:08,930 --> 00:04:15,670 y lo hago, pero solo muestro que algo salió mal, que no es exactamente el error que me gustaría mostrar. 46 00:04:15,700 --> 00:04:21,850 Ahora estoy mostrando este error porque en el creador de la acción aquí, si la respuesta no está bien, arrojo algo que 47 00:04:21,850 --> 00:04:22,690 salió mal. 48 00:04:22,690 --> 00:04:27,910 Ahora el problema es cuando enviamos un correo electrónico incorrecto o una contraseña incorrecta, también por el 49 00:04:27,910 --> 00:04:35,410 camino para registrarse si enviamos algo que no es un correo electrónico o una contraseña que es demasiado corta, si eso sucede, entonces lo 50 00:04:35,410 --> 00:04:42,890 haremos recibimos una respuesta con un código de estado de 400 algo y obtenemos algunos detalles de error como parte de la respuesta y 51 00:04:42,890 --> 00:04:43,750 en este 52 00:04:43,760 --> 00:04:46,490 momento con nuestro manejo de errores, no los vemos, 53 00:04:46,740 --> 00:04:50,590 por lo que debemos cambiar esto. En lugar de arrojar inmediatamente un 54 00:04:50,600 --> 00:04:53,730 error aquí si la respuesta no está bien, todavía quiero investigarlo. 55 00:04:53,870 --> 00:04:57,980 Entonces tendré mis datos de respuesta de 56 00:04:57,980 --> 00:05:06,230 error que obtengo esperando la respuesta JSON aquí. Así que hago lo mismo que en el caso de éxito, pero lo extraigo en un campo 57 00:05:06,250 --> 00:05:09,550 diferente y ahora aquí quiero consolar el registro de los datos de respuesta 58 00:05:09,580 --> 00:05:12,710 de error para que tengamos una idea de cómo se ve esto. 59 00:05:12,720 --> 00:05:20,680 Así que ahora intentemos ingresar una dirección de correo electrónico que no existe nuevamente y ahora tenemos nuestro extraño error que acabas de ver, pero ahora tenemos esta salida 60 00:05:20,680 --> 00:05:25,600 interesante aquí y ves que este es el objeto de error que Firebase me devolvió y, por supuesto, 61 00:05:25,600 --> 00:05:26,870 depende de la API 62 00:05:26,920 --> 00:05:30,130 con la que está hablando, qué tipo de error está recibiendo 63 00:05:30,130 --> 00:05:35,560 y cuándo lo está obteniendo y qué detalles incluye. Esto, como puede ver, es un objeto 64 00:05:35,560 --> 00:05:43,060 que tiene una clave de error que es otro objeto que tiene un código de error, algunos detalles sobre los errores 65 00:05:43,060 --> 00:05:48,490 y luego este mensaje que es, por ejemplo, correo electrónico no encontrado y esa es 66 00:05:48,490 --> 00:05:53,060 la parte que me interesa. Por cierto, en los documentos oficiales, encontrará más identificadores de 67 00:05:53,080 --> 00:05:55,860 error potenciales que podría estar obteniendo. Entonces, al 68 00:05:55,890 --> 00:06:04,800 final, eso es lo que quiero verificar ahora. Quiero obtener mi ID de error, digamos de los datos de respuesta de error 69 00:06:04,800 --> 00:06:11,160 accediendo al campo de error allí, que es este campo que me da acceso a este objeto que luego tiene 70 00:06:11,160 --> 00:06:12,580 este campo de mensaje. 71 00:06:12,720 --> 00:06:19,470 Por lo tanto, aquí, luego accedo al mensaje para obtener este mensaje y ahora podemos verificar esto, podemos verificar si la 72 00:06:20,040 --> 00:06:27,260 identificación del error es igual al correo electrónico no encontrado. Si ese es el caso, quiero configurar mi propio mensaje 73 00:06:27,270 --> 00:06:33,090 personalizado, así que aquí agregaré un mensaje variable que es algo que salió mal de manera predeterminada, pero 74 00:06:33,300 --> 00:06:38,580 luego, si sabemos que el problema es que no encontramos un correo electrónico dirección, podríamos 75 00:06:38,610 --> 00:06:44,550 decir que no se pudo encontrar este correo electrónico y agregaré más si los cheques en un segundo. 76 00:06:44,550 --> 00:06:49,650 Esto es algo que quiero verificar aquí y al final, por lo tanto, tengo un mensaje que ahora quiero lanzar, 77 00:06:49,650 --> 00:06:50,100 así 78 00:06:50,130 --> 00:06:55,860 que ahora arrojaré un nuevo error con mi propio mensaje personalizado. Entonces, otra comprobación que 79 00:06:55,860 --> 00:07:03,890 quiero agregar con una declaración else / if aquí es si la identificación del error 80 00:07:03,890 --> 00:07:15,050 es para iniciar sesión en una contraseña no válida, digamos. Entonces puedo verificar eso y configurar el mensaje igual a esta contraseña no es válida y ahora vamos 81 00:07:15,050 --> 00:07:16,480 a intentarlo de nuevo. 82 00:07:16,580 --> 00:07:23,240 Regresemos e ingresemos una dirección de correo electrónico que no existe, inicio de sesión rápido y obtenemos que esta dirección de correo electrónico no se 83 00:07:23,250 --> 00:07:26,210 pudo encontrar o este correo electrónico no se pudo encontrar. 84 00:07:26,430 --> 00:07:35,030 Ahora intentemos una dirección de correo electrónico válida, pero en realidad una contraseña que no es válida, como esta, y obtenemos que esta contraseña no 85 00:07:35,030 --> 00:07:36,550 es válida, así que 86 00:07:36,590 --> 00:07:39,370 ahora le damos al usuario una mejor respuesta. 87 00:07:39,410 --> 00:07:46,880 Ahora implementemos lo mismo para registrarme, así que copiaré eso e iré a mi caso de registro aquí y allá. Solo tengo 88 00:07:46,880 --> 00:07:49,310 diferentes códigos de error, allí tengo códigos 89 00:07:49,310 --> 00:07:52,130 como el correo electrónico existe, si esa dirección 90 00:07:52,130 --> 00:07:54,270 de correo electrónico ya existe. 91 00:07:54,560 --> 00:08:02,370 Entonces extraigo mi ID de error de la misma manera, pero luego verifico si existe un correo electrónico y si este es el error, digo que este 92 00:08:03,300 --> 00:08:04,740 correo electrónico ya existe. 93 00:08:08,000 --> 00:08:09,710 Ahora bien, esto es lo 94 00:08:09,710 --> 00:08:15,830 único que quiero comprobar aquí, también hay otros errores que podría obtener y, por ejemplo, simplemente puede desactivar su validación aquí 95 00:08:15,830 --> 00:08:20,860 y ver qué error obtiene si envía un correo electrónico no válido. ingrese la dirección de correo 96 00:08:20,870 --> 00:08:22,950 registrando ese ID de error y luego 97 00:08:22,960 --> 00:08:28,850 puede verificarlo también, aquí solo implementaré este mensaje y, por lo tanto, ahora si intento registrarme aquí con una dirección de 98 00:08:28,850 --> 00:08:37,070 correo electrónico que ya utilicé, de esta manera, obtengo Este correo electrónico ya existe. Por otro lado, si uso una dirección de correo 99 00:08:37,100 --> 00:08:44,250 electrónico válida, por supuesto, esto solo pasa por Firebase y, de hecho, si va a la autenticación 100 00:08:44,250 --> 00:08:47,530 y actualiza esto, verá ese segundo usuario. 101 00:08:47,580 --> 00:08:52,040 Así es como puede agregar una flecha de carga y manejo de errores con autenticación. 102 00:08:52,080 --> 00:08:57,420 Eso está bien, pero ahora finalmente sería bueno dejar también esa pantalla e ir a nuestra aplicación y luego comenzar 103 00:08:57,420 --> 00:08:59,670 a trabajar con ese token que estamos obteniendo.