The Content-Security-Policy directive 'frame-ancestors' does not support the source expression ''unsafe-inline'' for allowed site

Question

I am working on a Magento 2 site with a custom extension to add a whitelist to Magento's CSP. I am running into an issue with the following error: "The Content-Security-Policy directive 'frame-ancestors' does not support the source expression ''unsafe-inline''"

The source of this issue is the following file: https://translate.googleapis.com/element/TE_20210503_00/e/js/element/element_main.js

The problem is, I have this site whitelisted under frame-ancestors, yet it's still being blocked. Here is the policy I have so far:

<policy id="frame-ancestors">
    <values>
        <value id="google-apis" type="host">*.googleapis.com</value>
    </values>
</policy>

This is the same format I have for all other policies and all those policies have been whitelisted correctly. This is the only one that isn't being affected.

I have followed this tutorial for making my CSP extension, for reference: https://magento.stackexchange.com/a/312350/73083

I'm not sure what I am doing wrong, this is the last issue I need to fix before adding CSP to the site.

Answer 1

It has mentioned in 2.4.3 release Magento doc., this is still a known issue with Magento: https://devdocs.magento.com/guides/v2.4/release-notes/open-source-2-4-3.html#known-issues. So, we can do is a temporary fix for being time.

The solution is to creating own custom module to extending the Magento_Csp module. In the etc/config.xml file we want to modify the frame-ancestor policy and set it to 0.

<?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>
        <policies>
            <storefront>
                <frame-ancestors>
                    <inline>0</inline>
                </frame-ancestors>
            </storefront>
            <admin>
                <frame-ancestors>
                    <inline>0</inline>
                </frame-ancestors>
            </admin>
        </policies>
    </csp>
</default>

Then run:

bin/magento s:up
bin/magento s:s:d -f
bin/magento c:f

This will help it's a working solution.

Happy Coding!!