Cómo mejorar la seguridad de su aplicación web utilizando Mozilla Observatory

Rate this content
Bookmark

En el panorama digital de hoy, la seguridad de las aplicaciones web es de suma importancia para proteger los datos sensibles de los usuarios y mantener la confianza de estos. Mozilla Observatory es una herramienta poderosa que puede ayudar a los desarrolladores a evaluar la postura de seguridad de sus aplicaciones web. En esta charla aprenderemos cómo mejorar la seguridad de las aplicaciones web utilizando Mozilla Observatory.

Karan Kiri
Karan Kiri
9 min
12 Dec, 2023

Video Summary and Transcription

La charla discute cómo mejorar la seguridad de las aplicaciones web utilizando Mozilla Observatory. Cubre temas como la evaluación de los encabezados de seguridad, el mantenimiento del historial de calificaciones y la implementación de políticas de seguridad de contenido. Se enfatiza la importancia de asegurar las cookies y habilitar la redirección de HTTP a HTTPS. También se destacan el uso de encabezados de referencia para controlar el comportamiento del navegador y la integridad de los sub-recursos para evitar la comprometición de archivos.

Available in English

1. Introducción a Mozilla Observatory

Short description:

Bienvenidos a React Day Berlin. Hoy hablaré sobre cómo mejorar la seguridad de las aplicaciones web utilizando Mozilla Observatory. Evalúa los encabezados de seguridad y el ranking. Vamos a Mozilla Observatory y veamos cómo se ve. Puedes omitir la publicación de resultados y forzar un nuevo escaneo. Da la puntuación Dplus y evalúa los encabezados de seguridad. Mantiene el historial de calificaciones. La política de seguridad de contenido permite un control detallado sobre los recursos cargados. Previene las vulnerabilidades de scripting entre sitios. Ten cuidado al implementarlo en sitios web existentes. Comienza con la política de seguridad de contenido solo para informes. Las cookies también son importantes.

Hola a todos. Bienvenidos a React Day Berlin. Mi nombre es Karan. Soy un desarrollador front-end en Fabric, que es una startup de e-commerce con sede en EE. UU. Hoy hablaré sobre cómo mejorar la security de tu aplicación web utilizando Mozilla Observatory. Mozilla Observatory es una herramienta que puedes usar para evaluar los encabezados de security de tu aplicación web y evaluar el ranking de security de tus sitios web. Aquí puedes ver todos los encabezados de security que Mozilla Observatory mide para tu aplicación y da la puntuación. Así que vamos a Mozilla Observatory y veamos cómo se ve. Este es el sitio aquí, hay tres opciones aquí. Puedes ver, puedes elegir omitir la publicación de tus resultados en los registros públicos de Mozilla. Mozilla en realidad guarda en caché tus resultados escaneados. Así que si quieres forzar un nuevo escaneo, puedes marcar esta casilla. Y si no quieres ejecutar ningún escáner de terceros puedes seleccionar este. Vamos a ingresar mi dominio y ver qué resultado nos da. Aquí puedes ver que ejecutará el Observatorio HTTP y me da la puntuación Dplus. Y aquí están todos los encabezados de security que ha evaluado. Y puedes ver el estado de aprobación y fallo y la puntuación de cada uno de los encabezados de security. Y la razón detrás de una puntuación particular también se muestra aquí. También mantiene el historial de calificaciones. Así que cada vez que hagas cualquier mejora en tu sitio web y vuelvas a escanear la puntuación, entonces podrás ver la puntuación mejorada de tu sitio web. Vamos a profundizar en cada uno de los encabezados de security y aprender más sobre cada uno de los encabezados de security. La política de security de contenido es un tema muy amplio. Así que solo hablaremos brevemente sobre ello. Básicamente, la política de security de contenido permite un control detallado sobre qué recursos de tu sitio se pueden cargar. Es la mejor manera de prevenir cualquier vulnerabilidad de scripting entre sitios, comúnmente conocida como ataques de acceso. El beneficio principal de CSP es que puedes deshabilitar el uso de JavaScript en línea inseguro, pero también tiene sus contras. Necesitas tener mucho cuidado al implementarlo en los sitios web existentes ya que puede romper las funcionalidades existentes. La mejor manera de implementar CSP es comenzar con la política de security de contenido solo para informes, que es un encabezado donde solo se informará de tus violaciones, pero no bloqueará ninguna ejecución de JavaScript. De esa manera puedes recopilar la información de todas las violaciones, solucionar eso primero, y realmente implementar la política de security de contenido.

