0
844
VistasAngular da el error `Se negó a ejecutar el controlador de eventos en línea`
He creado una aplicación angular. que da el siguiente error en el navegador
Refused to execute inline event handler because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-...'), or a nonce ('nonce-...') is required to enable inline execution. Note that hashes do not apply to event handlers, style attributes and javascript: navigations unless the 'unsafe-hashes' keyword is present.La razón es que angular inyecta lo siguiente en index.html
<link rel="stylesheet" href="styles.css" media="print" onload="this.media='all'"> Es eso onload="this.media='all'"
Una solución es establecer "optimization" en falso, en cuyo caso angular no inyecta este código. Pero eso no suena como la mejor solución. ¿Alguna sugerencia de cómo hacer esto?
Otra solución, que creo que es un poco mejor que la anterior, es crear un componente contenedor que contenga todo el estilo de styles.scss . En mi caso, para que esto funcione, también necesitaba configurar la encapsultaion de ese componente contenedor en ViewEncapsulation.None
2 Respuestas
Responde la pregunta0
Tuve que agregar esto en la configuración de producción en angular.json
"optimization": { "scripts": true, "styles": { "minify": true, "inlineCritical": false }, "fonts": true }, Porque "optimization": false hace que el tamaño del paquete sea demasiado grande.
0
La causa raíz y la solución se tratan aquí: se negó a ejecutar el controlador de eventos en línea porque viola CSP. (SANDBOX) Lograr que Angular lo haga de una mejor manera puede ser un desafío.
Como dice el mensaje de error, puede permitirlo con 'hashes inseguros', pero esa es una característica del nivel 3 de CSP y solo se implementa en los navegadores Chromium.