Magento 2 Content Security Policy (CSP) Whitelist Manager

Installation and User Guide for Magento 2 Content Security Policy (CSP) Whitelist Manager

Table of Contents

  1. Installation

    • Download Extension

    • Installation via app/code

    • Installation via Composer

  2. Configuration Settings for Content Security Policy (CSP) Whitelist

    • General Settings

    • CSP Directives

    • Critical Security Overrides

  3. Working of the extension

    • Steps to Check and Fix Console CSP Errors

Installation

  • Download Extension: Once you have placed the order from our site then go to My Account section and click on My Downloadable Products and download the extension package.

  • Installation via app/code: Upload the content of the module to your root folder. This will not overwrite the existing Magento folder or files, only the new contents will be added. After the successful upload of the package, run below commands on Magento 2 root directory.

php bin/magento setup:upgrade
php bin/magento setup:di:compile
php bin/magento setup:static-content:deploy en_GB en_US
  • Installation via Composer: Please follow the guide provided in the below link to complete the installation via composer.

Installation Via Composer

Configuration Settings for Content Security Policy (CSP) Whitelist

Go to Admin > Stores > Configuration > Scommerce Configuration > CSP Whitelist

General Settings

  • IMPORTANT INFORMATION- When adding or changing whitelist, ensure to include only those domains that are recognized and trustworthy. This precaution is crucial because unauthorized or compromised domains may contain malicious scripts.

  • Enabled – Select “Yes” or “No” to enable or disable the module.

  • License Key – Please add the license for the extension which is provided in the order confirmation email. Please note license keys are site URL specific. If you require license keys for dev/staging sites then please email us at support@scommerce-mage.com.

  • Report Only Mode - Set "Yes" to enable Report Only mode for CSP ( it will only report CSP vulnerabilities in the browser console and Set "No" to enable Strict Mode ( it will prevent data from loading or code from getting executed to prevent vulnerabilities).

CSP Directives

  • Default Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for default-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Base Uri

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for base-uri

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Child Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for child-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Connect Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for connect-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Font Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for font-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Form Action

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for form-action

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Frame Ancestors

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for frame-ancestors

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Frame Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for frame-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Img Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for img-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Manifest Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for manifest-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Media Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for media-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Object Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for object-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Script Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for script-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

  • Style Src

    • Enabled- Select “Yes” or “No” to enable or disable csp whitelist for style-src

    • Whitelist entries- Please add URLs that you want to whitelist. By default, the type of entry added would be host. You can also delete this entry and add multiple entries.

Critical Security Overrides

  • Enable Unsafe Inline Script-This setting permits the execution of unsafe inline scripts, which can be introduced by your developers / third party extensions / attackers. Make sure you assess these unsafe inline scripts before setting this to YES.

    Caution: Enabling unsafe inline scripts is a temporary measure and should only be done under the guidance of your developer. You must ask your developers or third party extension providers to whitelist their inline scripts. This setting must NOT be left on 'YES' permanently, as it significantly increases the risk of security vulnerabilities, making your site an easy target for attackers. Always prioritise the security of your site and user data.

Working of the extension

Steps to Check and Fix Console CSP Errors

  • Check the errors present in the frontend's console.

  • Check the source of these errors.

  • Check the URL present in these errors.

  • In the backend, add the URL to the source to which that error belongs to.

  • You would no longer see the error on the frontend

If you have a question related to this extension please check out our FAQ Section first. If you can't find the answer you are looking for then please contact support@scommerce-mage.com.

Last updated