Mi aplicación web no puede cargar los recursos estáticos de un espacio de DigitalOcean y muestra el siguiente error en la consola del navegador:
Content Security Policy: The page's settings blocked the loading of a resource at https://somespace.digitaloceanspaces.com/static/css/mystyle.css (“style-src”).Leí un poco sobre CSP, y en este recurso encontré la siguiente declaración:
Este mensaje de advertencia significa que, debido a la existencia de una directiva CSP en particular, no se cargó un recurso.
Sin embargo, no he proporcionado ninguna directiva CSP en particular. También proporciono un fragmento breve sobre cómo incluyo el archivo CSS en mi documento HTML:
<head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <link href="https://somespace.digitaloceanspaces.com/static/css/mystyle.css" rel="stylesheet"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <meta name="format-detection" content="telephone=no"> <meta name="msapplication-TileColor" content="#ffffff"> </head>¿Podría haber otra razón por la que se arroja este error? ¿Cuál sería una solución alternativa o al menos una forma de depurar este problema?
Primero debe verificar los encabezados de respuesta que está recibiendo. La política de seguridad de contenido debe definirse allí. Este encabezado contiene las configuraciones. Puede obtener más información sobre ellos aquí: https://content-security-policy.com/
Luego, debe determinar dónde se agrega este encabezado. En mi caso, se estaba agregando a través de una configuración antigua de NGINX.