Evite las vulnerabilidades de secuencias de comandos entre sitios basadas en DOM con los tipos de confianza

¿Por qué debería preocuparte?

La secuencia de comandos de sitios cruzados basada en DOM (DOM XSS) es una de las vulnerabilidades de seguridad web más comunes, y es muy fácil introducirla en su aplicación. Tipos de confianza
Brindarle las herramientas para escribir, revisar la seguridad y mantener aplicaciones libres de vulnerabilidades DOM XSS al hacer que las peligrosas funciones de la APIConcepto de API¿Qué es una API?Una API, siglas de Application Programming Interface o Interfaz de Programación de Apps, es un recopilatorio de código que se puede emplear para que varias apps se comuniquen entre ellas. Es algo que realiza una tarea equivalente a la interfaz de usuario al momento de promover la interacción entre persona y programa, solo que aplicado única y exclusivamente dentro del entorno del software.Aún cuando suene más web sean seguras de manera predeterminada. Los tipos de confianza son compatibles con Chrome 83 y polyfill está disponible para otros navegadoresConcepto de Navegadores¿Qué son los Navegadores?Los Navegadores son herramientas informáticas que utilizamos para, normalmente, navegar por Internet y visitar cualquier página web, al mismo tiempo de para hacer otras tareas como ver documentos, observar vídeos o reproducir contenido multimedia de cualquier tipo. Son un tipo de software sencillamente usual y bastante utilizado hoy en día.Insistimos en que es algo que se utiliza con mucha frecuencia, puesto que moverse por Internet más. Ver Compatibilidad del navegador para obtener información actualizada sobre compatibilidad con varios navegadores.

Antecedentes

Durante muchos años DOM XSS
ha sido una de las vulnerabilidades de seguridad web más frecuentes y peligrosas.

Hay dos grupos distintos de secuencias de comandos entre sitios. Algunas vulnerabilidades XSS son causadas por el código del lado del servidorLos servidores son ordenadores centrales y potentes dentro del campo de la tecnología de la información que procesan y proporcionan software y archivos en una red. Desde el punto de vista de un cliente, varios ordenadores en una red pueden ponerse en contacto con el servidor central para conseguir la información solicitada. En la arquitectura cliente-servidor, el servidor puede ser un software que proporciona un servicio y se ejecuta en más que crea de manera insegura el código HTMLHTML (Hypertext Markup Language) se usa para estructurar el contenido de texto de un documento web. No sólo se marca el contenido, sino además la meta-información que describe este contenido. Las páginas HTML se almacenan normalmente en el directorio raíz del servidor. Cómo se creó En la era digital, a los usuarios les resulta difícil hallar su camino en las webs y hacer un seguimiento de las estructuras de las más que forma el sitio web. Otros tienen una causa raíz en el cliente, donde el código JavaScript llama a funciones peligrosas con contenidoEl contenido puede ser muy difícil de definir con precisión. Es una definición que se refiere a las declaraciones contenidas en un documento o publicación de cualquier tipo y puede incluir las tecnologías de la información y la comunicación. Esto cubre todos los tipos de medios como imágenes y texto. A parte de esto, en el campo de la optimización de motores de búsqueda, los términos duplicar contenido, contenido único, más controlado por el usuario.

A evitar XSS del lado del servidor, no genere HTML mediante la concatenación de cadenas y utilice bibliotecas de plantillas seguras con escape automático contextual. Usar una Política de seguridad de contenido basada en nonce para una mitigación adicional contra los errores que inevitablemente ocurren.

Ahora, un navegadorUn navegador (además: browser) es una herramienta informática que te permite ver documentos y datos y navegar por la red. Los navegadores pueden mostrar distintos tipos de recursos de información; principalmente documentos HTML, a pesar de todo, además son posibles otros tipos de archivos y contenido multimedia, como PDF, JPEG, MPEG, GIF o el lenguaje de meta marcado. A través el uso de complementos especiales y la configuración respectivo, los más también puede ayudar a prevenir los XSS del lado del cliente (también conocidos como basados ​​en DOM) con Tipos de confianza.

