La Seguridad se Encuentra con la Usabilidad: Creando Soluciones de Control de Acceso Dinámicas y Granulares

This ad is not shown to multipass and full ticket holders
React Summit US
React Summit US 2025
November 18 - 21, 2025
New York, US & Online
The biggest React conference in the US
Learn More
In partnership with Focus Reactive
Upcoming event
React Summit US 2025
React Summit US 2025
November 18 - 21, 2025. New York, US & Online
Learn more
Bookmark
Rate this content

A medida que las aplicaciones aumentan en complejidad, gestionar los permisos de usuario se convierte en un desafío creciente. Sin un enfoque estructurado, los permisos rápidamente se convierten en un enredo de declaraciones if-else, lo que lleva a una pobre mantenibilidad y escalabilidad. Aunque el Control de Acceso Basado en Roles (RBAC) proporciona un buen punto de partida para gestionar el acceso de usuarios, puede que no ofrezca el nivel de granularidad necesario a medida que tu aplicación evoluciona. Para obtener un control más fino sobre quién puede realizar qué acciones, en qué objetos y bajo qué condiciones, el modelo de Control de Acceso Basado en Atributos (ABAC), recomendado por OWASP, se vuelve invaluable.


En esta sesión, exploraremos dos enfoques prácticos para construir un sistema de permisos escalable en React. Primero, presentaré CASL, una biblioteca ABAC popular que simplifica el control de acceso detallado. Luego, te guiaré a través de la creación de un sistema de permisos personalizado desde cero, ofreciendo una visión sobre cómo diseñar una solución que se ajuste a las necesidades de tu aplicación.


A lo largo de la sesión, realizaré recorridos detallados de código para ambos enfoques, cubriendo conceptos clave como la gestión de estado optimizada, hooks personalizados y consultas de caché/condicionales usando Redux Toolkit. Aprenderás cómo implementar estas estrategias para crear un marco de permisos limpio, eficiente y mantenible.


Al final de la sesión, tendrás una comprensión sólida de cómo implementar sistemas de permisos escalables en React, ya sea que elijas una solución preconstruida como CASL o construyas la tuya propia.

This talk has been presented at React Summit 2025, check out the latest edition of this React Conference.

Samhitha Rama Prasad
Samhitha Rama Prasad
21 min
17 Jun, 2025

Comments

Sign in or register to post your comment.
Video Summary and Transcription
Samhita enfatiza la importancia del control de acceso en aplicaciones web y el cambio hacia el control de acceso basado en atributos para mejorar la seguridad. El control de acceso basado en atributos considera los atributos del usuario, los atributos del recurso y los factores ambientales para otorgar acceso. Los desafíos de implementación incluyen la necesidad de aplicar tanto en el front-end como en el back-end para prevenir eludir el sistema. La definición de permisos en CASL implica asignar habilidades basadas en roles de usuario utilizando palabras clave y operadores. La implementación de políticas implica definir políticas para la compatibilidad de la interfaz de usuario y el servidor, agrupar políticas por recurso y usar CEL para la evaluación de condiciones. La evaluación del control de acceso requiere manejar la lógica de negocio dinámica, aplicar permisos con componentes de CASL e implementar rutas protegidas basadas en los permisos del usuario.

1. Introducción al Control de Acceso

Short description:

Samhita, una ingeniera full-stack en BlackRock, discute la importancia del control de acceso en aplicaciones web y el cambio hacia el control de acceso basado en atributos para mejorar la seguridad.

Hola a todos. Soy Samhita. Soy una ingeniera full-stack en BlackRock. Y aquí hay algo sobre mí. Ahora, si estuviéramos haciendo esta sesión en persona, habríamos jugado un rápido juego para romper el hielo. Habría presumido de mis habilidades para hacer press de banca y les habría mostrado muchos memes. Pero desafortunadamente, no pude unirme a ustedes en Ámsterdam este año. Así que tendremos que omitir todo esto y sumergirnos de lleno. Comencemos.

Imagina que estás construyendo control de acceso en tu aplicación web. Entonces, la primera pregunta que probablemente te harías es, ¿qué estrategias debería usar para asegurarme de que los datos sensibles sean accedidos solo por aquellos que realmente lo necesitan? Entonces podrías empezar a pensar. ¿Debería implementarlo a nivel de componente o en la capa de API? ¿O es seguro que el back end lo maneje todo? Entonces podrías considerar otra capa de complejidad. ¿Cómo integro todos estos permisos con verificaciones de lógica de negocio y banderas de características para que ciertas características estén disponibles solo para usuarios específicos?

