Content Security Policy в Magento 2

Наверняка вы, установив Magento 2.3.5 обнаружили в своих браузерных консолях что-то вроде

[Report Only] Refused to load the script ‘***’ because it violates the following Content Security Policy directive: «script-src *». Note that ‘script-src-elem’ was not explicitly set, so ‘script-src’ is used as a fallback.

О том, что делать, расскажу под катом

Введение

Начиная с версии 2.3.5 в Magento появился модуль под названием Magento_CSP. Он отвечает за Content Security Policy, и, собственно, добавляет заголовок Content-Security-Policy, а точнее, пока Content-Security-Policy-Report-Only. Как всегда вовремя и совершенно ожидаемо, при поднятии «фикс» версии 🙂

О том, что такое Content Security Policy и с чем его едят, уже писали на Хабре.

Выбор заголовка Content-Security-Policy или Content-Security-Policy-Report-Only происходит в зависимости от конфиг файла vendor/magento/module-csp/etc/config.xml отдельно для фронт отдельно для админ части.

<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>1</report_only>                 </storefront>                 <admin>                     <report_only>1</report_only>                 </admin>             </mode>         </csp>     </default> </config> 

Там же в директиве «report_uri» можно было бы задать урл для репорта, но т.к. его там нет, то хром нещадно краснит консоль сообщением об его отсутствии.

Как добавить свой урл в полиси?

Создаем файлик в корне папки /etc/ модуля с названием csp_whitelist.xml и контентом

<?xml version="1.0" encoding="UTF-8"?> <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="POLICY_ID">             <values>                 <value id="VALUE_ID" type="TYPE" algorithm="ALGORITHM">SOME DOMAIN</value>             </values>         </policy>     </policies> </csp_whitelist> 

где POLICY_ID один из:

• default-src
• script-src
• object-src
• style-src
• img-src
• media-src
• frame-src
• font-src
• connect-src

VALUE_ID — произвольное уникальное имя
TYPE — тип, может принимать значения domain или hash
ALGORITHM — алгоритм хэширования (при TYPE=hash), например sha256

Давайте посмотрим примеры из интеграционного теста самой Magento:

<?xml version="1.0"?> <!-- /**  * Copyright  Magento, Inc. All rights reserved.  * See COPYING.txt for license details.  */ --> <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="object-src">             <values>                 <value id="mage-base" type="host">https://magento.com</value>                 <value id="hash" type="hash" algorithm="sha256">B2yPHKaXnvFWtRChIbabYmUBFZdVfKKXHbWtWidDVF8=</value>                 <value id="hash2" type="hash" algorithm="sha256">B3yPHKaXnvFWtRChIbabYmUBFZdVfKKXHbWtWidDVF8=</value>             </values>         </policy>         <policy id="media-src">             <values>                 <value id="mage-base" type="host">https://magento.com</value>                 <value id="devdocs-base" type="host">https://devdocs.magento.com</value>             </values>         </policy>     </policies> </csp_whitelist>