在CSP限制模式下创建订单页疑难解答
本文针对Adobe Commerce 2.4.7问题提供了解释和修复,当在管理员端使用 CSP restricted mode 创建订单时,该订单处于 Enabled 状态,并且“Refused to execute inline script,因为它违反了以下内容安全策略指令:“script-src …” 浏览器控制台日志中的错误消息。
受影响的产品和版本
云基础架构上的Adobe Commerce、内部部署的Adobe Commerce和Magento Open Source:
- 2.4.7
- 2.4.6-pX
- 2.4.5-pX
- 2.4.4-pX
问题 — 管理员 创建订单 页面已损坏或无法加载
管理员 创建订单 页面已损坏或无法加载,因为“拒绝执行内联脚本,因为它违反了以下内容安全策略指令:“script-src …” 浏览器控制台日志中的错误消息。
重现步骤:
- 转到Sales > Orders。
- 创建新订单。
预期的结果:
管理员 创建订单 页面将正常完全加载。
实际结果:
管理员 创建订单 页面为空或缺少组件。 浏览器控制台日志中显示以下JS错误: “拒绝执行内联脚本,因为它违反了以下内容安全策略指令: "script-src …"
原因
在Adobe Commerce和Magento Open Source版本2.4.7及更高版本中,CSP默认在restrict-mode中针对店面和管理区域中的付款页面进行配置,在所有其他页面中则以report-only模式进行配置。在付款页的script-src指令中,相应的 CSP 标题不包含unsafe-inline关键字。 此外,只允许使用whitelisted内联脚本。
解决方案
由于某些脚本因CSP而被阻止,用户可能会看到浏览器错误:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src
要解决此问题,您必须:
-
Whitelist使用
SecureHtmlRenderer类阻止的脚本。 -
使用
CSPNonceProvider类允许执行脚本。Adobe Commerce和Magento Open Source 2.4.7及更高版本包含一个Content Security Policy (CSP) nonce提供程序,以便为每个请求生成唯一的nonce字符串。 然后将这些nonce字符串附加到CSP标头。在
Magento\Csp\Helper\CspNonceProvider中使用generateNonce函数获取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(); } } -
将 hash添加到模块的
csp_whitelist.xml文件。
问题 — 付款方法缺失或无法正常工作
管理员 订单创建页面 上缺少付款方法或付款方法不起作用,带有“拒绝执行内联脚本,因为它违反了以下内容安全策略指令:“script-src …” 浏览器控制台日志中的错误消息。
重现步骤:
- 转到Sales > Orders。
- 创建新订单。
- 创建新客户。
- 输入客户详细信息。
- 输入订单详细信息(产品、发运方法)。
- 选择付款方式。
预期的结果:
您可以选择付款方式并继续成功下单。
实际结果:
付款方式缺失或无法正常工作。 浏览器控制台日志中显示以下JS错误: “拒绝执行内联脚本,因为它违反了以下内容安全策略指令: "script-src …"。
原因
在Adobe Commerce和Magento Open Source版本2.4.7及更高版本中,CSP默认在restrict-mode中针对店面和管理区域中的付款页面进行配置,在所有其他页面中则以report-only模式进行配置。在付款页的script-src指令中,相应的 CSP 标题不包含unsafe-inline关键字。 此外,只允许使用whitelisted内联脚本。
解决方案
由于某些脚本因 CSP 而被阻止,用户可能会看到浏览器错误:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src
要解决此问题,您必须:
-
Whitelist使用
SecureHtmlRenderer类阻止的脚本。 -
使用
CSPNonceProvider类允许执行脚本。Adobe Commerce和Magento Open Source 2.4.7及更高版本包含一个Content Security Policy (CSP) nonce提供程序,以便为每个请求生成唯一的nonce字符串。 然后将这些nonce字符串附加到CSP标头。在
Magento\Csp\Helper\CspNonceProvider中使用generateNonce函数获取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(); } } -
将 hash添加到模块的
csp_whitelist.xml文件。
问题 — 管理员无法下订单
管理员无法在管理员 创建订单页面 上提交订单,因为“Refused to execute inline script,因为它违反了以下内容安全策略指令:“script-src …” 浏览器控制台日志中的错误消息。
重现步骤:
- 转到Sales > Orders。
- 创建新订单。
- 创建新客户。
- 输入客户详细信息。
- 输入订单详细信息(产品、发运方法)。
- 选择付款方式。
- 提交订单。
预期的结果:
您可以成功提交订单。
实际结果:
您无法提交订单。 浏览器控制台日志中显示以下JS错误: “拒绝执行内联脚本,因为它违反了以下内容安全策略指令: "script-src …"
原因
在Adobe Commerce和Magento Open Source版本2.4.7及更高版本中,CSP默认在restrict-mode中针对店面和管理区域中的付款页面进行配置,在所有其他页面中则以report-only模式进行配置。在付款页的script-src指令中,相应的 CSP 标题不包含unsafe-inline关键字。 此外,只允许使用whitelisted内联脚本。
解决方案
由于某些脚本因 CSP 而被阻止,用户可能会看到浏览器错误:
Refused to execute inline script because it violates the following Content Security Policy directive: "script-src
要解决此问题,您必须:
-
Whitelist使用
SecureHtmlRenderer类阻止的脚本。 -
使用
CSPNonceProvider类允许执行脚本。Adobe Commerce和Magento Open Source 2.4.7及更高版本包含一个Content Security Policy (CSP) nonce提供程序,以便为每个请求生成唯一的nonce字符串。 然后将这些nonce字符串附加到CSP标头。在
Magento\Csp\Helper\CspNonceProvider中使用generateNonce函数获取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(); } } -
将 hash添加到模块的
csp_whitelist.xml文件。