Para ahora, espero que entiendas que el control de acceso no es una sola decisión y tendrías que pensar en múltiples capas en tu arquitectura para hacerlo bien. Así que, en la sesión de hoy, repasaremos todo esto y exploraremos dos formas de implementar control de acceso que sea granular, dinámico y escalable. ¿Por qué deberías preocuparte por esto? OASP ha listado el control de acceso roto como el riesgo de seguridad número uno en aplicaciones web. También recomiendan el control de acceso basado en atributos sobre el tradicional control de acceso basado en roles que otorga acceso a los usuarios solo basado en los roles del usuario.

2. Implementation of Attribute-Based Access Control

Short description:

El control de acceso basado en atributos garantiza una seguridad robusta al considerar atributos de usuario, atributos de recursos y factores ambientales al otorgar acceso. La aplicación en el front-end proporciona retroalimentación instantánea a los usuarios, pero debe complementarse con la aplicación en el back-end para evitar eludirla. Implementar el control de acceso solo en el front-end plantea desafíos de escalabilidad y requiere consistencia de políticas a través de capas, lo que requiere un enfoque centralizado en el back-end para definir permisos.

¿Por qué? Porque el control de acceso basado en atributos es más efectivo para implementar el principio de privilegio mínimo, y también maneja necesidades de acceso dinámicas. Veamos cómo. Considera a Sam, quien es una publicadora para una aplicación de blogs. Cuando se unió, se le asignaron categorías dentro de las cuales puede realizar acciones. La regla de control de acceso es que los publicadores pueden publicar publicaciones aprobadas en sus categorías asignadas pero solo durante el horario laboral. Cada vez que se crea una publicación de blog, se le asigna una categoría. Inicialmente no está revisada, pero eventualmente es aprobada por el editor. Ahora, si Sam quiere publicar esta publicación, el acceso se otorga no solo basado en su rol, que es el caso con el control de acceso basado en roles, sino también basado en sus atributos, los atributos del recurso, que es la publicación, y atributos ambientales como el tiempo y la ubicación. Estos tres, junto con las políticas de control de acceso en sí mismas, son los cuatro componentes principales que conforman ABAC. Si alguno de sus atributos cambia, como si se traslada al departamento de membresía o se le asigna a moda, su acceso se revoca automáticamente. Y debido a que todos estos atributos se incorporan en el proceso de toma de decisiones, la seguridad de tu aplicación es mucho más robusta.

¿Dónde deberías aplicarlo? Deberías aplicar el control de acceso en el front-end para que los usuarios tengan retroalimentación instantánea. Saben inmediatamente lo que pueden o no pueden hacer, y esto hace que la interfaz de usuario sea muy intuitiva. Este es un ejemplo crudo de cómo podría verse. Aparte del hecho de que es un FL-stangle y la solución no es escalable, el problema aquí es que el control de acceso en el front-end es solo la primera línea de defensa. Es como colgar un cartel de no entrar en tu puerta y no cerrarla con llave. Así que es muy crucial que también apliques el control de acceso en el back-end porque el control de acceso en el front-end puede ser fácilmente eludido con las herramientas adecuadas. Así que podrías replicar las mismas reglas en el back-end. Eso es mucha duplicación y es difícil asegurar la consistencia de políticas a través de ambas capas, por lo que aunque la aplicación de políticas necesita ocurrir tanto en el front-end como en el back-end, la definición de las reglas o tus permisos mismos necesitan estar en el back-end como una única fuente de verdad. Así que podrías descargar toda tu lógica de control de acceso al back-end y hacer que el front-end haga una llamada API al back-end y obtenga la decisión de control de acceso.

