April 27, 2021

What does '[Report Only] Refused to load..' mean in Magento?

After updating Magento to v2.3.5 you may find lots of errors like these in the Chrome console. It’s not a bug it’s a feature!

"Chrome csp error" Screenshot badly censored for privacy reasons

If you’re seeing your console full of errors like this don’t worry, they are just Content Security Policy (CSP) notifications which help prevent cross-site scripting (XSS) attacks.

Magento_Csp module

By default, the module doesn’t block cross sites script but adds all those annoying notofication in the console. if you want a higher level of security, just configure the module in this way:

<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Store:etc/config.xsd">
    <default>
        <csp>
            <mode>
                <storefront>
                    <report_only>0</report_only>
                </storefront>
                <admin>
                    <report_only>0</report_only>
                </admin>
            </mode>
        </csp>
    </default>
</config>

If you want to remove the notifications you need to whitelist the allowed source. In your custom module create etc/csp_whitelist.xml and add:

<?xml version="1.0"?>
<csp_whitelist xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:module:Magento_Csp:etc/csp_whitelist.xsd">
    <policies>
        <policy id="script-src">
            <values>
                <value id="secure-host" type="host">https://my-secure-host.com</value>
            </values>
        </policy>
    </policies>
</csp_whitelist>

See Magento dev docs for details

"Rear window" Rear window, Alfred Hitchcock, 1954

No copyright / do whatever the hell you want with these contents
Built with Hugo and Kiss theme. Hosted on Netlify. Icons made by Ddara