Security.nonce ViewHelper `<f:security.nonce>`

Changed in version 14.1, 13.4.23

CSP nonce sources set via the {f:security.nonce()} ViewHelper are no longer incorrectly considered negligible. The newly introduced directive and scope arguments allow TYPO3 to correctly assign that nonce to the appropriate CSP directive, whereas previously the nonce could be silently discarded due to missing context.

The {f:security.nonce()} ViewHelper generates a CSP (Content Security Policy) nonce and registers it for inclusion in the CSP header.

Hint

The {f:security.nonce()} view-helper is meant as a compatibility fallback. It is suggested to use more specific ViewHelpers like Asset.css ViewHelper <f:asset.css> or Asset.script ViewHelper <f:asset.script>.

Go to the source code of this ViewHelper: Security\NonceViewHelper.php (GitHub).

Table of contents

Examples of security.nonce ViewHelper usage

Basic usage

<script nonce="{f:security.nonce()}">const inline = 'script';</script>

The optional arguments directive and scope can be used to explicitly declare how the generated nonce should be applied to the Content Security Policy. This avoids ambiguity and allows TYPO3 to assign the nonce to the correct CSP directive.

Inline script (default scope)

Inline scripts require the nonce to be registered for the script-src CSP directive. The inline scope is the default and may be omitted.

Inline script with explicit directive

<script nonce="{f:security.nonce(directive: 'script-src')}">
    const test = true;
</script>

External script (static scope)

When a nonce is applied to an external script, the static scope should be used. This allows TYPO3 to correctly associate the nonce with a static script element.

External script with nonce

<script
    src="{scriptUri}"
    nonce="{f:security.nonce(directive: 'script-src', scope: 'static')}"></script>

Inline styles with nonce attribute

The ViewHelper can also be used for inline styles by specifying the corresponding style directive.

Inline style block

<style nonce="{f:security.nonce(directive: 'style-src')}">
    body {
        background-color: #f5f5f5;
    }
</style>

Arguments of the `<f:security.nonce>` ViewHelper

New in version 14.1, 13.4.23

The arguments directive and scope were introduced.

Parameter directive can be one of default-src, script-src, script-src-elem, style-src, or style-src-elem (referring to a CSP directive).

directive

Type: string

Value of the CSP directive

scope

Type: string
Default: 'inline'

`inline` or `static`

Security.nonce ViewHelper <f:security.nonce>