Introducción a la API

Los tipos de confianza funcionan bloqueando las siguientes funciones de sumidero de riesgo. Es posible que ya reconozca a algunos de ellos, como proveedores de navegadores y marcos web ya lo aleja del uso de estas funciones por razones de seguridad.

• Manipulación de guiones:
  <script src> y configurar el contenido de texto de <script> elementos.

• Generando HTML a partir de una cadena:

  innerHTML, outerHTML,insertAdjacentHTML,
  <iframe> srcdoc,
  document.write, document.writelny DOMParser.parseFromString

• Ejecutando el contenido del complemento:
  <embed src>, <object data> y <object codebase>

• Compilación de código JavaScript en tiempo de ejecución:
  eval, setTimeout, setInterval, new Function()

Los tipos de confianza requieren que procese los datos antes de pasarlos a las funciones de receptor anteriores. El solo uso de una cadena fallará, ya que el navegador no sabe si los datos son confiables:

anElement.innerHTML  = location.href;

Para indicar que los datos se procesaron de forma segura, cree un objeto especial: un tipo de confianza.

anElement.innerHTML = aTrustedHTML;

Los tipos de confianza reducen considerablemente el DOM XSS superficie de ataque
de su aplicación. Simplifica las revisiones de seguridad y le permite hacer cumplir las verificaciones de seguridad basadas en tipos que se realizan al compilar, enlazar o empaquetar su código en tiempo de ejecución, en el navegador.

Cómo utilizar los tipos de confianza

Prepárese para los informes de infracción de la política de seguridad de contenido

Puede implementar un recopilador de informes (como el de código abiertoEl Código Abierto u Open Source se refiere al código fuente del software que es abiertamente alcanzable y que puede ser cambiado y distribuido por cualquier persona. La propuesta de código abierto estipula diez requerimientos para las licencias de software de código abierto. El principio El código fuente de un software se hace público: cualquiera puede leerlo, desarrollar el propio software y copiarlo. El software puede ser utilizado o distribuido más go-csp-collector), o utilice uno de los equivalentes comerciales. También puede depurar las infracciones en el navegador:

window.addEventListener('securitypolicyviolation',
console.error.bind(console));

Agregue el siguiente encabezado de respuesta HTTPEl HTTP (Hyper Text Transfer Protocol) es un protocolo que se usa para transmitir datos en redes. HTTP es un estándar técnico generalmente aceptado que establece cómo un cliente web se comunica con un servidor para que los datos solicitados por el cliente puedan ser cargados y mostrados. Información general Junto con el URL y el HTML, HTTP es uno de los conceptos más importantes de Internet (www). Fue desarrollado más a los documentos que desea migrar a tipos de confianza.

Content-Security-Policy-Report-Only: require-trusted-types-for 'script'; report-uri //my-csp-endpoint.example

Ahora todas las violaciones se informan a //my-csp-endpoint.example, pero el sitio web sigue funcionando. La siguiente sección explica cómo //my-csp-endpoint.example trabajos.

Identificar infracciones de tipos de confianza

A partir de ahora, cada vez que Trusted Types detecte una infracción, se enviará un informe a un report-uri. Por ejemplo, cuando su aplicación pasa una cadena a innerHTML, el navegador envía el siguiente informe:

{
"csp-report": {
    "document-uri": "https://my.url.example",
    "violated-directive": "require-trusted-types-for",
    "disposition": "report",
    "blocked-uri": "trusted-types-sink",
    "line-number": 39,
    "column-number": 12,
    "source-file": "https://my.url.example/script.js",
    "status-code": 0,
    "script-sample": "Element innerHTML <img src=x"
}
}

