By default, CSP sends errors to the browser console, but can be configured to collect error logs by HTTP request. https://devdocs.magento.com/security/content-security-policy-overview.html#reporting
Also by default, CSP is configured in report-only
mode in Magento. It is up to the merchants and developers to configure policies to work according to their custom code. https://devdocs.magento.com/guides/v2.4/extension-dev-guide/security/content-security-policies.html#default-configuration
Option 1
One way to resolve this issue, is to set some report-uri configuration values. https://devdocs.magento.com/guides/v2.4/extension-dev-guide/security/content-security-policies.html#report-uri-configuration. To accomplish this, create your own custom module to extend Magento_Csp. The URL to use for reporting by browsers can be configured in the etc/config.xml file. At a minimum, it would look like this:
<?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_uri>https://cyberic.report-uri.com/r/d/csp/reportOnly</report_uri> </storefront> <admin> <report_uri>https://cyberic.report-uri.com/r/d/csp/reportOnly</report_uri> </admin> </mode> </csp> </default> </config>
Then run:
bin/magento setup:upgrade
In developer mode, that would be sufficient. In production mode, deploy the static content as well.
Option 2
If you are going to use CSP in restrict
mode, you can skip the report-uri configuration, if you wish. To set the mode to restrict
, change the value of the report_only
element to 0 in the etc/config.xml file. https://devdocs.magento.com/guides/v2.4/extension-dev-guide/security/content-security-policies.html#configure-a-modules-csp-mode At a minimum, it would look like this:
<?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>
Verify that no other module is conflicting with the CSP configuration. Search for the following <report_only>1</report_only>
. Any modules with this directive should be included in our etc/module.xml file. For example, in Magento 2.4.3, the Yotpo_Yotpo module has that directive set in etc/config.xml. The etc/module.xml file in our own custom module would look something like this:
<?xml version="1.0"?> <config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd"> <module name="Cyberic_Csp"> <sequence> <module name="Magento_Csp" /> <!-- The module overwrites our report_only setting --> <module name="Yotpo_Yotpo" /> </sequence> </module> </config>
This is not ideal. So, if you are not using the module causing the problem, just disable or remove it instead of adding it as a dependency to our custom module.
Then run:
bin/magento setup:upgrade
In developer mode, that would be sufficient. In production mode, deploy the static content as well.
Option 3
If for some reason you do not wish to use CSP, you can disable the Magento_Csp module:
bin/magento module:disable Magento_Csp -c
bin/magento setup:di:compile
bin/magento setup:static-content:deploy -f
Now, if we look at the console again, we will notice that the warning message is gone.
Thank you for the sensible critique. Me and my neighbor were just preparing to do a little research about this. We got a grab a book from our local library but I think I learned more from this post. I’m very glad to see such excellent info being shared freely out there.
You’re. welcome.