ローカルのGhostインスタンスにローカルのDiscourseを埋め込めない

こんにちは、

ローカルの Ghost インストールで Discourse を試してみたいと考えています。

基本的には、できるだけ簡単な方法でセットアップしました。「Docker を使用した Discourse の開発環境構築入門ガイド」に従い、Ghost はその CLI を使ってセットアップしました。

Ghost は localhost:2368 で、Discourse は localhost:9292 で動作しています。

カスタマイズ/埋め込みの「許可されたホスト」に localhost:2368 を追加しました(クラス名、パスの許可リスト、カテゴリへの投稿などの設定は行なっていません)。

コードスニペットを追加し(もちろんプレースホルダーも適切に置き換えました)、Discourse の埋め込みが表示され「議論を読み込んでいます…」と表示されますが、数秒後にコンソールエラーがログ出力されます。

‘DOMWindow’ 上の ‘postMessage’ の実行に失敗しました:提供されたターゲットオリジン (‘http://localhost:9292’) が、受信ウィンドウのオリジン (‘http://localhost:2368’) と一致しません。

何が不足しているのでしょうか?

ありがとうございます!

「いいね!」 2

(専門家やチームメンバーではありません)

そのエラーは、iframe が読み込まれていない場合に発生します。

localhost:2368 を許可されたホストに追加する際は、末尾のスラッシュの有無やワイルドカードを使って試してみてください。

発生しているのは、ページ自体は読み込まれるものの、その外へリンクするコンテンツが一切読み込まれず、結果として読み込みが破綻している状態です。

とはいえ、私も近々 Ghost を試してみたいと考えていたので、このトピックをフォローさせていただきます。これであなたが直面する唯一の問題であることを願っています。:slight_smile:

「いいね!」 1

残念ながら、まだ解決策は見つかりませんでした :frowning:

「いいね!」 1

非標準ポートで本番環境を実行しようとしているようですが、Discourse ではこれはサポートされていません。

「いいね!」 2

本番インスタンスですか?開発用にローカルにDiscourseをインストールするガイドに従ったのですが、これはローカル使用のための適切なインストールではないのでしょうか?インストール自体は問題なく動作しますが、埋め込み部分でトラブルが発生しています。

「いいね!」 1

実際のホスト名を使用して、ポートではなくこれをテストする方法を見つける必要があると思います。

「いいね!」 2

なるほど、nginx でプロキシを設定してみますね。ありがとうございます。

「いいね!」 1

Ghost と Discourse 用に 2 つの nginx プロキシ(それぞれ ghost.localhostdiscourse.localhost で動作)を追加しようとしましたが、すべての URL をプロキシに変更したところ、以下のエラーが発生するようになりました。

Failed to execute ‘postMessage’ on ‘Window’: Invalid target origin ‘’ in a call to ‘postMessage’.

discourseUrlhttp://discourse.localhost/ ではなく http://localhost:9292/ を使用するとエラーは発生しなくなりますが、コメントが無限ループに陥り(「Loading discussions」が永遠に表示され、数秒ごとにいくつかのリクエストが送信され続ける)、正常に動作しません。

nginx の設定は比較的シンプルです。

server {
  listen 80;
  server_name discourse.localhost;

  access_log /var/log/nginx/discourse.localhost-access.log;
  error_log /var/log/nginx/discourse.localhost-error.log;
  
  location / {
    proxy_pass         http://127.0.0.1:9292;
    proxy_set_header   X-Forwarded-For $remote_addr;
    proxy_set_header   Host $http_host;
  }
}

Ghost 用の設定も同様ですが、discourse の代わりに ghost を使用します。