Esta solución es segura, pero introduce compensaciones en términos de usabilidad y rendimiento, especialmente en ABAC porque vimos cómo depende de factores dinámicos como usuario, recurso y atributos ambientales. Y cada vez que estos atributos cambian, tu interfaz de usuario necesita activar una llamada API al back-end para obtener la decisión de control de acceso actualizada, lo que causa latencia y una experiencia de usuario lenta. Y sin mencionar, si hay actualizaciones de políticas o adiciones de políticas, tu código necesita ser reescrito. Además, ¿cómo manejarías las banderas de características como usuarios premium o recursos exclusivos? ¿Y qué pasa cuando hay múltiples front-ends y múltiples servicios de back-end? ¿Cómo asegurarías la consistencia de la definición de políticas a través de estas capas? Y más importante, ¿cómo creas una solución escalable que satisfaga todos los criterios de diseño que discutimos hasta ahora? Como dije al principio, repasaremos dos soluciones. La primera es CASL. Es una biblioteca de JavaScript de código abierto que te permite definir permisos de manera declarativa como lo que el usuario puede o no puede hacer en lugar de preocuparse por cómo verificar los permisos. Considera estos ejemplos de nuestra aplicación de blogs. Un administrador puede gestionar todo. Un autor puede crear y editar sus propias publicaciones dentro de las categorías asignadas, pero no puede eliminar publicaciones publicadas. Estos se llaman habilidades en CASL.

3. Implementation of Permission Definition in CASL

Short description:

Define funciones para asignar habilidades basadas en roles de usuario. Usa palabras clave como manage y all en CASL para especificar permisos. Utiliza operadores como in para definir condiciones. Combina reglas con operadores lógicos para un sistema de permisos unificado.

Vamos a convertir esto en código. Comencemos definiendo una función llamada defineAbilityFor, que toma al usuario como entrada y devuelve las habilidades del usuario. Si el usuario es un admin, el usuario puede manage all. Manage y all son palabras clave en CASL donde manage significa cualquier acción y all significa cualquier sujeto. Si el usuario es un author, el usuario puede crear un post pero no puede eliminar un post. También puedes verificar el tipo de estas habilidades definiendo un tipo para las acciones y sujetos y creando un objeto de habilidad que se ajuste a los tipos definidos.

Nota aquí que createMongoAbility no significa que tu aplicación tenga que usar MongoDB. Solo significa que usaremos ciertos operadores del lenguaje de consulta de MongoDB. Uno de esos operadores es el operador in, que se usa para especificar condiciones en estas habilidades. Por ejemplo, el usuario puede crear un post en tech y lifestyle o el usuario puede actualizar solo los campos de título y descripción de sus propios posts que están en estado de borrador. Si el objeto de descripción está anidado, puedes usar un comodín para indicar que solo quieres otorgar acceso a los campos de nivel superior. Finalmente, puedes usar cannot para describir lo que el usuario no puede hacer, como eliminar posts publicados.

Detrás de escena en Kazzle, estas reglas can se combinan usando or lógico y reglas invertidas, como cannot y todas las condiciones se van a combinar usando and lógico, que son los cuadros rosados que ves. Bien, así que recuerda esto, tenemos la función definability for que devuelve todas las habilidades para el usuario. Debido a que la definición de permisos necesita ser una única fuente de verdad, esto va a ser una biblioteca compartida entre la UI y el servidor. Una vez que el usuario está autenticado, invocarías esta función definability for y obtendrías las habilidades del usuario. Para validar una acción en el lado del servidor, harías ability.can y pasarías la acción y el sujeto. La misma función ability.can se puede usar en el front-end para realizar verificaciones programáticas y devuelve un booleano true o false.

4. Considerations for Security Logic Control

Short description:

Crea un contexto para el acceso a habilidades en toda la aplicación. Comprende la distinción en las verificaciones de permisos. Considera las implicaciones de las bibliotecas de terceros para el control de la lógica de seguridad.

Mejor aún, crea un contexto y pasa la instancia de ability a la aplicación para que todos los componentes en la app tengan acceso a ella. Bazel también proporciona una opción para crear un componente contextual can, que es como un componente envoltorio alrededor de otros componentes que puedes usar para renderizado condicional.

¿Puedo eliminar un post? ¿Ves lo legible que es la verificación de permisos? Significa que estás preguntando si tienes el permiso para eliminar al menos un post. Pero por otro lado, si preguntas, ¿puedo eliminar este post?, significa que estás preguntando si tienes el permiso para eliminar esa instancia particular del post porque post aquí es el tipo del sujeto.

