Google Picker拒绝加载并显示错误“无法在"DOMWindow"上执行"postMessage":提供了目标来源". [英] Google Picker refuses to load with error "Failed to execute 'postMessage' on 'DOMWindow': The target origin provided"

问题描述

我正在尝试加载Google Picker.

I am trying to load Google Picker.

我正在使用此npm软件包 https://www.npmjs.com/package/google-picker

I am using this npm package https://www.npmjs.com/package/google-picker

在加载选择器时，将显示身份验证窗口，我可以选择我的Google帐户.

When loading the picker, the auth windows show up, and I can select my Google account.

完成身份验证后，它将尝试打开Goog​​le Picker iframe.

After auth is done, it tries to open the Google Picker iframe.

此时，iframe无法加载，但出现错误

It is at this point the iframe fails to load and I get the error

无法在"DOMWindow"上执行"postMessage":提供的目标来源("https://docs.google.com")与收件人窗口的来源不匹配

我已经搜索了此问题，许多解决方案都说请确保将您的域添加到Google控制台中的授权JS来源中

I have searched this issue and many solutions say make sure to add your domain to the authorized JS origins in google console

我已经做到了！该域肯定在客户端的授权域中.Google登录可与我的应用一起使用..但是我似乎无法使Picker正常工作.

I have done this! The domain is definitely in the authorized domains for the client. Google sign in works with my app.. but I just can't seem to get the Picker to work.

我尝试了从本地主机运行并上传到服务器.但是我遇到了同样的错误.

I have tried both running from localhost and uploading to the server. But I get the same error.

我正在使用的服务器是HTTPS.选择器的iframe网址也是HTTPS.因此，这应该不是问题.

The server I am using is HTTPS. And the iframe URL for picker is HTTPS too. So this should not be a problem.

我还能尝试什么?我没有选择.我完全遵循API.我已经输入了所有正确的键.

What else can I try? I am out of options. I am following the API exactly. I have put in all the right keys.

推荐答案

Google Picker未显示的原因实际上与控制台错误无关.

The reason Google Picker was not showing was actually unrelated to the console error.

即使出现控制台错误，选择器仍然有效.

Even though the console error appeared, the picker still works.

但是我认为它不起作用，因为我使用的Pickadate库具有与Google Picker冲突的CSS.

But I thought it was not working because I was using the pickadate library which had css that conflicts with Google Picker.

有关此问题的更多信息，请参见: https://github.com/amsul/pickadate.js/issues/619

More info about that issue here: https://github.com/amsul/pickadate.js/issues/619

这篇关于Google Picker拒绝加载并显示错误“无法在"DOMWindow"上执行"postMessage":提供了目标来源".的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！