Después de investigar con especialistas en la materia, programadores de diversas áreas y maestros dimos con la respuesta a la interrogande y la compartimos en esta publicación.
Solución:
La política de seguridad de contenido (CSP) es un mecanismo para ayudar a prevenir el Cross-Site Scripting (XSS) y se maneja mejor en el lado del servidor; tenga en cuenta que también se puede manejar en el lado del cliente, haciendo uso de la elemento de etiqueta de su HTML.
Cuando está configurado y habilitado, un servidor web devolverá el apropiado Content-Security-Policy
en el encabezado de respuesta HTTP.
Es posible que desee leer más sobre CSP en el sitio web de HTML5Rocks y en la página para desarrolladores de Mozilla aquí y aquí.
Google CSP Evaluator es una herramienta en línea práctica y gratuita para ayudar a probar CSP para su sitio web o aplicación web.
En su caso, es posible que deba agregar la línea a continuación sin imponer HTTPS como protocolo usando el https:
directiva;
Porque su sitio web o aplicación (compartida) no está disponible a través de HTTPS.
res.header('Content-Security-Policy', 'img-src 'self'');
Empezando con default-src
directiva establecida para none
es una excelente manera de comenzar a implementar su configuración de CSP.
En caso de que opte por usar el middleware Content-Security-Policy para Express, puede comenzar como se ilustra en el fragmento a continuación;
const csp = require('express-csp-header');
app.use(csp(
policies:
'default-src': [csp.NONE],
'img-src': [csp.SELF],
));
// HTTP response header will be defined as:
// "Content-Security-Policy: default-src 'none'; img-src 'self';"
Recuerde que los CSP son específicos para cada caso o aplicación y se basan en los requisitos de su proyecto.
Como tal, necesita afinar para satisfacer su necesidad.
Sección de Reseñas y Valoraciones
Si tienes alguna desconfianza y disposición de enriquecer nuestro sección eres capaz de añadir una acotación y con placer lo observaremos.