DocumentaçãoCommerceKB do Commerce

Solucionar problemas da página de check-out da loja no modo restrito CSP

Last update: Mon Jul 15 2024 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Tópicos:

Criado para:

  • Desenvolvedor

Este artigo fornece explicações e correções para os problemas do Adobe Commerce 2.4.7 ao visualizar a página de check-out em CSP restricted mode, com o script "Recusado a executar em linha porque viola a seguinte diretiva de Política de Segurança de Conteúdo: mensagem de erro "script-src …" no log de console do navegador.

Produtos e versões afetados

Adobe Commerce na infraestrutura em nuvem, Adobe Commerce no local e Magento Open Source:

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

Problema - A página de finalização da loja está quebrada ou não consegue carregar

A página check-out da loja foi desfeita ou não pode ser carregada, com o script embutido "Recusado a executar porque viola a seguinte diretiva de Política de Segurança de Conteúdo: mensagem de erro "script-src …" no log de console do navegador.

Etapas a serem reproduzidas:

  1. Vá para a loja.
  2. Adicione um produto ao carrinho e prossiga para a finalização.

Resultados esperados:

A página de check-out é totalmente carregada normalmente.

Resultados reais:

A página de check-out está em branco ou não contém componentes. O seguinte erro JS é exibido no log do console do navegador: "Recusou-se a executar o script embutido porque ele viola a seguinte diretiva de Política de Segurança de Conteúdo: "script-src …"

Causa

No Adobe Commerce e Magento Open Source versões 2.4.7 e posteriores, o CSP é configurado em restrict-mode, por padrão, para páginas de pagamento nas áreas de vitrine e administração, e no modo report-only para todas as outras páginas.
O cabeçalho CSP correspondente não contém a palavra-chave unsafe-inline dentro da diretiva script-src para páginas de pagamento. Além disso, somente whitelisted scripts integrados são permitidos.

Solução

Os usuários podem ver erros de navegador devido ao bloqueio de determinados scripts por causa de CSP:

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

Para corrigir esse problema, você deve:

  1. Whitelist os scripts bloqueados usando a classe SecureHtmlRenderer.

  2. Use a classe CSPNonceProvider para permitir que scripts sejam executados.
    Adobe Commerce e Magento Open Source 2.4.7 e posterior incluem um provedor Content Security Policy (CSP) nonce para facilitar a geração de cadeias de caracteres nonce exclusivas para cada solicitação. Essas cadeias de caracteres nonce são anexadas ao cabeçalho CSP.

    Use a função generateNonce em Magento\Csp\Helper\CspNonceProvider para obter uma cadeia de caracteres nonce.

    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. Adicione um hash ao arquivo csp_whitelist.xml do módulo.

Problema - O método de pagamento está ausente ou não está funcionando

O método de pagamento está ausente ou não está funcionando na página check-out da loja, com o script "Recusado para executar script embutido porque viola a seguinte diretiva de Política de Segurança de Conteúdo: mensagem de erro "script-src …" no log de console do navegador.

Etapas a serem reproduzidas:

  1. Vá para a loja.
  2. Adicione um produto ao carrinho e prossiga para a finalização.
  3. Selecione um método de pagamento.

Resultados esperados:

Você pode selecionar um método de pagamento e prosseguir para colocar um pedido com sucesso.

Resultados reais:

O método de pagamento está ausente ou não está funcionando. O seguinte erro JS é exibido no log do console do navegador: "Recusou-se a executar o script embutido porque ele viola a seguinte diretiva de Política de Segurança de Conteúdo: "script-src …"

Causa

No Adobe Commerce e Magento Open Source versões 2.4.7 e posteriores, o CSP é configurado em restrict-mode, por padrão, para páginas de pagamento nas áreas de vitrine e administração, e no modo report-only para todas as outras páginas.
O cabeçalho CSP correspondente não contém a palavra-chave unsafe-inline dentro da diretiva script-src para páginas de pagamento. Além disso, somente whitelisted scripts integrados são permitidos.

Solução

Os usuários podem ver erros de navegador devido ao bloqueio de determinados scripts por causa de CSP:

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

Para corrigir esse problema, você deve:

  1. Whitelist os scripts bloqueados usando a classe SecureHtmlRenderer.

  2. Use a classe CSPNonceProvider para permitir que scripts sejam executados.
    Adobe Commerce e Magento Open Source 2.4.7 e posterior incluem um provedor Content Security Policy (CSP) nonce para facilitar a geração de cadeias de caracteres nonce exclusivas para cada solicitação. Essas cadeias de caracteres nonce são anexadas ao cabeçalho CSP.

    Use a função generateNonce em Magento\Csp\Helper\CspNonceProvider para obter uma cadeia de caracteres nonce.

    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. Adicione um hash ao arquivo csp_whitelist.xml do módulo.

Problema - o cliente não pode fazer um pedido

Um cliente não pode fazer um pedido com o script integrado "Recusado a executar porque ele viola a seguinte diretiva de Política de Segurança de Conteúdo: mensagem de erro "script-src …" no log de console do navegador.

Etapas a serem reproduzidas:

  1. Vá para a loja.
  2. Adicione um produto ao carrinho e prossiga para a finalização.
  3. Selecione um método de pagamento.
  4. Clique em Fazer pedido.

Resultados esperados:

Você pode fazer um pedido com sucesso.

Resultados reais:

Você não pode fazer um pedido. O seguinte erro JS é exibido no log do console do navegador: "Recusou-se a executar o script embutido porque ele viola a seguinte diretiva de Política de Segurança de Conteúdo: "script-src …"

Causa

No Adobe Commerce e Magento Open Source versões 2.4.7 e posteriores, o CSP é configurado em restrict-mode, por padrão, para páginas de pagamento nas áreas de vitrine e administração, e no modo report-only para todas as outras páginas.
O cabeçalho CSP correspondente não contém a palavra-chave unsafe-inline dentro da diretiva script-src para páginas de pagamento. Além disso, somente whitelisted scripts integrados são permitidos.

Solução

Os usuários podem ver erros de navegador devido ao bloqueio de determinados scripts por causa de CSP:

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

Para corrigir esse problema, você deve:

  1. Whitelist os scripts bloqueados usando a classe SecureHtmlRenderer.

  2. Use a classe CSPNonceProvider para permitir que scripts sejam executados.
    Adobe Commerce e Magento Open Source 2.4.7 e posterior incluem um provedor Content Security Policy (CSP) nonce para facilitar a geração de cadeias de caracteres nonce exclusivas para cada solicitação. Essas cadeias de caracteres nonce são anexadas ao cabeçalho CSP.

    Use a função generateNonce em Magento\Csp\Helper\CspNonceProvider para obter uma cadeia de caracteres nonce.

    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. Adicione um hash ao arquivo csp_whitelist.xml do módulo.

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