[Bug]: Pen-test fails on CSP: style-src

[njannink]

Blazorise Version

1.5

What Blazorise provider are you running on?

Material

Link to minimal reproduction or a simple code snippet

Run pen-test tool like https://www.zaproxy.org/ on blazorise website

Steps to reproduce

https://www.zaproxy.org/

What is expected?

No warnings

What is actually happening?

Content Security Policy (CSP) Header Not Set
Content Security Policy (CSP) is an added layer of security that helps to detect and mitigate certain types of attacks, including Cross Site Scripting (XSS) and data injection attacks. These attacks are used for everything from data theft to site defacement or distribution of malware. CSP provides a set of standard HTTP headers that allow website owners to declare approved sources of content that browsers should be allowed to load on that page — covered types are JavaScript, CSS, HTML frames, fonts, images and embeddable objects such as Java applets, ActiveX, audio and video files.

What browsers do you see the problem on?

No response

Any additional comments?

To lower the risk of XSS the use of CSP headers is highly recommended. See this Microsoft page how to do that for Blazor
https://learn.microsoft.com/en-us/aspnet/core/blazor/security/content-security-policy?view=aspnetcore-8.0

But turning on default CSP will break Blazorise, because it is highly dependant on inline styles. Searching for 'style=' on the repo gives already more than 400 hits. So for now there is no other way than allow inline styles 'unsafe-inline'. Possibly we could put this as guideline for Blazorise to no longer use inline styles and slowly move away from the ones we currently use and only use regular or scoped stylesheets for the styling of Blazorise elements.

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src#unsafe_inline_styles

[ageiter]

After an extensive security audit & pen test of our application, which we did with ABP (which uses Blazorise components), one of the findings was that the content security policy should be tightened.

When I tried to do this, some parts of the application stopped working. The reason for this was the policy style-src 'self'.

For example, the modal component no longer appears.
If at least that would still work, then I could deal with the rest of the error messages... but this way I really have a problem.

Especially if the customer insists on this policy...

[njannink]

inline styling should be phased out and only classes should be used, but thats a huge operation.

I can also foresee this will give issues with for example the theming engine since that is also dependant on dynamic styles inside the html doc.

[stsrki]

Removing inline styles would be hard or even impossible to do. We even have some CSS that are dynamically loaded when a certain JS module is initialized. So for now, the style-src 'self' and 'unsafe-inline' are the only options.

[ageiter]

I understand the problem...
Would it be possible to do something with nonce-source or hash?

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/style-src#unsafe_inline_styles

[stsrki]

That's a good question. From what I can read, it might work. Although I'm not sure how it would work for SPA, There is a comment that it needs to be differently for each request