2. Asegurando Cookies y Redirección

Short description:

Debe estar asegurado utilizando la bandera segura y enviado solo a través de HTTPS. Defina un período de vencimiento mínimo para las cookies del identificador de sesión. Configure correctamente el servidor para solicitudes de origen cercano. Habilite la redirección de HTTP a HTTPS.

Cookies, debes haber oído hablar de ellas. Deberían estar aseguradas usando la bandera segura, por lo que deberían enviarse solo a través de HTTPS. Necesita ser cookies HTTP solamente. Eso no requiere ningún acceso de JavaScript, por lo que puede ser bloqueado para el acceso por cualquier JavaScript de terceros también.

También necesitas definir el período de vencimiento. Debería ser lo más mínimo posible. En particular, el identificador de sesión que almacenamos en las cookies debería expirar muy rápidamente cuando ya no sean necesarios. También podemos usar el mismo conjunto de cookies para bloquear las cookies de ser enviadas a cualquier solicitud de origen cercano. Si eres un desarrollador front-end, debes haber encontrado errores de curso, por lo que es muy importante configurar tu servidor correctamente para cualquier solicitud de origen cercano. No debería permitir ningún otro dominio que no necesite esos recursos particulares, por lo que debería estar configurado correctamente. Tampoco debería permitir el acceso a ningún patrón comodín patterns.

HSTCS, comúnmente conocido como security de transporte estricto HTTP le dice al navegador que cargue los recursos solo a través de HTTPS, y la redirección también es muy importante. Necesitas habilitar la redirección de HTTP a HTTPS en tu aplicación web.

3. Encabezados de Referencia e Integridad de Sub-recursos

Short description:

Siempre que visite un recurso desde su aplicación, el navegador envía el referente al servidor web. Para controlar esto, utilice los encabezados de referencia. Hay diferentes directivas disponibles, como no-referente, mismo origen y origen estricto. La integridad de los sub-recursos evita que los atacantes alteren las bibliotecas de JavaScript alojadas en CDN. Al definir la integridad de su recurso utilizando el hash SHA, el navegador puede detectar modificaciones y prevenir la carga de archivos comprometidos.

Otro punto importante es la política de referencia, por lo que siempre que visite cualquier recurso desde su aplicación, el navegador enviará el referente al servidor web desde donde se originó la solicitud. Eso puede ser útil en algunos casos, pero también puede llevar a riesgos de privacidad. Para controlar eso, puedes usar los encabezados de referencia en tu aplicación. Hay algunas directivas que puedes usar. La primera es la directiva no-referente, que eliminará el referente de todas tus solicitudes enviadas a cualquier recurso. El mismo origen enviará la URL completa, pero solo para la solicitud del mismo origen. Y el origen estricto, lo que hará es que enviará el encabezado de origen, pero solo enviará la parte del host. Eliminará la parte real de la página desde donde solicitaste el recurso. Y el recomendado es el origen estricto cuando es de origen cruzado. Por lo tanto, enviará el referente completo en el mismo origen, pero una versión reducida del origen cuando estás haciendo una solicitud de origen cruzado.

Entonces, otro concepto importante es la integridad de los sub-recursos. Por lo tanto, evita que el atacante altere las bibliotecas de JavaScript alojadas en CDN que puedes estar utilizando en tu aplicación. Puedes estar utilizando jQuery desde CDN o cualquier biblioteca desde unpackage.com. Entonces, en cualquier caso, el CDN se ve comprometido y el contenido de ese archivo en particular cambia. Puede ejecutarse maliciosamente en tu aplicación y robar tus datos y realizar todo tipo de ataques en tus aplicaciones. Por lo tanto, para mitigar eso, necesitas definir la integridad de tu recurso. Así que siempre que estés utilizando cualquier etiqueta de script necesitas generar el hash SHA para ese recurso en particular. Así que siempre que el contenido de ese archivo en particular, digamos en el caso de este archivo code.jQuery.com slash este archivo jQuery min.js se modifica, entonces esta integridad no coincidirá con ese contenido modificado y el navegador omitirá la carga de este archivo en particular en el navegador. Entonces, el siguiente es xContentTypeOptions. Básicamente, le dice al navegador que no adivine el tipo de recurso. Y así, en algunos de los casos, lo que sucede es que cuando el tipo MIME no está definido en el recurso, el navegador lo entiende como un script y intenta ejecutarlo, y puede llevar a ataques de XSS. Por lo tanto, siempre es una buena práctica definir las xContentTypeOptions como no snip en tu aplicación web. Las últimas pero no menos importantes opciones son xFrameOptions y xXSSProtection. La política de seguridad de contenido realmente supera ambos de estos encabezados por lo que puede no ser útil en los navegadores más nuevos pero puede ser útil en los navegadores más antiguos. Así que xFrameOptions básicamente te permite restringir la carga de tu aplicación web en el iframe y xXSSProtection desactiva el uso de JavaScript en línea. Sí, eso fue todo. Gracias. Puedes conectarte a través de Twitter, LinkedIn y si quieres aprender más sobre seguridad, puedes visitar estos recursos de Mozilla. Gracias.

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