Puede ser un poco confuso, lo que me lleva a mi siguiente punto. ¿Deberías estar usando una biblioteca de terceros? Aunque ofrecen mucha conveniencia, hay algunas preocupaciones sobre su uso en aplicaciones empresariales especialmente para el control de acceso y especialmente en aplicaciones que manejan datos sensibles. Porque los documentos podrían ser poco claros, desactualizados o inexactos. Pero lo más importante, puede haber vulnerabilidades en la propia biblioteca.

5. Policy Implementation and Business Logic Handling

Short description:

Define políticas para la compatibilidad de UI y servidor. Utiliza policy as code con JSON o YAML. Agrupa políticas por recurso para una gestión eficiente. Usa CEL para una evaluación de condiciones rápida y segura. Gestiona detalles de usuario y políticas para una evaluación precisa junto con la lógica de negocio dinámica.

¿Cómo escribimos las políticas de manera que puedan ser utilizadas tanto por la UI como por el servidor? ¿O que puedan ser utilizadas por múltiples UIs y múltiples servidores? Otro punto, sé que la mayoría de ustedes pueden ser desarrolladores de JavaScript, pero ¿qué pasa si la pila tecnológica del backend no está basada en JavaScript en absoluto? Entonces, para resolver eso, utilizaremos policy as code, lo que significa que estás usando código o archivos de configuración como JSON o YAML para definir y gestionar las políticas. El beneficio de hacer esto es que las políticas estarán bajo control de versiones, y también es más fácil de escalar.

Así es como podría verse en YAML. Tenemos dos políticas aquí. Esta es la primera y la segunda. Y cada política tiene una condición.

Si la condición se evalúa como verdadera, significa que tu política está en efecto. El campo de efecto determina si la acción sobre el recurso dado está permitida o denegada. Y las condiciones en sí mismas se escribirán usando el lenguaje de expresión común de Google que supuestamente es muy rápido y seguro. Así que mejoremos la estructura de estas políticas.

6. Access Control Evaluation and Dynamic Handling

Short description:

Evalúa condiciones con evaluadores CEL. Usa el evaluador cell JS para el front-end. Almacena detalles del usuario para la evaluación y obtiene políticas condicionalmente. La lógica de negocio contextual restringe acciones dinámicamente. Encapsula la lógica de validación para su uso en múltiples componentes.

Y aun con el crecimiento de las políticas, el tiempo de búsqueda va a permanecer constante. Bien. Ahora que tenemos las políticas en su lugar, ¿cómo evaluamos las condiciones? Hay evaluadores CEL disponibles para diferentes lenguajes.

Pero para el front-end, usaremos el evaluador cell javascript, que toma la condición y todos los objetos correspondientes como usuario, recurso y entorno. Y va a producir un Booleano verdadero o falso. El validador reside dentro de la aplicación web y obtiene los atributos de recurso y entorno del componente que lo invoca. Este.

Bien. Recuerda, también necesitamos atributos de usuario y políticas. Una vez que el usuario está autenticado, los detalles del usuario como el rol y el departamento se van a almacenar en el estado global y serán leídos por el evaluador. Las políticas pueden ser obtenidas de un servicio de gestión de políticas.

7. Dynamic Business Logic Handling

Short description:

Evita solicitudes de red innecesarias. Almacena en caché políticas automáticamente. Maneja lógica de negocio dinámica. Encapsula la lógica de validación para reutilización. Usa el selector hook selectivamente.

Sabes, para evitar solicitudes de red innecesarias. Y si estás usando RTK o Tanstack Query para esto, las políticas se van a almacenar automáticamente en caché en el store. Vamos a leer desde el store para los propósitos de este ejemplo, pero por favor ten mucho cuidado al almacenar datos sensibles de usuario y políticas en el store.

Bien. Más a menudo de lo que piensas, incluso si tienes el permiso requerido para realizar una acción, aún puede que no se te permita hacerlo debido a la lógica de negocio contextual. Y esta lógica de negocio puede depender del estado de la aplicación y puede necesitar ser manejada dinámicamente.

