Content Security Policy multiple nonce

I have a single page application (built in .net core MVC 2.2), where html section are loaded on the fly.

On main document, added CSP policy with a dynamically generated header looks like:

Content-Security-Policy: script-src 'self' 'nonce-I64vb811BxRNGV9Xf0pM'

Then comes a page section loaded via jquery ajax load function. page section contains a script (from src) with a nonce. Page section served with CSP header looks like

Content-Security-Policy: script-src 'self' 'nonce-ci5TQsyidT8x2jwBLRHS'

all good but browsers (chrome, safari blocking the script), with message:

jqueryscriptsbundle.js:formatted:43 Refused to execute inline script 
because it violates the following 
Content Security Policy directive: "script-src 'self' 'nonce-I64vb811BxRNGV9Xf0pM'

So browser is comparing nonce of script i.e. ci5TQsyidT8x2jwBLRHS with root/main page nonce value I64vb811BxRNGV9Xf0pM hence script blocked.

Is it correct behavior ? What can I do to make it work?

Answer

Your initial CSP, loaded with the page, provides a nonce. What you’re trying to do is add another nonce, via Ajax, after the initial page load. CSP explicitly doesn’t allow this; that’s not a bug — it’s the entire point.

What you might do is allow a script-src of strict-dynamic. This allows you to authorize a script, and anything loaded by that script is also authorized. See https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/script-src