It's a Jungle Out There: What's Really Going on Inside Your Node_Modules Folder
Node Congress 2022Node Congress 2022
26 min
It's a Jungle Out There: What's Really Going on Inside Your Node_Modules Folder
Top Content
Do you know what’s really going on in your node_modules folder? Software supply chain attacks have exploded over the past 12 months and they’re only accelerating in 2022 and beyond. We’ll dive into examples of recent supply chain attacks and what concrete steps you can take to protect your team from this emerging threat.
You can check the slides for Feross' talk here.
The State of Passwordless Auth on the Web
JSNation 2023JSNation 2023
30 min
The State of Passwordless Auth on the Web
Can we get rid of passwords yet? They make for a poor user experience and users are notoriously bad with them. The advent of WebAuthn has brought a passwordless world closer, but where do we really stand?
In this talk we'll explore the current user experience of WebAuthn and the requirements a user has to fulfill for them to authenticate without a password. We'll also explore the fallbacks and safeguards we can use to make the password experience better and more secure. By the end of the session you'll have a vision for how authentication could look in the future and a blueprint for how to build the best auth experience today.
Let Me Show You How React Applications Get Hacked in the Real-World
React Advanced Conference 2021React Advanced Conference 2021
22 min
Let Me Show You How React Applications Get Hacked in the Real-World
Top Content
Modern frontend frameworks like React are well thought-of in their application security design and that’s great. However, there is still plenty of room for developers to make mistakes and use insecure APIs, vulnerable components, or generally do the wrong thing that turns user input into a Cross-site Scripting vulnerability (XSS). Let me show you how React applications get hacked in the real-world.
5 Ways You Could Have Hacked Node.js
JSNation 2023JSNation 2023
22 min
5 Ways You Could Have Hacked Node.js
All languages are or were vulnerable to some kind of threat. I’m part of the Node.js Security team and during the year 2022, we've performed many Security Releases and some of them were really hard to think about.
Did you know you can make money by finding critical vulnerabilities in Node.js? In this talk, I’ll show you 5 ways you can have hacked Node.js and how the Node.js team deals with vulnerabilities.
How React Applications Get Hacked in the Real-World
React Summit 2022React Summit 2022
7 min
How React Applications Get Hacked in the Real-World
React has a great security standard as default, but if you don’t pay close attention to the details you could get burned by some of the escape hatches APIs, or even by just passing props insecurely to components. I’ll teach you how to avoid these pitfalls.
Securing Node.js APIs with Decentralised Identity Tokens
JSNation Live 2021JSNation Live 2021
9 min
Securing Node.js APIs with Decentralised Identity Tokens
Authentication and Authorization are serious problems. We often dedicate a lot of time to craft powerful APIs but overlook proper security measures. Let's solve it with Magic using a key-based identity solution built on top of DID standard, where users’ identities are self-sovereign leveraging blockchain public-private key pairs. In this talk, we’ll look at proper ways to secure our Node.js APIs with Decentralised Identity Tokens. We’ll go from learning what Decentralised Identity standards are, how the users’ identities are self-sovereign leveraging blockchain public-private key pairs, why they’re the future of API security, and to put theory into practice we will build a real-world implementation using Node.js where I’ll show common best practices.

Workshops on related topic