Ejemplos serían prevenir la aprobación de una publicación si está siendo editada actualmente, deshabilitar el botón de comentario si no hay contenido escrito en el cuadro de comentarios, y prevenir la creación de una categoría de publicación si el nombre ya existe. Bien. Así que si una regla de acción contextual está presente, va a ser evaluada junto con el validador de políticas contextuales. Encapsula toda esta lógica de validación dentro de un hook de uso de permisos para que pueda ser usado por cualquier componente que necesite verificar permisos. Con el cambio de estado de la aplicación y los atributos cambiantes, el hook volvería a calcular la salida de validación y desencadenaría un re-renderizado en todos los componentes que lo usan. A un alto nivel, así es como se ve el código simplificado para eso. Aquí es donde estoy obteniendo las políticas condicionalmente después de que un ID de usuario válido está presente. Y luego aquí está la lógica de validación para la evaluación de cell JSC y la validación de acción contextual. Pero hay una cosa en este código que necesita ser reescrita. Ves cómo aquí estoy usando el hook de uso de selector para suscribirme a todo el estado de la aplicación. Lo que significa que cualquier cambio de estado va a desencadenar un re-renderizado en todos los componentes que usan el hook de uso de permisos.

8. Enforcement of Access Control Policies

Short description:

Hacer cumplir permisos con componentes inspirados en CASL. Implementar rutas protegidas basadas en permisos de usuario. Resumen: soluciones escalables para control de acceso dinámico basado en atributos.

Lo cual es por qué eso es una mala práctica y se supone que debes usar tu hook de use selector para suscribirte solo a lo necesario. Hazlo lo más granular posible.

Bien. Pasando a la última parte, vimos la definición de permisos usando la solución personalizada. Ahora veamos cómo hacer cumplir estos permisos. Puedes crear un componente wrapper can inspirado en CASL para ocultar o mostrar un componente en este caso. Para deshabilitar un componente y luego crear una ruta protegida. Si el usuario tiene permisos, mostrarías el outlet. Si no, navega a la página de inicio de sesión. Y finalmente, para omitir una llamada API si el usuario no tiene permisos.

Eso fue todo por hoy. Eso concluye nuestra sesión. Pero antes de dejarte ir, resumamos. Aprendimos dos formas de hacer cumplir un control de acceso basado en atributos de grano fino. La primera usando CASL y la segunda usando una solución personalizada. Ambas soluciones son escalables en el sentido de que agregar una nueva política significa actualizar un solo archivo sin reescrituras de código. Son dinámicas porque funcionan sin problemas con el estado cambiante de la aplicación. Son legibles como, ¿puedo leer una publicación? ¿Puedo eliminar una publicación? Y finalmente, son limpias porque hay una separación de preocupaciones. Espero que recuerdes todo de esta sesión. Pero porque fue mucho y si tuvieras que recordar solo una cosa, sería considerar usar el control de acceso basado en atributos recomendado por OWASP porque es más efectivo en implementar el principio de privilegio mínimo.

Check out more articles and videos

We constantly think of articles and videos that might spark Git people interest / skill us up or help building a stellar career