Esto dice que en https://my.url.example/script.js en la línea 39 innerHTML fue llamado con la cadena que comienza con <img src=x. Esta información debería ayudarlo a delimitar qué partes del código pueden estar introduciendo DOM XSS y deben cambiar.

Arregle las infracciones

Hay un par de opciones para corregir una infracción de tipo de confianza. Puede eliminar el código infractor, utilizar una biblioteca, crear una política de tipo de confianza o, como último recurso, crear una política predeterminada.

Reescribe el código ofensivo

¿Quizás la funcionalidad no conforme ya no sea necesaria o se pueda reescribir de una manera moderna sin usar las funciones propensas a errores?

el.innerHTML = '<img src=xyz.jpg>';

el.textContent = '';
const img = document.createElement('img');
img.src = 'xyz.jpg';
el.appendChild(img);

Usa una biblioteca

Algunas bibliotecas ya generan tipos de confianza que puede pasar a las funciones de receptor. Por ejemplo, puede utilizar
DOMPurify para desinfectar un fragmento de HTML, eliminando las cargas útiles XSS.

import DOMPurify from 'dompurify';
el.innerHTML = DOMPurify.sanitize(html, {RETURN_TRUSTED_TYPE: true);

DOMPurify admite tipos de confianza y devolverá HTML desinfectado envuelto en un TrustedHTML objeto de modo que el navegador no genere una infracción.

Cree una política de tipo de confianza

A veces no es posible eliminar la funcionalidad y no existe una biblioteca para desinfectar el valor y crear un Tipo de confianza para usted. En esos casos, cree usted mismo un objeto Trusted Type.

Para eso, primero crea un política. Las políticas son fábricas de tipos de confianza que imponen ciertas reglas de seguridad en su entrada:

if (window.trustedTypes &ampConcepto de AMP¿Qué es el AMP o Accelerated Mobile Pages?El AMP, abreviatura de Accelerated Mobile Pages, es una propuesta que empezó a tomar forma en el año 2016 con la finalidad de mejorar la usabilidad, lectura y, en general, la experiencia de los usuarios de teléfono celular dentro de cualquier página web. Emprendida por Google con un aperturismo total (es de código abierto), lleva en activo desde entonces para facilitar más;& trustedTypes.createPolicy) { 
  const escapeHTMLPolicy = trustedTypes.createPolicy('myEscapePolicy', {
    createHTML: string => string.replace(/</g, '&lt;')
  });
}

Este código crea una política llamada myEscapePolicy que puede producir TrustedHTML
objetos a través de su createHTML() función. Las reglas definidas escaparán HTML < caracteres para evitar la creación de nuevos elementos HTML.

Utilice la política así:

const escaped = escapeHTMLPolicy.createHTML('<img src=x onerror=alert(1)>');
console.log(escaped instanceof TrustedHTML);  
el.innerHTML = escaped;  

Utilice una política predeterminada

A veces no se puede cambiar el código ofensivo. Por ejemplo, este es el caso si está cargando una biblioteca de terceros desde una CDN. En ese caso, utilice un
política predeterminada:

if (window.trustedTypes && trustedTypes.createPolicy) { 
trustedTypes.createPolicy('default', {
createHTML: (string, sink) => DOMPurify.sanitize(string, {RETURN_TRUSTED_TYPE: true});
});
}

La póliza con nombre default se usa siempre que se usa una cadena en un receptor que solo acepta Trusted Type.

Cambiar para hacer cumplir la Política de seguridad del contenido

Cuando su aplicación ya no produzca infracciones, puede comenzar a hacer cumplir los tipos de confianza:

Content-Security-Policy: require-trusted-types-for 'script'; report-uri //my-csp-endpoint.example

¡Voila! Ahora, no importa cuán compleja sea su aplicación web, lo único que puede introducir una vulnerabilidad DOM XSS es el código en una de sus políticas, y puede bloquearlo aún más si limitar la creación de políticas.

Otras lecturas