We've implemented the code for adding CSP header in Angular using Java filter class. On the angular side, we have implemented shared_styles_hosts.ts also. Now, we are able to see the CSP header, but somehow the nonce value on the style tags are coming as empty, due to which we are getting the below error on several elements- "Refused to apply inline style because it violates the following Content Security Policy directive: "style-src 'self' https://fonts.googleapis.com". Either the 'unsafe-inline' keyword, a hash or a nonce is required." When we checked in the developer console, we noticed that we are getting this error at the following line in shared_styles_host.ts file - styleNodes.push(host.appendChild(styleEl)); We can't use unsafe-inline or hash. Also, due to project structure, we won't be able to move all our inline styles to some other file. So the only option left is the correct implementation of nonce. Does anyone has any idea why the nonce value is empty in the style tag? Continue reading...