Es una jungla ahí fuera: ¿Qué está pasando realmente dentro de tu carpeta Node_Modules?
Node Congress 2022Node Congress 2022
26 min
Es una jungla ahí fuera: ¿Qué está pasando realmente dentro de tu carpeta Node_Modules?
Top Content
The talk discusses the importance of supply chain security in the open source ecosystem, highlighting the risks of relying on open source code without proper code review. It explores the trend of supply chain attacks and the need for a new approach to detect and block malicious dependencies. The talk also introduces Socket, a tool that assesses the security of packages and provides automation and analysis to protect against malware and supply chain attacks. It emphasizes the need to prioritize security in software development and offers insights into potential solutions such as realms and Deno's command line flags.
El estado de la autenticación sin contraseña en la web
JSNation 2023JSNation 2023
30 min
El estado de la autenticación sin contraseña en la web
Passwords are terrible and easily hacked, with most people not using password managers. The credential management API and autocomplete attribute can improve user experience and security. Two-factor authentication enhances security but regresses user experience. Passkeys offer a seamless and secure login experience, but browser support may be limited. Recommendations include detecting Passkey support and offering fallbacks to passwords and two-factor authentication.
5 Formas en las que Podrías Haber Hackeado Node.js
JSNation 2023JSNation 2023
22 min
5 Formas en las que Podrías Haber Hackeado Node.js
Top Content
The Node.js security team is responsible for addressing vulnerabilities and receives reports through HackerOne. The Talk discusses various hacking techniques, including DLL injections and DNS rebinding attacks. It also highlights Node.js security vulnerabilities such as HTTP request smuggling and certification validation. The importance of using HTTP proxy tunneling and the experimental permission model in Node.js 20 is emphasized. NearForm, a company specializing in Node.js, offers services for scaling and improving security.
Política de Seguridad de Contenido con Next.js: Mejorando la Seguridad de tu Sitio Web
React Summit US 2023React Summit US 2023
9 min
Política de Seguridad de Contenido con Next.js: Mejorando la Seguridad de tu Sitio Web
Top Content
Lucas Estevão, a Principal UI Engineer and Technical Manager at Avenue Code, discusses how to implement Content Security Policy (CSP) with Next.js to enhance website security. He explains that CSP is a security layer that protects against cross-site scripting and data injection attacks by restricting browser functionality. The talk covers adding CSP to an XJS application using meta tags or headers, and demonstrates the use of the 'nonce' attribute for allowing inline scripts securely. Estevão also highlights the importance of using content security reports to identify and improve application security.
Cómo se hackean las aplicaciones React en el mundo real
React Summit 2022React Summit 2022
7 min
Cómo se hackean las aplicaciones React en el mundo real
Top Content
How to hack a RealWorld live React application in seven minutes. Tips, best practices, and pitfalls when writing React code. XSS and cross-site scripting in React. React's secure by default, but not always. The first thing to discover: adding a link to a React application. React code vulnerability: cross-site scripting with Twitter link. React doesn't sanitize or output H ref attributes. Fix attempts: detect JavaScript, use dummy hashtag, transition to lowercase. Control corrector exploit. Best practices: avoid denialist approach, sanitize user inputs. React's lack of sanitization and output encoding for user inputs. Exploring XSS vulnerabilities and the need to pretty print JSON. The React JSON pretty package and its potential XSS risks. The importance of context encoding and secure coding practices.
Permíteme mostrarte cómo las aplicaciones de React son hackeadas en el mundo real
React Advanced 2021React Advanced 2021
22 min
Permíteme mostrarte cómo las aplicaciones de React son hackeadas en el mundo real
Top Content
React's default security against XSS vulnerabilities, exploring and fixing XSS vulnerabilities in React, exploring control characters and security issues, exploring an alternative solution for JSON parsing, and exploring JSON input and third-party dependencies.

Workshops on related topic

