谷歌驗證碼未捕獲拋出：DOMException：封閉起源「https://www.google.com」

Question

幀我不知道爲什麼發生這種情況，它不是通常的，常見的錯誤：

Uncaught SecurityError: Block a frame with origin.

我得到的錯誤是：

Uncaught DOMException: Blocked a frame with origin " https://www.google.com " from accessing a cross-origin frame.

我跟隨谷歌對如何啓用驗證碼的指令，但它不是爲我工作！

// top of the page 
<script src="https://www.google.com/recaptcha/api.js" async defer></script> 
// then somewhere in the bottom 
<div class="g-recaptcha" data-sitekey="@Model.Register.CaptchaSiteKey"></div> 

我的CaptchaSiteKey正在加載（我調試和檢查）。

Answer 1

The same-origin policy is an important concept in the web application security model. Under the policy, a web browser permits scripts contained in a first web page to access data in a second web page, but only if both web pages have the same origin. An origin is defined as a combination of URI scheme, hostname, and port number. This policy prevents a malicious script on one page from obtaining access to sensitive data on another web page through that page's Document Object Model.

換句話說：recaptcha是一個遠程腳本資源，安全問題，您的網絡服務器不允許使用外部資源的代碼。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Access-Control-Allow-Origin

允許任何資源訪問你的資源，你可以指定：

Access-Control-Allow-Origin: *

爲了讓https://www.google.com訪問你的資源，你可以指定：

Access-Control-Allow-Origin: https://www.google.com

Answer 2

正如這裏的答案https://stackoverflow.com/a/29014899/1853802解釋，改變所有的HTTP（S）協議在頁面上以//

例如

<script src="http://example1.com"></script> => <script src="//example1.com"></script> 

<link href="https://example2.com" /> => <link href="//example2.com /> 

這解決了它對我來說。

注意事項：請記住清除緩存後。