Magento 2.4.1 Custom Content Security Policy (CSP) whitelist for connect-src not Working

Question

I created a whitelist for content-src CSP like this:

   <policy id="connect-src">
        <values>
            <value id="cloudflare" type="host">*.cloudflare.com</value>
            <value id="freshrelevance" type="host">*.freshrelevance.com</value>
            <value id="ga" type="host">*.google-analytics.com</value>
        </values>
    </policy>

but the console log always shows this error:

[Report Only] Refused to connect to 'wss://am.freshrelevance.com/' because it violates the following Content Security Policy directive: "connect-src geostag.cardinalcommerce.com geo.cardinalcommerce.com 1eafstag.cardinalcommerce.com 1eaf.cardinalcommerce.com centinelapistag.cardinalcommerce.com centinelapi.cardinalcommerce.com *.amazon.com *.amazon.co.uk *.amazon.co.jp *.amazon.jp *.amazon.it *.amazon.fr *.amazon.es *.amazonpay.com *.amazonpay.co.uk *.amazonpay.co.jp *.amazonpay.jp *.amazonpay.it *.amazonpay.fr *.amazonpay.es mws.amazonservices.com mws.amazonservices.co.uk mws.amazonservices.co.jp mws.amazonservices.jp mws.amazonservices.it mws.amazonservices.fr mws.amazonservices.es *.trackedlink.net *.trackedweb.net *.dotdigital-pages.com api.comapi.com webchat.dotdigital.com *.cloudflare.com *.freshrelevance.com *.google-analytics.com 'self' 'unsafe-inline'".

the others whitelisted just fine

Answer 1

Test to use the full link in your 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="connect-src">
            <values>
                <value id="freshrelevance" type="host">wss://am.freshrelevance.com/</value>
            </values>
        </policy>
    </policies>
</csp_whitelist>

It works fins in my case when I try:

<script>
    var ws = new WebSocket("wss://am.freshrelevance.com/");
</script>