无法执行 'postMessage' on 'DOMWindow'

我已经在论坛上搜索了此问题的答案,并尝试了几种不同的发布选项。

我正在 Digital Ocean Droplet 上运行一个 Ghost 出版物,并在另一个 Digital Ocean Droplet 上运行一个 Discourse 论坛,因为论坛共识似乎是您不应该在同一台服务器上安装两个应用程序。

forum.mysite dot com
mysite dot com

我希望 Discourse 评论出现在每个帖子中,并且我没有 mysite.com/blog URL slug。因此,我遵循了文档,以获取当前站点 URL 并将其用作嵌入 URL。

遵循此处的文档:官方集成文档

我能够在新帖子上显示框架。但是,它没有加载并显示以下错误:
Failed to execute 'postMessage' on 'DOMWindow': The target origin provided ('<URL>') does not match the recipient window's origin ('<URL>').

我已确认我的 HTTPS 设置是正确的。我的嵌入 URL 模仿了教程,但我尝试了几种不同的 discourseEmbedUrl:变体来尝试进行故障排除。所有对当前文章 URL 的引用都会导致相同的错误。

我还尝试添加一个等待函数,认为框架可能没有加载,但相同的错误仍然存在。

这是我当前的嵌入代码:

<div id='discourse-comments'></div>
<meta name='discourse-username' content='JosephPaul'>

<script type="text/javascript">
  DiscourseEmbed = {
    discourseUrl: 'https://forum.mysite.com/',
    discourseEmbedUrl: '{{url absolute="true"}}',
    // className: 'CLASS_NAME',
  };

  (function() {
    var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
    d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
  })();
</script>

如果您能在此提供任何帮助,我将不胜感激,因为我已经用尽了所有发布的解决方案。我认为这可能与我的论坛和文章在不同的机器上有关。

1 个赞

你好 @Joseph3 :wave: 欢迎来到 Discourse Meta :slight_smile:

你看到这个话题了吗?

2 个赞

嗨 Lilly,是的,我也遵循了该教程,以仔细检查 ghost 托管的 discourse 安装是否相同。

我已经尝试使用如下的 URL 引用:

discourseEmbedUrl: 'https://mysite.com<%= current_page.url %>'

那里有什么不对吗?

另外,但结果是相同的错误。感谢您的及时回复。

1 个赞

这是一个相当常见的错误:Search results for 'Failed to execute 'postMessage' on 'DOMWindow'。这是一个渺茫的希望,但导致错误的一个可能原因是没有填写' - Discourse Meta Discourse 嵌入设置页面上的“创建主题的用户名”设置。

这不应该引起问题。

可能引起问题的是,如果您的 Discourse 站点是私有的:Embed Discourse comments on another website via Javascript

2 个赞

您好 Simon,我最初遇到的问题是 Discourse 管理面板中的主题创建用户名不正确。但我已将其修复为在面板以及以下位置都显示 JosephPaul:
<meta name='discourse-username' content='JosephPaul'>

据我所知,这些都是正确的。

我也查看了您发送的第二个链接,我认为一切都正确。我刚尝试将我的 Discourse 站点设置为不需要登录,但这并没有解决问题。

即使是新生成的帖子也存在此问题。

编辑:
我再次尝试按照上面帖子中的建议更改嵌入式 URL。以下代码会重现此错误:

<script type="text/javascript">

setTimeout(5000)
  DiscourseEmbed = {
    discourseUrl: 'https://forum.josephpaul.com/',
    discourseEmbedUrl: 'https://josephpaul.com{{page.url}}' };

  (function() {
    var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
    d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
  })();
</script>

额外的故障排除尝试,遵循 Simon 的帖子:

我已将嵌入式 URL 设置为也包含 www.,正如一位用户建议的那样。现在出现以下错误:

Referer:`https://josephpaul.com/test-post/`
Referer 要么未发送,要么与以下任何主机都不匹配:

josephpaul.com
1 个赞

西蒙,你有什么想法吗?如果你需要任何输出或代码示例,我很乐意提供。

给我发一封私人消息,附上你嵌入代码的博客文章链接,我会看看。

为了缩小问题的原因范围,如果你能尝试添加你的 Discourse 嵌入页面上的嵌入代码,而无需进行任何修改,只需将 EMBED_URL 替换为博客页面的 URL,那就太好了。

2 个赞

嗨 Simon,当然,我很乐意发送代码片段以及指向实时网站的链接。我该如何在 Discourse 上私信?也许我的信任级别不够高。

文档说点击我的名字会弹出一个消息窗口,但我这边看不到。

再次感谢您到目前为止的帮助!我一定会根据最终的解决方案更新我的问题。

解决方案已找到 - 感谢 @simon@Lilly 提供的出色支持体验。

根据 Simon 的建议进行的修改:

修改了教程中的代码,不包含已弃用的术语并添加了 if 语句:

<div id='discourse-comments'></div>
<meta name="discourse-username" content="ForumAdminName">

<script type="text/javascript">
  if (window.location.pathname.indexOf('/p/') < 0) {
  DiscourseEmbed = {
    discourseUrl: 'https://forum.test.com/',
    discourseEmbedUrl: '{{url absolute="true"}}',
    // className: 'CLASS_NAME',
  };

  (function() {
    var d = document.createElement('script'); d.type = 'text/javascript'; d.async = true;
    d.src = DiscourseEmbed.discourseUrl + 'javascripts/embed.js';
    (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(d);
  })();
}
</script>

另外,添加了 https://www.test.comhttps://test.com
到 Discourse 管理员 > 设置选项卡中找到的 Discourse 站点的内容安全策略 src 设置。

注意 - 根据我的经验,在小型服务器上过快地刷新页面,可能需要大约 30 秒才能看到结果,因此请给每次 ghost 重启和 Discourse 管理面板编辑一些时间来生效。

补充说明 - 首次查看任何文章的评论部分时,会有很长的延迟,@simon 建议您自己先查看文章,以便 Discourse 有时间生成与论坛帖子相关的评论部分。

再次感谢大家,非常有帮助。在我观看的教程中,许多 YouTube 评论者遇到了和我一样的问题,这些问题都引用了 discourse/ghost 集成说明。YouTube 链接可能已弃用,因此这次帮助非常棒。

4 个赞

很高兴你现在已经解决了。 :+1: 嵌入式有点棘手,因为它在每个设置中并不完全相同。感谢你分享你的经验,我从中受益匪浅。另外,@simon 太棒了,他是我认识的最好、最聪明、最有帮助的人之一。而且他碰巧也很擅长 Discourse。 :slight_smile:

3 个赞

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.