Implementing CSP using nonce - not getting reflected for auto-generated scripts

Support
#1

Hi,

I have implemented below code but still changes are not working on browser

Jmix Verision : JMIX 2.1.3


public class HttpMethodFilter extends OncePerRequestFilter 
{
byte[] nonceBytes = new byte[16];
secureRandom.nextBytes(nonceBytes);
String nonce = base64Encoder.encodeToString(nonceBytes);

// Set the nonce in the response header
HttpServletResponse httpServletResponse = (HttpServletResponse) response;
httpServletResponse.setHeader("Content-Security-Policy", "script-src 'self' 'nonce-" + nonce + "'");

// Pass the nonce to the request attributes for use in HTML
request.setAttribute("cspNonce", nonce);
}

–

LoginNewView.java
{
getUI().ifPresent(ui -> {
            String cspNonce = (String) VaadinSession.getCurrent().getAttribute("cspNonce");
            ui.getPage().executeJs(
                    "var script = document.createElement('script');" +
                            "script.setAttribute('nonce', '" + cspNonce + "');" +
                            "script.textContent = \"console.log('Custom script with nonce');\";" +
                            "document.head.appendChild(script);"
            );
        });
}

image

#3

Hi,

Could you please attache a demo project that reproduces the problem?

Regards,
Gleb

#5

TestProject.zip (1.1 MB)

#6

without “unsafe-eval” and “unsafe-inline” using nonce and they have suggested us as well to do the same. These are their recommendations
Please find the recommendation for CSP Header and refer the safe policy implementation example in attached screenshot

  1. Define Specific Sources: Specify the necessary domains explicitly for each content type(e.g. style, script, img). This helps prevent issues when using technologies like JSONP or Angular, as well as when hosting user-uploaded files.

  2. Restrict object-src: If your application does not require the use of plugins like Flash or Java applets, set the object-src directive to ‘none’ to disallow their use entirely.

  3. Require Trusted Types for Scripts: Enforce Trusted Types for scripts by including require-trusted-types-for ‘script’ in your CSP. Trusted Types help prevent DOM-based XSS attacks by enforcing strict security controls over the manipulation of DOM elements.

  4. Remove “unsafe-eval” and “unsafe-inline” directives: These directives should be removed from the CSP configuration entirely to eliminate the vulnerability they introduce.

  5. Avoid dynamic code execution: Refactor the application code to minimize or eliminate the use of dynamic code execution methods like eval(). Use safer alternatives, such as utilizing specific JavaScript functions or libraries for dynamic behaviour.

  6. Use nonce or hash-based CSP: Implement the use of cryptographic nonces or hashes in the CSP configuration. This allows the application to control which scripts are allowed to execute, even if they are dynamically generated.

#7

Hi @gorelov,

Can you help with this, tried running your demo project noticed that
still there are scripts that are getting blocked and logout button has
stopped working, speculating that this is happening due to the following
code from HttpMethodFilter:

response.setHeader("Content-Security-Policy", "script-src 'self' 'unsafe-eval' 'nonce-" + nonce + "'"); // 'unsafe-eval'

On commenting the above code CSP policy doesn’t get applied but I am
able to logout from project, also have added ‘unsafe-eval’ on your
suggestion as the shared Project doesn’t run as is since due to CSP
scripts are getting blocked.

Screenshot from 2025-03-21 17-23-02

Above Image is on console log getting printed when logout button not working

Screenshot from 2025-03-21 17-23-14
Screenshot from 2025-03-21 17-23-50

#8

Hi Adnan Khan

The logout button might be something else. Check here

Regards

Felix