Google Picker拒绝加载错误“未能在'DOMWindow'上执行'postMessage'：目标原点提供了”

Question

我想加载Google Picker。

我用这NPM包https://www.npmjs.com/package/google-picker

当装载选择器中，auth窗口显示出来，而且我可以选择我的谷歌帐户。

验证完成后，它会尝试打开Goog​​le Picker iframe。

正是在这一点上的iframe加载失败，我得到

Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('https://docs.google.com') does not match the recipient window's origin

我已经搜索这个问题，很多解决方案，说确保您的域名添加到谷歌授权的JS起源错误控制台

我已经做到了！该域名肯定位于客户的授权域中。 Google登录与我的应用程序一起工作..但我似乎无法让Picker工作。

我已经尝试从本地主机运行并上传到服务器。但我得到同样的错误。

我使用的服务器是HTTPS。而选取器的iframe网址也是HTTPS。所以这不应该是一个问题。

我还能试试吗？我没有选择。我正在跟踪API。我已经把所有正确的钥匙。

Answer 1

原因谷歌选择器中不显示竟是无关的控制台错误。

即使控制台出现错误，选取器仍然可以正常工作。

但我认为这是行不通的，因为我使用的pickadate库的css与Google Picker冲突。 https://github.com/amsul/pickadate.js/issues/619

Answer 2

从这个SO post answer，它被引用的问题是与目标来源是https。

我认为这是一个问题，目标原点是https。我 怀疑这是因为你的iFrame url使用http而不是 https。尝试更改要嵌入的文件的网址为 为https。

例如：

var id = getId(url); 
    return '//www.youtube.com/embed/' + id + '?showinfo=0&enablejsapi=1&origin=http://localhost:9000'; 
} 

是：

var id = getId(url); 
    return 'https://www.youtube.com/embed/' + id + '?showinfo=0&enablejsapi=1&origin=http://localhost:9000'; 
}