Cómo funcionan los JSON Web Tokens
Clase 59 de 80 • Curso de Angular 4
Contenido del curso
Introducción a Angular 4
Setup del Ambiente de Trabajo
Conceptos Básicos
- 9

Para qué nos sirven los Módulos y Componentes
08:10 min - 10

Tipos de Data Binding y String Interpolation
05:05 min - 11

Property Binding
06:04 min - 12

Event Binding
03:04 min - 13

ngModel y two way binding en Angular
05:12 min - 14

Directivas en Angular 4 y ngFor
07:39 min - 15

Cómo usar ngIf en Angular 4.0
03:04 min - 16

Instalando librerías con NPM (Google Maps)
06:48 min
Directivas
Angular UI
Ruteo
- 24

Qué hace el router en Angular 4
03:11 min - 25

Implementación de Rutas en el Proyecto
07:36 min - 26

Href vs router link: navegación angular
02:27 min - 27

Resaltando el link activo con CSS para indicar visualmente en que componente nos encontramos
01:53 min - 28

Parámetros de ruta con routerLink en Angular
06:01 min - 29

Parámetros tipo Query
03:53 min - 30

Creando una vista de detalle para el proyecto
09:06 min - 31

Página de contacto Angular desde cero
07:45 min
Servicios
- 32

Servicios en Angular para compartir datos
00:58 min - 33

Creando nuestro propio servicio
07:11 min - 34

Configurando Firebase en nuestro proyecto
05:12 min - 35

Guardando Records en Firebase
12:20 min - 36

Obteniendo records desde Firebase
08:40 min - 37

Obteniendo coordenadas usando Geocoding
13:45 min - 38

Reto: Crear una vista para editar records
09:29 min - 39

Mostrando marcadores en el Mapa de Google
03:02 min
Conexión Remota (Http y Sockets)
Pipes
Animaciones en Angular
Testing en Angular
Autenticación y Protección de Rutas
- 59

Cómo funcionan los JSON Web Tokens
Viendo ahora - 60

Preparación de vistas para login y registro
11:58 min - 61

Registrando usuarios
07:29 min - 62

Loggeando usuarios
07:18 min - 63

Guardias canActivate en Angular: Proteger rutas con autenticación
11:09 min - 64

Cómo integrar Facebook login con Firebase
09:08 min - 65

Logout en Angular con Firebase
05:28 min
RxJS
- 66

Cómo funciona RxJS con metáfora de oficina
02:09 min - 67

Mostrar email del usuario logueado en Angular
06:32 min - 68

Uso de los Observables
04:30 min - 69

Cómo implementar type ahead con Observables y RxJS
10:43 min - 70

Implementar formularios reactivos con type ahead
07:58 min - 71

Cómo rellenar campos automáticamente con Google
01:28 min
Publicando nuestro proyecto
Fin del curso
Sesiones en vivo
Contenido Bonus
La seguridad no es opcional: es la base para ganar confianza y proteger datos y sistemas. Aquí se aclara cómo implementar autenticación con JSON Web Tokens (JWT) y protección de rutas en un proyecto con Angular y Firebase, evitando accesos no autorizados y riesgos como la inyección de SQL o de JavaScript.
¿Por qué la seguridad es crítica en aplicaciones web?
La seguridad garantiza la confidencialidad, integridad y disponibilidad de la información. El objetivo es que los usuarios confíen en que sus datos no serán expuestos, alterados ni eliminados, y que el sistema no será comprometido por ataques comunes.
¿Qué riesgos comunes enfrenta tu aplicación?
- Inyección de SQL que compromete la base de datos.
- Inyección de JavaScript que afecta clientes y servidores.
- Accesos no autorizados por rutas no protegidas.
- Pérdida de datos por falta de controles.
¿Qué habilidades desarrollarás en este módulo?
- Implementar autenticación con JSON Web Tokens.
- Diseñar protección de rutas para impedir accesos directos.
- Preparar vistas de login y registro.
- Crear un servicio de autenticación para centralizar la lógica.
¿Qué son los JSON Web Tokens y por qué usarlos?
Los JSON Web Tokens son un estándar para transferir información de forma segura entre dos partes. Funcionan como una cadena de texto compacta que encapsula datos necesarios para autenticar sin mecanismos externos complejos.
- Son transferibles: el mismo token puede usarse en distintos dispositivos, aunque no es lo óptimo.
- El servidor es stateless: no guarda estado de sesión, a diferencia de login con database o backend tradicionales.
- Son self contained: no dependen de servicios externos para validar la sesión.
- Pueden firmarse con llave secreta o con par de llaves pública/privada.
¿Cómo funcionan en Angular y Firebase?
Por la naturaleza del proyecto (de Angular a Firebase), se usarán JWT para autenticar peticiones. Esto permite comunicaciones seguras y una integración directa entre cliente y servicios remotos sin mantener estado en el servidor.
¿Qué implica que sean transferibles y stateless?
- El token puede moverse entre dispositivos y el servidor lo validará.
- No existe una sesión almacenada en el servidor: toda la verificación se hace con el token.
- Esta propiedad requiere control riguroso de expiración y protección de rutas en el cliente.
¿Cómo evitar accesos no autorizados con protección de rutas?
No basta con tener un login y un registro: si las rutas quedan abiertas, cualquiera podría acceder escribiendo una URL como “detalle/1”. La solución es implementar protección de rutas que verifique el JWT antes de permitir el acceso.
¿Qué pasos prácticos se preparan a continuación?
- Configurar la autenticación con JWT.
- Crear vistas de login y registro.
- Implementar el primer enfoque de un servicio de autenticación para centralizar validaciones.
¿Tienes preguntas sobre JWT, protección de rutas o la configuración con Angular y Firebase? Comparte tus dudas y experiencias en los comentarios.