Felsöka utcheckningssidan för butiker i CSP begränsat läge

I den här artikeln ges förklaringar och korrigeringar för Adobe Commerce 2.4.7-problem när du visar utcheckningssidan i CSP restricted mode, med felmeddelandet Nekas att köra infogat skript eftersom det bryter mot följande direktiv för innehållssäkerhetsprincip: "script-src …" i webbläsarkonsolloggen.

Berörda produkter och versioner

Adobe Commerce i molninfrastruktur, Adobe Commerce lokalt och Magento Open Source:

  • 2.4.7
  • 2.4.6-pX
  • 2.4.5-pX
  • 2.4.4-pX

Problem - Utcheckningssidan för Storefront är skadad eller kan inte läsas in

Sidan storefront checkout är trasig eller kan inte läsas in, med felmeddelandet Nekad körning av infogat skript eftersom den bryter mot följande direktiv för innehållssäkerhetsprincip: "script-src …" i webbläsarkonsolloggen.

Steg som ska återskapas:

  1. Gå till butiken.
  2. Lägg en produkt i kundvagnen och fortsätt till kassan.

Förväntade resultat:

Utcheckningssidan läses in helt normalt.

Faktiska resultat:

Utcheckningssidan är tom eller saknar komponenter. Följande JS-fel visas i webbläsarens konsollogg: Avvisad att det infogade skriptet inte kan köras eftersom det bryter mot följande direktiv för säkerhetsprincip för innehåll: "script-src …"

Orsak

I Adobe Commerce och Magento Open Source, version 2.4.7 och senare, är CSP som standard konfigurerat i restrict-mode för betalningssidor i butiks- och administratörsområdet och i report-only-läge för alla andra sidor.
Motsvarande CSP-rubrik innehåller inte nyckelordet unsafe-inline i direktivet script-src för betalningssidor. Dessutom tillåts bara whitelisted textbundna skript.

Lösning

Användare kan se webbläsarfel på grund av att vissa skript blockeras på grund av CSP:

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src

Du måste antingen för att kunna åtgärda problemet:

  1. Whitelist blockerade skript med klassen SecureHtmlRenderer.

  2. Använd klassen CSPNonceProvider om du vill tillåta att skript körs.
    Adobe Commerce och Magento Open Source 2.4.7 och senare innehåller en Content Security Policy (CSP) nonce-provider som gör det enklare att skapa unika nonce -strängar för varje begäran. Dessa nonce strängar kopplas sedan till rubriken CSP.

    Använd funktionen generateNonce i Magento\Csp\Helper\CspNonceProvider för att hämta en nonce-sträng.

    code language-php
    use Magento\Csp\Helper\CspNonceProvider;
    
    class MyClass
    {
    
        /**
         * @var CspNonceProvider
         */
        private $cspNonceProvider;
    
        /**
         * @param CspNonceProvider $cspNonceProvider
         */
        public function __construct(CspNonceProvider $cspNonceProvider)
        {
            $this->cspNonceProvider = $cspNonceProvider
        }
    
        /**
         * Get CSP Nonce
         *
         * @return String
         */
        public function getNonce(): string
        {
            return $this->cspNonceProvider->generateNonce();
        }
    }
    
  3. Lägg till en hash i modulens csp_whitelist.xml-fil.

Problem - Betalningsmetoden saknas eller fungerar inte

Betalningsmetoden saknas eller fungerar inte på storefront-utcheckningssidan, med Refused to execute inline script eftersom den bryter mot följande direktiv för innehållets säkerhetsprincip: "script-src …" error message in the browser console log.

Steg som ska återskapas:

  1. Gå till butiken.
  2. Lägg en produkt i kundvagnen och fortsätt till kassan.
  3. Välj en betalningsmetod.

Förväntade resultat:

Du kan välja en betalningsmetod och fortsätta att göra en beställning.

Faktiska resultat:

Betalningsmetoden saknas eller fungerar inte. Följande JS-fel visas i webbläsarens konsollogg: Avvisad att det infogade skriptet inte kan köras eftersom det bryter mot följande direktiv för säkerhetsprincip för innehåll: "script-src …"

Orsak