0 to Auth in an hour with ReactJS
React Summit 2023React Summit 2023
56 min
0 to Auth in an hour with ReactJS
WorkshopFree
Kevin Gao
Kevin Gao
Passwordless authentication may seem complex, but it is simple to add it to any app using the right tool. There are multiple alternatives that are much better than passwords to identify and authenticate your users - including SSO, SAML, OAuth, Magic Links, One-Time Passwords, and Authenticator Apps.
While addressing security aspects and avoiding common pitfalls, we will enhance a full-stack JS application (Node.js backend + React frontend) to authenticate users with OAuth (social login) and One Time Passwords (email), including:- User authentication - Managing user interactions, returning session / refresh JWTs- Session management and validation - Storing the session securely for subsequent client requests, validating / refreshing sessions- Basic Authorization - extracting and validating claims from the session token JWT and handling authorization in backend flows
At the end of the workshop, we will also touch other approaches of authentication implementation with Descope - using frontend or backend SDKs.
Finding, Hacking and fixing your NodeJS Vulnerabilities with Snyk
JSNation 2022JSNation 2022
99 min
Finding, Hacking and fixing your NodeJS Vulnerabilities with Snyk
WorkshopFree
Matthew Salmon
Matthew Salmon
npm and security, how much do you know about your dependencies?Hack-along, live hacking of a vulnerable Node app https://github.com/snyk-labs/nodejs-goof, Vulnerabilities from both Open source and written code. Encouraged to download the application and hack along with us.Fixing the issues and an introduction to Snyk with a demo.Open questions.
Bring Code Quality and Security to your CI/CD pipeline
DevOps.js Conf 2022DevOps.js Conf 2022
76 min
Bring Code Quality and Security to your CI/CD pipeline
WorkshopFree
Elena Vilchik
Elena Vilchik
In this workshop we will go through all the aspects and stages when integrating your project into Code Quality and Security Ecosystem. We will take a simple web-application as a starting point and create a CI pipeline triggering code quality monitoring for it. We will do a full development cycle starting from coding in the IDE and opening a Pull Request and I will show you how you can control the quality at those stages. At the end of the workshop you will be ready to enable such integration for your own projects.
JS Security Testing Automation for Developers on Every Build
TestJS Summit 2021TestJS Summit 2021
111 min
JS Security Testing Automation for Developers on Every Build
WorkshopFree
Oliver Moradov
Bar Hofesh
2 authors
As a developer, you need to deliver fast, and you simply don't have the time to constantly think about security. Still, if something goes wrong it's your job to fix it, but security testing blocks your automation, creates bottlenecks and just delays releases...but it doesn't have to...

NeuraLegion's developer-first Dynamic Application Security Testing (DAST) scanner enables developers to detect, prioritise and remediate security issues EARLY, on every commit, with NO false positives/alerts, without slowing you down.

Join this workshop to learn different ways developers can access Nexploit & start scanning without leaving the terminal!

We will be going through the set up end-to-end, whilst setting up a pipeline, running security tests and looking at the results.

Table of contents:
- What developer-first DAST (Dynamic Application Security Testing) actually is and how it works
- See where and how a modern, accurate dev-first DAST fits in the CI/CD
- Integrate NeuraLegion's Nexploit scanner with GitHub Actions
- Understand how modern applications, APIs and authentication mechanisms can be tested
- Fork a repo, set up a pipeline, run security tests and look at the results
Passwordless Auth to Servers: hands on with ASA
DevOps.js Conf 2022DevOps.js Conf 2022
32 min
Passwordless Auth to Servers: hands on with ASA
WorkshopFree
E. Dunham
E. Dunham
These days, you don't need a separate password for every website you log into. Yet thanks to tech debt and tradition, many DevOps professionals are still wrangling a host of SSH keys to access the servers where we sometimes need to be. With modern OAuth, a single login and second factor to prove your identity are enough to securely get you into every service that you're authorized to access. What if SSHing into servers was that easy? In this workshop, we'll use Okta's Advanced Server Access tool (formerly ScaleFT) to experience one way that the dream of sending SSH keys the way of the password has been realized.
- we'll discuss how ASA works and when it's the right tool for the job- we'll walk through setting up a free trial Okta account to use ASA from, and configuring the ASA gateway and server on Linux servers- we'll then SSH into our hosts with the ASA clients without needing to supply an SSH key from our laptops- we'll review the audit logs of our SSH sessions to examine what commands were run