No way to obtain an A+ grade to headers test

[Elrondo46]

What happened?

https://securityheaders.com/?q=peertube.pcservice46.fr&followRedirects=on
No way to obtain an A+ grade to that test because of a non secure Content Security Policy parameter: style-src 'self' 'unsafe-inline';

If I change that to self without unsafe-inline, the interface is completely broken.

What do you expect to happen instead?

Can have a full grade for my Peertube Instance.

Steps to reproduce:

Repeat the same config I tell in: What happened?

Additional information

• PeerTube version or URL: Peertube 2.1.0-rc.1
• Browser name/version: Firefox 72.0.2
• NodeJS version: NodeJS 10.18.1

[frankstrater]

See also #1252

[Chocobozzz]

We can't really do anything, it's related to Angular.

[Nutomic]

@Chocobozzz According to this documentation page, Angular works fine even with scrict CSP, if you configure it correctly. Is that wrong? If so, this issue should still be kept open until a solution can be found.

[Chocobozzz]

Your documentation is for Angular 1.

[Nutomic]

Right, I just didnt find the same documentation for Angular 2. Or are you saying this feature was completely removed? Anyway I dont see any reason to close this issue if it is not resolved.

[rigelk]

Ahead-of-Time (AOT) compilation (aka ng build --prod) separates out all JavaScript code from the index.html file. Unfortunately, processing of the CSS is not as neat and styles remain inline in all the components (see this ticket for tracking). So, we have to put up with unpleasant style-src 'unsafe-inline'.

As for the scripts, 'unsafe-inline' is also required if we want plugins to work. There will be a way with angular/angular#26152 though: a combination of nonce-based CSP with strict-dynamic directive. Hence, if a script trusted with a nonce creates a new script at runtime, this new script will also be considered legitimate.