DocumentationCommerceCommerce KB

Dépannage de la page de passage en caisse du storefront dans CSP mode restreint

Last update: Thu May 02 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Créé pour :

  • Developer

Cet article fournit des explications et des correctifs pour les problèmes d’Adobe Commerce 2.4.7 lors de l’affichage de la page de passage en caisse dans CSP restricted mode, avec le Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …" dans le journal de la console du navigateur.

Produits et versions concernés

Adobe Commerce sur l’infrastructure cloud, Adobe Commerce sur site et Magento Open Source :

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

Problème : la page de paiement du storefront est rompue ou ne peut pas se charger

La variable paiement storefront La page est rompue ou ne peut pas se charger, avec le Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …" dans le journal de la console du navigateur.

Étapes à reproduire:

  1. Allez à la vitrine.
  2. Ajoutez un produit au panier et passez au passage en caisse.

Résultats attendus:

La page de passage en caisse se charge entièrement normalement.

Résultats réels:

La page de passage en caisse est vide ou comporte des composants manquants. Les éléments suivants JS s’affiche dans le journal de la console du navigateur : "Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …"

Cause

Dans Adobe Commerce et Magento Open Source versions 2.4.7 et ultérieures, CSP est configuré dans restrict-mode, par défaut, pour les pages de paiement dans les zones storefront et admin, et dans report-only pour toutes les autres pages.
La variable CSP L’en-tête ne contient pas unsafe-inline dans le script-src pour les pages de paiement. En outre, uniquement whitelisted les scripts intégrés sont autorisés.

Solution

Les utilisateurs peuvent rencontrer des erreurs de navigateur en raison du blocage de certains scripts. CSP:

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

Pour résoudre ce problème, vous devez ::

  1. Whitelist les scripts bloqués à l’aide de la fonction SecureHtmlRenderer classe .

  2. Utilisez la variable CSPNonceProvider pour permettre l’exécution des scripts.
    Adobe Commerce et Magento Open Source 2.4.7 et versions ultérieures incluent une Content Security Policy (CSP) nonce fournisseur pour faciliter la génération de nonce pour chaque requête. Ces nonce les chaînes sont ensuite associées à la fonction CSP en-tête .

    Utilisez la variable generateNonce fonction dans Magento\Csp\Helper\CspNonceProvider pour obtenir un nonce chaîne.

    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. Ajouter un hash à la fonction csp_whitelist.xml fichier .

Problème : le mode de paiement est manquant ou ne fonctionne pas

Le mode de paiement est absent ou ne fonctionne pas sur la variable paiement storefront , avec le Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …" dans le journal de la console du navigateur.

Étapes à reproduire:

  1. Allez à la vitrine.
  2. Ajoutez un produit au panier et passez au passage en caisse.
  3. Sélectionnez un mode de paiement.

Résultats attendus:

Vous pouvez sélectionner un mode de paiement et passer une commande avec succès.

Résultats réels:

Le mode de paiement est manquant ou ne fonctionne pas. Les éléments suivants JS s’affiche dans le journal de la console du navigateur : "Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …"

Cause

Dans Adobe Commerce et Magento Open Source versions 2.4.7 et ultérieures, CSP est configuré dans restrict-mode, par défaut, pour les pages de paiement dans les zones storefront et admin, et dans report-only pour toutes les autres pages.
La variable CSP L’en-tête ne contient pas unsafe-inline dans le script-src pour les pages de paiement. En outre, uniquement whitelisted les scripts intégrés sont autorisés.

Solution

Les utilisateurs peuvent rencontrer des erreurs de navigateur en raison du blocage de certains scripts. CSP:

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

Pour résoudre ce problème, vous devez ::

  1. Whitelist les scripts bloqués à l’aide de la fonction SecureHtmlRenderer classe .

  2. Utilisez la variable CSPNonceProvider pour permettre l’exécution des scripts.
    Adobe Commerce et Magento Open Source 2.4.7 et versions ultérieures incluent une Content Security Policy (CSP) nonce fournisseur pour faciliter la génération de nonce pour chaque requête. Ces nonce les chaînes sont ensuite associées à la fonction CSP en-tête .

    Utilisez la variable generateNonce fonction dans Magento\Csp\Helper\CspNonceProvider pour obtenir un nonce chaîne.

    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. Ajouter un hash à la fonction csp_whitelist.xml fichier .

Problème : le client ne peut pas passer de commande

Un client ne peut pas passer de commande, avec le Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …" dans le journal de la console du navigateur.

Étapes à reproduire:

  1. Allez à la vitrine.
  2. Ajoutez un produit au panier et passez au passage en caisse.
  3. Sélectionnez un mode de paiement.
  4. Cliquez sur Passer commande.

Résultats attendus:

Vous pouvez passer une commande avec succès.

Résultats réels:

Vous ne pouvez pas passer commande. Les éléments suivants JS s’affiche dans le journal de la console du navigateur : "Refusé d’exécuter le script intégré, car il enfreint la directive suivante de la politique de sécurité du contenu : "script-src …"

Cause

Dans Adobe Commerce et Magento Open Source versions 2.4.7 et ultérieures, CSP est configuré dans restrict-mode, par défaut, pour les pages de paiement dans les zones storefront et admin, et dans report-only pour toutes les autres pages.
La variable CSP L’en-tête ne contient pas unsafe-inline dans le script-src pour les pages de paiement. En outre, uniquement whitelisted les scripts intégrés sont autorisés.

Solution

Les utilisateurs peuvent rencontrer des erreurs de navigateur en raison du blocage de certains scripts. CSP:

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

Pour résoudre ce problème, vous devez ::

  1. Whitelist les scripts bloqués à l’aide de la fonction SecureHtmlRenderer classe .

  2. Utilisez la variable CSPNonceProvider pour permettre l’exécution des scripts.
    Adobe Commerce et Magento Open Source 2.4.7 et versions ultérieures incluent une Content Security Policy (CSP) nonce fournisseur pour faciliter la génération de nonce pour chaque requête. Ces nonce les chaînes sont ensuite associées à la fonction CSP en-tête .

    Utilisez la variable generateNonce fonction dans Magento\Csp\Helper\CspNonceProvider pour obtenir un nonce chaîne.

    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. Ajouter un hash à la fonction csp_whitelist.xml fichier .

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