トピックで外部で公開されている画像を読み込むようにmeta og:imageの画像ソースを上書きしますか?

基本的には、プラグイン作成者 @merefield との私の問題と議論はここで見ることができます。

彼は、Discourse チームにこの処理を依頼するよう私に推奨しています。

私は常にサイト上で外部 CDN 画像を使用しており、ローカルアップロードやオブジェクトストレージにはアップロードしません。なぜなら、画像をローカルまたは S3 バケットに保存するのは高価すぎるからです。

現在、私の meta og:image タグがこれらの画像を認識していないことがわかります。例:How Many Carbs on Keto? - How To Discuss

この画像は実際には外部の公開 URL から IMG SRC として読み込まれています。しかし、ソーシャルメディアの Open Graph は常にフォールバック画像として私のサイトロゴを表示しており、これは望ましくありません。

このコアとなる Discourse の動作のため、トピックリストプレビュープラグインもこれらのサムネイル画像を検出できていません。

外部でアップロードした画像を強制的に使用するように meta og:image タグを上書きするにはどうすればよいでしょうか?

そうすれば、ソーシャルメディアサイトで共有する際に、私のサイトフォーラムのロゴではなく、実際のトピック画像を表示できるようになります。例:https://developers.facebook.com/tools/debug/?q=https%3A%2F%2Fhowtodiscuss.com%2Ft%2Fis-yoga-a-good-workout%2F28043

私はトピックページに以下の行を追加して強制的に設定しようと試みました。

<meta property="og:image" content="https://images.pexels.com/photos/4761347/pexels-photo-4761347.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500" />

しかし、ページのソースを確認すると、og:image タグは依然としてフォールバックとして私のサイトロゴを使用しており、このトピックに画像がないと認識しているようです :frowning:

どのトピックの最初の投稿にある最初の画像は、その画像が何らかの公開 URL にホストされていたとしても、meta og:image タグによって取得されるべきです。現在、画像が自分のサーバーにアップロードされている場合のみ認識されます。しかし、多くのユーザーは画像ホスティングを自分で行うことが高価すぎるため、それができません。Discourse チームからの、この変更を可能にするサポートは大変役立つでしょう。

@Bcat も彼のフォーラムで同じ問題に直面しています。

「いいね!」 2

Discourseのコア機能では、トピックのサムネイルとして「uploads」のみがサポートされています。これらはローカルまたはS3上にホストされたものでも構いませんが、Discourseにアップロードされている必要があります。リモート画像をローカルにダウンロードしてuploadsとして自動的に変換するには、「リモート画像をローカルにダウンロードする」というサイト設定を使用してください。

残念ながら、Discourseにおいてこの動作を変更する予定はありません。

「いいね!」 3

S3 上にホストされている場合、Discourse 上でどのようにアップロードされるのでしょうか?S3 は Discourse 上ではなく、画像をホストするためのパブリックサーバーでもあります。私がサードパーティの無料パブリック CDN からリモート画像を使用する場合も、同様に誰でもアクセス可能です。S3 も同様です。それなのに、なぜ Discourse はパブリック画像の URL をトピックのサムネイルとして使用することを許可またはサポートしないのでしょうか?

例えば、この URL https://d11a6trkgmumsb.cloudfront.net/optimized/3X/7/1/71abcfa01874c32497d638b372f94c7b9fc021e4_2_1380x718.png は、私が今まさに meta Discourse にアップロードした画像です。これはパブリックな画像ホスティング URL であり、私の画像の URL も https://images.pexels.com/photos/4761347/pexels-photo-4761347.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500 のようにパブリックにホストされた画像です。
なぜ Discourse は私の URL を採用しないのでしょうか?両方ともパブリックにホストされた URL であり、クローラーや Open Graph クローラーにとっては同じはずです。設定を変更して両方に対応できるようにしてください。

私はすでにこの設定をオンにしています。

しかし、なぜホットリンクされた画像がトピックのサムネイルとして採用されないのでしょうか?

また、このファイル設定で jpg/jpeg のアップロードを無効にしました。

サーバー上のストレージを節約するために、ユーザーが直接画像をアップロードできないように無効化しました。
フォーラムが非常に大きくなると、膨大な数の画像のストレージ管理が非常に困難になるからです。

私が望むことを達成するための何かハック的な方法や裏技はありませんか?トピック内のホットリンクされた画像を使用して og:image メタタグを上書きしたいだけです。これを簡単に達成する方法はありますか?もしかしたら、このホットリンク画像の src を og:image として強制するためにトピックページに配置できる HTML コードがあるかもしれません。

あるいは、Discourse がトピックのサムネイルを検出できなくなった場合にロゴ画像にフォールバックするデフォルトの og:image メタタグ行を無効化、または単純に削除するために、サイトの \u003chead\u003e にコードの行を追加することはできますか?

トピックページの投稿エディタに以下の行を追加しようと試みました。

\u003cmeta property="og:image" content="https://images.pexels.com/photos/4761347/pexels-photo-4761347.jpeg?auto=compress&cs=tinysrgb&dpr=2&w=500" /\u003e

しかし、何らかの理由で、トピックページのソースコードを見ると、このコードがレンダリングされていません。なぜでしょうか?

私がこれを試したページは Is yoga a Good workout - How To Discuss です。

この 1 つを優先させるにはどうすればよいでしょうか?ページに 2 つの og:image メタタグがある場合、私のカスタム og:image タグのみを選択して使用するようにするには?

以下のように設定することで可能です:

Discourse には S3 バケットにアクセスして、サイト上での表示用に画像を最適化する権限がないためです。また、Discourse はそのリンクが常に機能することを保証することもできません。バケットの所有者がファイルを削除する可能性があるからです。

つまり、私の Discourse 環境が、他のサードパーティの無料 CDN 画像サイトの S3 バケットにアクセスする権限を持っていない、ということでしょうか?
もしブラウザで画像にアクセスできるなら、Discourse からもアクセスできるはずです。実際、Discourse はホットリンクで共有された画像をすでに最適化しています。したがって、この機能は確かに必要だと考えます。

Discourse と CDN の比較について、上記の返信を更新しましたのでご確認ください。

大量の画像をホストするための、もっと安価な方法は他にありますか?サイトが数百万のトピック、つまり数十億の画像を抱えるようになった場合、Discourse サイトのバックアップが巨大化し、管理・スケーリング・移行が非常に困難で高額になることを懸念しています。その場合、どうすればよいでしょうか?

それらのファイルを管理・最適化する権限は持っていません。

もし本当にこの機能が必要な場合は、Marketplace に投稿して、機能を実装できるプラグイン開発者を見つけるのが最善の選択肢です。

ありがとうございます。同じ機能について、コアまたはプラグイン経由の有料トピックを作成しました。

このトピックは5時間後に自動的に閉鎖されました。新しい返信は許可されていません。