カテゴリー
コンピュータ

MediaWikiでCloudFlareを使う

MediaWikiでCloudFlareを導入したときの設定方法、問題点

CloudFlareで何をキャッシュさせるか

記事ページのキャッシュはCookie、MobileFrontendでの振り分けの関係で「Businessプラン」以上でないと難しいのであきらめ、画像(/image)とResourceLoader(load.php)をキャッシュさせることにした。

設定した環境など

MediaWiki 1.35.0以上での設定例です

例URLとしてhttps://example.com/ を使用、URL構成はwikipediaと同じと想定しています↓

エントリーポイントURL
記事のパス/wiki/$1
スクリプトパス/w

CloudFlareの設定

Caching

cachingの設定画面にて「キャッシュ レベル」をスタンダードにします

PageRule

ルールの設定画面にてページ ルールを作成します

ルール

  1. URL:example.com/wiki/*:*  設定:キャッシレベル:スキップ
  2. URL:example.com/w/load.php* 設定:キャッシレベル:Cache Everything

説明

MediaWiki:~~.css、ファイル:~~.jpgなどが静的ファイル(CloudFlare指定する拡張子)と認識されキャッシュされる可能性があるのでキャッシュをさせないようにします。

ResourceLoader(load.php)はバージョン、構成が変わる度にURLが変更されるの全てキャッシュさせます。(Cache Everythingが重要でこのオプションを設定すると 静的ファイル でなくてもCache-Controlに応じキャッシュしてくれます。)

 Cache Everything – すべてのコンテンツを静的コンテンツとして扱い、Cloudflareのデフォルトでキャッシュされたコンテンツを超えて、すべてのファイルタイプをキャッシュします。Page Ruleで エッジCache TTLを設定している場合を除き、オリジンWebサーバーからのCacheヘッダーを尊重します。

CloudflareのPage Rulesを理解した上で設定する(Page Rulesチュートリアル) – Cloudflareヘルプセンター

画像について

画像に関してはCloudFlare標準でキャッシュされます
だだし再アップロード時に更新されず古い画像が配信されるのでブラウザキャッシュを短くするなどの対策が必要です。

MediaWikiの設定

LocalSettings.php に下記を追記します。(2021/04/11現在のIPリストを使用しています)


$wgUseCdn = true;
$wgCdnServersNoPurge = [
'173.245.48.0/20',
'103.21.244.0/22',
'103.22.200.0/22',
'103.31.4.0/22',
'141.101.64.0/18',
'108.162.192.0/18',
'190.93.240.0/20',
'188.114.96.0/20',
'197.234.240.0/22',
'198.41.128.0/17',
'162.158.0.0/15',
'104.16.0.0/12',
'172.64.0.0/13',
'131.0.72.0/22',
'2400:cb00::/32',
'2606:4700::/32',
'2803:f800::/32',
'2405:b500::/32',
'2405:8100::/32',
'2a06:98c0::/29',
'2c0f:f248::/32'
];

説明

$wgUseCdn CDN用?のheaderが追加されるようになります

$wgCdnServersNoPurge X-Forwarded-Forを適切に扱うためにCloudFlareが利用しているIP一覧を設定する必要があります、IP Ranges | Cloudflare にて最新のIP一覧が取得できます(この設定を怠ると編集者のIPが全てCloudFlareのIPになってしまいます)

実例

実際に使って見たときの「Cache Analytics」(Proプラン以上)スクリーンショット

APIリクエスト(json)や記事ページ(html)はダイナミックとなりキャッシュされていません

ResourceLoader(load.php)に関しては9割以上キャッシュできています

CloudFlareその他の機能

キャッシュ以外の機能を試してみて

  • Rocket Loader ❌ResourceLoaderの機能と衝突し表示がおかしくなった
  • Mirage ❌表示がおかしくなった
  • Polish ⭕軽量なファイルに自動で変換されて良い(Pro)
  • Auto Minify ❌ResourceLoaderがMinifyするので意味がない?htmlのminifyは意味があるかも

応用?

maxage パラメータ

api.php のクエリオプション smaxage、maxageに応じでCloudFlare側でキャッシュさせたい場合は load.php と同じくPageRule での Cache Everything の設定が必要です。

Caching > 構成 の「ブラウザ キャッシュ TTL」を変更している場合 「オリジンキャッシュコントロール」 ON にしておくと上書きされず サーバが返すcache-controlが尊重されます

記事ページをキャッシュさせる

PC、Mobileの振り分けが必要ない(MobileFrontendなど)場合は「Business プラン」で Cookieバイパスを利用することによりキャッシュすることができます。以下の通りに PageRule での Cache Everything を指定することにより記事ページをキャッシュさせることが出来ます

参考リンク

「MediaWikiでCloudFlareを使う」への1件の返信

Hi! I’ve been finding Cloudflare extensions for a pretty long time, but pretty much every of them gets outdated. I appreciate your work and I look forward to your extension supporting MobileFrontend!
(I can read Japanese btw, but I cannot make sentences; I’ll use DeepL and change a little bit to make it more understandable hopefully.)
こんにちは!Cloudflareの拡張機能を長い間見つけてきましたが、これらの拡張機能はどれも古くなってしまいます。新しいのCloudflare拡張機能の開発お疲れ様でした。この拡張機能がMobileFrontendをサポートすることを楽しみにしています!

コメントを残す