Risolvere i problemi relativi alla pagina di estrazione della vetrina in CSP modalità con restrizioni

Questo articolo fornisce spiegazioni e correzioni per i problemi di Adobe Commerce 2.4.7 durante la visualizzazione della pagina di pagamento in CSP restricted mode, con "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …" nel registro della console del browser.

Prodotti e versioni interessati

Adobe Commerce su infrastruttura cloud, Adobe Commerce on-premise e Magento Open Source:

  • 2.4.7.
  • 2,4,6-pX
  • 2,4,5-pX
  • 2,4,4-pX

Problema - La pagina Storefront Checkout è danneggiata o non è in grado di essere caricata

Il storefront checkout la pagina è interrotta o non è in grado di caricarla, con il simbolo "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …" nel registro della console del browser.

Passaggi da riprodurre:

  1. Vai alla vetrina.
  2. Aggiungi un prodotto al carrello e procedi al pagamento.

Risultati previsti:

La pagina di pagamento viene caricata completamente normalmente.

Risultati effettivi:

La pagina di pagamento è vuota o non contiene componenti. I seguenti elementi JS viene visualizzato un errore nel registro della console del browser: "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …"

Causa

In Adobe Commerce e Magento Open Source versione 2.4.7 e successive, CSP è configurato in restrict-mode, per impostazione predefinita, per le pagine di pagamento nelle aree vetrina e amministrazione e in report-only per tutte le altre pagine.
Il corrispondente CSP l'intestazione non contiene unsafe-inline parola chiave all'interno del script-src direttiva per le pagine di pagamento. Inoltre, solo whitelisted gli script in linea sono consentiti.

Soluzione

Gli utenti potrebbero visualizzare errori del browser a causa di alcuni script bloccati a causa di CSP:

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

Per risolvere il problema, è necessario::

  1. Whitelist gli script bloccati che utilizzano SecureHtmlRenderer classe.

  2. Utilizza il CSPNonceProvider classe per consentire l'esecuzione di script.
    Adobe Commerce e Magento Open Source 2.4.7 e versioni successive includono Content Security Policy (CSP) nonce per facilitare la generazione di nonce stringhe per ogni richiesta. Questi nonce le stringhe vengono quindi collegate al CSP intestazione.

    Utilizza il generateNonce funzione in Magento\Csp\Helper\CspNonceProvider per ottenere un nonce stringa.

    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. Aggiungi un hash al modulo di csp_whitelist.xml file.

Problema - Il metodo di pagamento è mancante o non funziona

Metodo di pagamento mancante o non funzionante nel storefront checkout , con "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …" nel registro della console del browser.

Passaggi da riprodurre:

  1. Vai alla vetrina.
  2. Aggiungi un prodotto al carrello e procedi al pagamento.
  3. Seleziona un metodo di pagamento.

Risultati previsti:

Puoi selezionare un metodo di pagamento e procedere con l’ordine.

Risultati effettivi:

Metodo di pagamento mancante o non funzionante. I seguenti elementi JS viene visualizzato un errore nel registro della console del browser: "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …"

Causa

In Adobe Commerce e Magento Open Source versione 2.4.7 e successive, CSP è configurato in restrict-mode, per impostazione predefinita, per le pagine di pagamento nelle aree vetrina e amministrazione e in report-only per tutte le altre pagine.
Il corrispondente CSP l'intestazione non contiene unsafe-inline parola chiave all'interno del script-src direttiva per le pagine di pagamento. Inoltre, solo whitelisted gli script in linea sono consentiti.

Soluzione

Gli utenti potrebbero visualizzare errori del browser a causa di alcuni script bloccati a causa di CSP:

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

Per risolvere il problema, è necessario::

  1. Whitelist gli script bloccati che utilizzano SecureHtmlRenderer classe.

  2. Utilizza il CSPNonceProvider classe per consentire l'esecuzione di script.
    Adobe Commerce e Magento Open Source 2.4.7 e versioni successive includono Content Security Policy (CSP) nonce per facilitare la generazione di nonce stringhe per ogni richiesta. Questi nonce le stringhe vengono quindi collegate al CSP intestazione.

    Utilizza il generateNonce funzione in Magento\Csp\Helper\CspNonceProvider per ottenere un nonce stringa.

    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. Aggiungi un hash al modulo di csp_whitelist.xml file.

Problema - Il cliente non può effettuare un ordine

Un cliente non è in grado di effettuare un ordine, con il "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …" nel registro della console del browser.

Passaggi da riprodurre:

  1. Vai alla vetrina.
  2. Aggiungi un prodotto al carrello e procedi al pagamento.
  3. Seleziona un metodo di pagamento.
  4. Clic Inserisci ordine.

Risultati previsti:

Puoi effettuare un ordine con successo.

Risultati effettivi:

Non sei in grado di fare un ordine. I seguenti elementi JS viene visualizzato un errore nel registro della console del browser: "Si è rifiutato di eseguire lo script in linea perché viola la seguente direttiva del criterio sulla sicurezza dei contenuti: "script-src …"

Causa

In Adobe Commerce e Magento Open Source versione 2.4.7 e successive, CSP è configurato in restrict-mode, per impostazione predefinita, per le pagine di pagamento nelle aree vetrina e amministrazione e in report-only per tutte le altre pagine.
Il corrispondente CSP l'intestazione non contiene unsafe-inline parola chiave all'interno del script-src direttiva per le pagine di pagamento. Inoltre, solo whitelisted gli script in linea sono consentiti.

Soluzione

Gli utenti potrebbero visualizzare errori del browser a causa di alcuni script bloccati a causa di CSP:

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

Per risolvere il problema, è necessario::

  1. Whitelist gli script bloccati che utilizzano SecureHtmlRenderer classe.

  2. Utilizza il CSPNonceProvider classe per consentire l'esecuzione di script.
    Adobe Commerce e Magento Open Source 2.4.7 e versioni successive includono Content Security Policy (CSP) nonce per facilitare la generazione di nonce stringhe per ogni richiesta. Questi nonce le stringhe vengono quindi collegate al CSP intestazione.

    Utilizza il generateNonce funzione in Magento\Csp\Helper\CspNonceProvider per ottenere un nonce stringa.

    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. Aggiungi un hash al modulo di csp_whitelist.xml file.

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