Coder Perfect

For script and style components, what is the purpose of the HTML “nonce” attribute?

Problem

According to the W3C, HTML5.1 has a new feature called nonce for style and script that can be used by a website’s Content Security Policy.

I googled it but couldn’t figure out what this attribute does and what changes when it’s used.

Asked by ata

Solution #1

The nonce property enables you to “whitelist” specific inline script and style elements while avoiding the usage of the CSP unsafe-inline directive (which would allow all inline script/style), preserving the important CSP feature of preventing inline script/style in general.

So the nonce property tells browsers that the inline contents of a particular script or style element weren’t injected into the document by some (malicious) third party, but were instead put in the page by whoever controls the server from which the document is served.

The If you absolutely must use it… section of the tals Content Security Policy document contains a nice example of how to utilize the nonce attribute, which corresponds to the following steps:

So, instead of having your backend construct a hash of the contents of the inline script or style you want to allow, you can put that hash in the relevant source list in your CSP header by using a nonce.

Because browsers don’t (can’t) check that the nonce value sent changes between page requests, you could skip step 1 and not have your backend do anything dynamically for the nonce, in which case you could just put a nonce attribute with a static value in the HTML source of your doc and send a static CSP header with the same nonce value.

But the reason you wouldn’t want to use a static nonce in that fashion is because it would effectively contradict the purpose of employing the nonce in the first place—because if you used a static nonce like that, you’d be better off just using unsafe-inline.

In terms of which elements are “nonceable,” they are: Browsers can presently only check nonces for script and style elements, according to the CSP specification. The following are the specifications:

Answered by sideshowbarker

Post is based on https://stackoverflow.com/questions/42922784/what-s-the-purpose-of-the-html-nonce-attribute-for-script-and-style-elements