Masterclass Práctica: Introducción a Pentesting para Aplicaciones Web / APIs Web
JSNation US 2024JSNation US 2024
148 min
Masterclass Práctica: Introducción a Pentesting para Aplicaciones Web / APIs Web
Featured Workshop
Gregor Biswanger
Gregor Biswanger
En esta masterclass práctica, estarás equipado con las herramientas para probar efectivamente la seguridad de las aplicaciones web. Este curso está diseñado tanto para principiantes como para aquellos que ya están familiarizados con las pruebas de seguridad de aplicaciones web y desean ampliar su conocimiento. En un mundo donde los sitios web juegan un papel cada vez más central, asegurar la seguridad de estas tecnologías es crucial. Comprender la perspectiva del atacante y conocer los mecanismos de defensa apropiados se han convertido en habilidades esenciales para los profesionales de TI.Esta masterclass, dirigida por el renombrado entrenador Gregor Biswanger, te guiará a través del uso de herramientas de pentesting estándar de la industria como Burp Suite, OWASP ZAP y el marco profesional de pentesting Metasploit. Aprenderás a identificar y explotar vulnerabilidades comunes en aplicaciones web. A través de ejercicios prácticos y desafíos, podrás poner en práctica tu conocimiento teórico y expandirlo. En este curso, adquirirás las habilidades fundamentales necesarias para proteger tus sitios web de ataques y mejorar la seguridad de tus sistemas.
De 0 a Autenticación en una hora con ReactJS
React Summit 2023React Summit 2023
56 min
De 0 a Autenticación en una hora con ReactJS
WorkshopFree
Kevin Gao
Kevin Gao
La autenticación sin contraseña puede parecer compleja, pero es simple de agregar a cualquier aplicación utilizando la herramienta adecuada. Hay múltiples alternativas que son mucho mejores que las contraseñas para identificar y autenticar a tus usuarios, incluyendo SSO, SAML, OAuth, Magic Links, One-Time Passwords y Authenticator Apps.
Mientras abordamos los aspectos de seguridad y evitamos errores comunes, mejoraremos una aplicación JS de pila completa (backend Node.js + frontend React) para autenticar a los usuarios con OAuth (inicio de sesión social) y One Time Passwords (correo electrónico), incluyendo:- Autenticación de usuarios - Gestión de interacciones de usuarios, devolviendo JWTs de sesión / actualización- Gestión y validación de sesiones - Almacenamiento seguro de la sesión para solicitudes de cliente posteriores, validación / actualización de sesiones- Autorización básica - extracción y validación de reclamaciones del token JWT de sesión y manejo de autorización en flujos del backend
Al final del masterclass, también exploraremos otros enfoques de implementación de autenticación con Descope, utilizando SDKs de frontend o backend.
Principales Diez Vulnerabilidades de Seguridad OWASP en Node.js
JSNation 2024JSNation 2024
97 min
Principales Diez Vulnerabilidades de Seguridad OWASP en Node.js
Workshop
Marco Ippolito
Marco Ippolito
En este masterclass, cubriremos las diez vulnerabilidades más comunes y riesgos de seguridad críticos identificados por OWASP, que es una autoridad confiable en Seguridad de Aplicaciones Web.Durante el masterclass, aprenderás cómo prevenir estas vulnerabilidades y desarrollar la capacidad de reconocerlas en aplicaciones web.El masterclass incluye 10 desafíos de código que representan cada una de las vulnerabilidades más comunes de OWASP. Se proporcionarán pistas para ayudar a resolver las vulnerabilidades y pasar las pruebas.El instructor también proporcionará explicaciones detalladas, diapositivas y ejemplos de la vida real en Node.js para ayudar a comprender mejor los problemas. Además, obtendrás información de un Mantenedor de Node.js que compartirá cómo gestionan la seguridad en un proyecto grande.Es adecuado para desarrolladores de Node.js de todos los niveles de habilidad, desde principiantes hasta expertos, se requiere un conocimiento general de aplicaciones web y JavaScript.
Tabla de contenidos:- Control de Acceso Roto- Fallas Criptográficas- Inyección- Diseño Inseguro- Configuración de Seguridad Incorrecta- Componentes Vulnerables y Obsoletos- Fallas de Identificación y Autenticación- Fallas de Integridad de Software y Datos- Fallas de Registro y Monitoreo de Seguridad- Falsificación de Solicitudes del Lado del Servidor
Cómo Construir Control de Acceso Front-End con NFTs
JSNation 2024JSNation 2024
88 min
Cómo Construir Control de Acceso Front-End con NFTs
WorkshopFree
Solange Gueiros
Solange Gueiros
Comprende los fundamentos de la tecnología NFT y su aplicación en el fortalecimiento de la seguridad web. A través de demostraciones prácticas y ejercicios prácticos, los asistentes aprenderán cómo integrar sin problemas mecanismos de control de acceso basados en NFT en sus proyectos de desarrollo front-end.
Encontrar, Hackear y solucionar las vulnerabilidades de NodeJS con Snyk
JSNation 2022JSNation 2022
99 min
Encontrar, Hackear y solucionar las vulnerabilidades de NodeJS con Snyk
Workshop
Matthew Salmon
Matthew Salmon
npm y seguridad, ¿cuánto sabes sobre tus dependencias?Hack-along, hacking en vivo de una aplicación Node vulnerable https://github.com/snyk-labs/nodejs-goof, Vulnerabilidades tanto de código abierto como de código escrito. Se anima a descargar la aplicación y hackear junto con nosotros.Corrigiendo los problemas y una introducción a Snyk con una demostración.Preguntas abiertas.
Aporta Calidad y Seguridad al pipeline de CI/CD
DevOps.js Conf 2022DevOps.js Conf 2022
76 min
Aporta Calidad y Seguridad al pipeline de CI/CD
Workshop
Elena Vilchik
Elena Vilchik
En esta masterclass repasaremos todos los aspectos y etapas al integrar tu proyecto en el ecosistema de Calidad y Seguridad del Código. Tomaremos una aplicación web simple como punto de partida y crearemos un pipeline de CI que active el monitoreo de calidad del código. Realizaremos un ciclo completo de desarrollo, comenzando desde la codificación en el IDE y abriendo una Pull Request, y te mostraré cómo puedes controlar la calidad en esas etapas. Al final de la masterclass, estarás listo para habilitar esta integración en tus propios proyectos.