I Adobe Commerce och Magento Open Source, version 2.4.7 och senare, är CSP som standard konfigurerat i restrict-mode för betalningssidor i butiks- och administratörsområdet och i report-only-läge för alla andra sidor.
Motsvarande CSP-rubrik innehåller inte nyckelordet unsafe-inline i direktivet script-src för betalningssidor. Dessutom tillåts bara whitelisted textbundna skript.

Lösning

Användare kan se webbläsarfel på grund av att vissa skript blockeras på grund av CSP:

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src

Du måste antingen för att kunna åtgärda problemet:

  1. Whitelist blockerade skript med klassen SecureHtmlRenderer.

  2. Använd klassen CSPNonceProvider om du vill tillåta att skript körs.
    Adobe Commerce och Magento Open Source 2.4.7 och senare innehåller en Content Security Policy (CSP) nonce-provider som gör det enklare att skapa unika nonce -strängar för varje begäran. Dessa nonce strängar kopplas sedan till rubriken CSP.

    Använd funktionen generateNonce i Magento\Csp\Helper\CspNonceProvider för att hämta en nonce-sträng.

    code language-php
    use Magento\Csp\Helper\CspNonceProvider;
    
    class MyClass
    {
    
        /**
         * @var CspNonceProvider
         */
        private $cspNonceProvider;
    
        /**
         * @param CspNonceProvider $cspNonceProvider
         */
        public function __construct(CspNonceProvider $cspNonceProvider)
        {
            $this->cspNonceProvider = $cspNonceProvider
        }
    
        /**
         * Get CSP Nonce
         *
         * @return String
         */
        public function getNonce(): string
        {
            return $this->cspNonceProvider->generateNonce();
        }
    }
    
  3. Lägg till en hash i modulens csp_whitelist.xml-fil.

Problem - Kunden kan inte göra en beställning

En kund kan inte göra en beställning med felmeddelandet Avvisad att köra ett textbundet skript eftersom det bryter mot följande direktiv om innehållets säkerhetsprincip: "script-src …" i webbläsarkonsolloggen.

Steg som ska återskapas:

  1. Gå till butiken.
  2. Lägg en produkt i kundvagnen och fortsätt till kassan.
  3. Välj en betalningsmetod.
  4. Klicka på Montera order.

Förväntade resultat:

Du kan göra en beställning.

Faktiska resultat:

Du kan inte göra en beställning. Följande JS-fel visas i webbläsarens konsollogg: Avvisad att det infogade skriptet inte kan köras eftersom det bryter mot följande direktiv för säkerhetsprincip för innehåll: "script-src …"

Orsak

I Adobe Commerce och Magento Open Source, version 2.4.7 och senare, är CSP som standard konfigurerat i restrict-mode för betalningssidor i butiks- och administratörsområdet och i report-only-läge för alla andra sidor.
Motsvarande CSP-rubrik innehåller inte nyckelordet unsafe-inline i direktivet script-src för betalningssidor. Dessutom tillåts bara whitelisted textbundna skript.

Lösning

Användare kan se webbläsarfel på grund av att vissa skript blockeras på grund av CSP:

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src

Du måste antingen för att kunna åtgärda problemet:

  1. Whitelist blockerade skript med klassen SecureHtmlRenderer.

  2. Använd klassen CSPNonceProvider om du vill tillåta att skript körs.
    Adobe Commerce och Magento Open Source 2.4.7 och senare innehåller en Content Security Policy (CSP) nonce-provider som gör det enklare att skapa unika nonce -strängar för varje begäran. Dessa nonce strängar kopplas sedan till rubriken CSP.

    Använd funktionen generateNonce i Magento\Csp\Helper\CspNonceProvider för att hämta en nonce-sträng.

    code language-php
    use Magento\Csp\Helper\CspNonceProvider;
    
    class MyClass
    {
    
        /**
         * @var CspNonceProvider
         */
        private $cspNonceProvider;
    
        /**
         * @param CspNonceProvider $cspNonceProvider
         */
        public function __construct(CspNonceProvider $cspNonceProvider)
        {
            $this->cspNonceProvider = $cspNonceProvider
        }
    
        /**
         * Get CSP Nonce
         *
         * @return String
         */
        public function getNonce(): string
        {
            return $this->cspNonceProvider->generateNonce();
        }
    }
    
  3. Lägg till en hash i modulens csp_whitelist.xml-fil.

recommendation-more-help
8bd06ef0-b3d5-4137-b74e-d7b00485808a