Table of Contents & Menu
On this page
Navigation

Configuring CSP in Magento

Removing unsafe-eval and unsafe-inline

To ensure Alpine components (or any JavaScript) work with strict CSP, configure your Magento development environment to disable unsafe-eval and unsafe-inline.

Disabling these directives will cause errors (stack traces) in the browser console for any code that relies on them. Enable "Warning" log level in your browser's dev console to see Alpine's helpful debugging information (expression and element causing the issue).

Disabling unsafe-eval forces alpine-csp

Disabling unsafe-eval automatically switches Hyvä to use the Alpine CSP build.

Disabling unsafe-inline breaks scripts in CMS content

Disabling unsafe-inline prevents the use of scripts within CMS content.

Built-in PHP Full Page Cache and Strict CSP Incompatibility

The built-in PHP full-page cache does not store the CSP header. This means cached pages served by the PHP cache will not authorize inline scripts when strict CSP is enabled. Reverse proxy solutions like Varnish or Fastly cache the CSP header correctly. Uncached pages (e.g., checkout) are unaffected.

Manual configuration

Add the following configuration to app/etc/env.php:

    'system' => [
        'default' => [
            'csp' => [
                'mode' => [
                    'storefront' => [
                        'report_only' => 0,
                    ]
                ],
                'policies' => [
                    'storefront' => [
                        'scripts' => [
                            'eval' => 0,
                            'inline' => 0,
                        ]
                    ]
                ]
            ]
        ]
    ]

After adding, run bin/magento app:config:import.

CLI configuration

Using the Magerun tool, apply these settings with the following commands:

n98-magerun config:env:set system/default/csp/policies/storefront/scripts/inline 0
n98-magerun config:env:set system/default/csp/policies/storefront/scripts/eval 0
n98-magerun config:env:set system/default/csp/mode/storefront/report_only 0
bin/magento app:config:import

Strict CSP in website or store view scope

To apply strict CSP at a specific website or store view scope, adjust the commands below with the relevant code. For example, using example as the website/store view code:

For a **website** (e.g., example):

n98-magerun config:env:set system/websites/example/csp/policies/storefront/scripts/inline 0
n98-magerun config:env:set system/websites/example/csp/policies/storefront/scripts/eval 0
n98-magerun config:env:set system/websites/example/csp/mode/storefront/report_only 0
bin/magento app:config:import

For a **store view** (e.g., example):

n98-magerun config:env:set system/stores/example/csp/policies/storefront/scripts/inline 0
n98-magerun config:env:set system/stores/example/csp/policies/storefront/scripts/eval 0
n98-magerun config:env:set system/stores/example/csp/mode/storefront/report_only 0
bin/magento app:config:import

Forcing strict CSP on specific routes

Magento allows enabling or disabling CSP policies per route. The Magento_Checkout module's etc/config.xml provides an example, enabling strict mode and disabling unsafe-inline for the checkout_index_index route:

    <csp>
        <mode>
            <storefront_checkout_index_index>
                <report_only>0</report_only>
            </storefront_checkout_index_index>
        </mode>
        <policies>
            <storefront_checkout_index_index>
                <scripts>
                    <inline>0</inline>
                    <event_handlers>1</event_handlers>
                </scripts>
            </storefront_checkout_index_index>
        </policies>
    </csp>