【问题标题】:ReCAPTCHA2 script load error due to Security Policy directive由于安全策略指令,ReCAPTCHA2 脚本加载错误
【发布时间】:2025-12-10 21:10:01
【问题描述】:

在我的Angular 应用程序中,当我尝试使用reCAPTCHA2 时出现以下错误。

vendor.js:184374 Refused to load the script 'https://www.google.com/recaptcha/api.js?onload=ngx_captcha_onload_callback&render=explicit&hl=en' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline' 'unsafe-eval'". Note that 'script-src-elem' was not explicitly set, so 'script-src' is used as a fallback.

我正在使用这个 Angular 变体 - https://enngage.github.io/ngx-captcha/

我该如何解决这个问题?我当前的安全策略是contentSecurityPolicy = "default-src 'self' ; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline' ;img-src 'self' data: ; worker-src blob:"

我不想对所有类型的脚本打开 Web 应用程序。

【问题讨论】:

标签: angular6 recaptcha content-security-policy


【解决方案1】:

尝试像这样修改它:

contentSecurityPolicy = "default-src 'self' https://www.gstatic.com/recaptcha/ https://www.gstatic.com/recaptcha/ ; script-src 'self' 'unsafe-inline' 'unsafe-eval'; style-src 'self' 'unsafe-inline' ;img-src 'self' data: ; worker-src blob:"

我刚刚添加了:

 https://www.gstatic.com/recaptcha/ https://www.gstatic.com/recaptcha/ 

【讨论】:

  • 谢谢。我添加了script-src https://www.google.com/recaptcha/ https://www.gstatic.com/recaptcha/ 和`frame-src google.com/recaptcha`,这与您的答案非常接近。我想你的也可以。
  • 嗨,你错过了www 和斜杠,它是should be frame-src www.google.com/recaptcha//recaptcha/ 是文件夹名,不是文件名)。同时使用 www 和非 www 变体可能更安全。
最近更新 更多