こんにちは、
Cloudflare R2 を S3 互換ストレージとして使用し、Discourse AI の翻訳機能とコンテンツローカライゼーションを併用した場合、翻訳された投稿の内容には設定済みの s3_cdn_url（カスタムドメイン）ではなく、R2 バケットのエンドポイント URL がそのまま保存されます。これにより、翻訳版を表示するすべてのユーザーで画像が壊れて表示される問題が発生します。
環境
- Discourse: latest
- Cloudflare R2 は S3 互換ストレージとして設定済み
s3_cdn_url:https://files.mydomain.coms3_use_cdn_url_for_all_uploads: 有効- コンテンツローカライゼーション + Discourse AI 翻訳: 有効
再現手順
- カスタムドメイン（
s3_cdn_url）付きで Cloudflare R2 を設定する - コンテンツローカライゼーションと AI 翻訳を有効にする
- 画像を含む投稿を作成する
- AI 翻訳がローカライズ版を生成するのを待つ
- 言語を切り替える — 翻訳版内の画像が壊れている
観察された動作
翻訳後のコンテンツには、https://files.mydomain.com/original/1X/ の代わりに以下のような URL が含まれています：
//files.myendpoint.r2.cloudflarestorage.com/original/1X/
関連するバグ: Chat thumbnails bypass s3_cdn_url & use raw S3 bucket URLs
一時的な修正方法として、リマップを行うか、以下のテーマコンポーネントを使用できます：
import { apiInitializer } from "discourse/lib/api";
export default apiInitializer("1.8.0", (api) => {
const badDomain = "files.myendpoint.r2.cloudflarestorage.com";
const goodDomain = "files.mydomain.com";
function fixImages() {
document.querySelectorAll(`img[src*="${badDomain}"]`).forEach(img => {
img.src = img.src.replace(badDomain, goodDomain);
});
document.querySelectorAll(`img[data-src*="${badDomain}"]`).forEach(img => {
img.dataset.src = img.dataset.src.replace(badDomain, goodDomain);
});
document.querySelectorAll(`img[data-large-src*="${badDomain}"]`).forEach(img => {
img.dataset.largeSrc = img.dataset.largeSrc.replace(badDomain, goodDomain);
});
}
api.decorateCooked(() => fixImages(), { id: "fix-r2-translated-images" });
api.onPageChange(() => fixImages());
});
