WordPressログイン画面の表示崩れと403エラー

WordPressで作成されたWebサイトの保守管理を任せられたときの話し。サーバーはさくらレンタルサーバであった。そしてわたしはmacOS MontereyのSafari 15.5でログインページを表示したところ、下図のようにまるでCSSが効いていないかのような崩れ方をしたログインページが表示された。

WordPressサイトのログイン画面が表示崩れしている
ログイン画面の表示崩れ

どうしたことかとSafariの開発者ツールを開くと、一部のリソースが403エラーで届いていないことが判明。403は“権限なし”つまりWordPressかサーバーかにブロックされている可能性があることがわかった。

また、よくよく見るとリソースが来ていないものはすべて/wp-admin/配下のファイルであることが判った。セキュリティ系のプラグインか何かでブロックされてしまったのかと思い、FirefoxやChromeで同URL(ログインページ)を開くと正常に表示されるではないか。なぜSafariだけ…。

Safariの開発者ツールの「ソース」タブ /wp-admin/配下のリソースのみすべて403エラーを吐いている
wp-admin配下のリソースのみ403エラー

別ブラウザでは403エラーも無く、何事もないかのように管理画面へログイン出来た。Safariで表示されたログインページは表示こそ崩れているがログインフォームはあるのでそのままログインを試みた。すると、nginxから403エラーが飛んできて、管理画面ページの閲覧は出来ず。そうだよね。

nginxが返す403 Forbiddenエラーページ
そのままログインを試みると403エラー

こうなるとログアウトするにも開発者ツールからCookieを削除するしか方法は無い。ひとまず、開発者ツールの「ストレージ」タブからCookiesを選択し、表示されるすべてのクッキーを削除。再びログインページのURLへアクセスすると先程の表示崩れしたページが表示された。振り出しに戻る。


わたしはここでFTP/S経由でファイルを見に行ったり、.htaccess設定を調べたり、さくらレンタルサーバのサーバーコントロールパネルでアクセス許可がホワイトリスト形式になっていないかなど調べた。しかし、特にそれらしい原因は見当たらず、途方に暮れた時間がここにはあったことだけは記す。そう、いろいろ遠回りしてこそ発見があるのだ!


Safariだけ弾かれるということはSafariの設定に原因がありそう、ということでSafari環境設定を見ていく。と、「プライバシー」タブの「IPアドレスを非公開」という設定項目が引っかかった。これが「トラッカーおよびWebサイトに非公開」に設定されていたのだ。なんだかiCloudプライベートリレーが発表された後に設定した記憶がある…。なぜ今まで気づけなかったのか。盲点!

Safari環境設定の「プライバシー」タブ 「IPアドレスを非公開」設定が「トラッカーおよびWebサイトに非公開」になっている
IPアドレスを非公開にするオプション

この設定を「トラッカーおよびWebサイトに非公開」から「トラッカーにのみ非公開」へ変更した。

Safari環境設定の「プライバシー」タブ 「IPアドレスを非公開」設定を「トラッカーにのみ非公開」へ変更
IP非公開先を「トラッカーのみ」へ変更

そうして更新をかけたところ、WordPressサイトのログイン画面が正常に読み込まれた!403エラーもなし。もちろんログインすると管理画面もきちんと表示され、種々の保守管理も行えた。

正常に読み込まれたWordPressサイトログイン画面
正常に読み込まれたWordPressサイトログイン画面

なぜ今まで気づかなかったのか(二度目!)。さくらレンタルサーバの「サーバーコントロールパネル」へログインし、セキュリティ設定のページを見てなんとなく納得。「国外IPアドレスフィルタ」の「アクセス制限設定」が“有効(制限する)”になっていることを確認して、それは確信へと変わった。

さくらのレンタルサーバコントロールパネル 「セキュリティ」タブの「国外IPアドレスフィルタ」設定ページ 「アクセス制限設定」が“有効(制限する)”になっている
さくらレンタルサーバの国外IPアドレスフィルタリング設定

iCloudプライベートリレーは現在ベータ版。「トラッカーにのみ非公開」設定ならば特に問題ないが、“Webサイトにも非公開”の設定にすることでこのiCloudプライベートリレーを経由するようになる。結果、さくらサーバはわたしのアクセスIPアドレスを国外のものと認識してしまったのだろう。

macOS環境設定を開き、「Apple ID」設定へ、「iCloud」タブ内の「プライベートリレー (ベータ版)」という項目にあるオプションボタンをクリックするとポップアップ画面が表示されるのだが、そこにはきちんと「ベータ版だからサイトに依っては問題が発生するかもよ。おまいさんのアクセスが別の地域と勘違いされたり(斯々然々)…」と書かれている。これだ。

macOS環境設定 「Apple ID」設定 「iCloud」タブ内 「プライベートリレー (ベータ版)」項目中のオプションボタンをクリックした際に表示されるポップアップ画面 そこにはプライベートリレーは現在ベータ版でWebサイトに依っては問題が発生する可能性がある旨記されている
今回はプライベートリレーベータ版が原因と断定した

もちろん、グローバルIPアドレスが静的であれば、さくらレンタルサーバは「国外IPアドレスフィルタ」のホワイトリストへ自IPアドレスを登録すれば問題を回避出来る。ただ、今回は作業範囲が小さかったためサーバーの余計な設定変更はせず、Safariの「IPアドレスを非公開」設定を都度いじることで対応した。

セキュリティ系プラグインが変にブロックしているのでは?とか、.htaccessに変な記述があるのでは?など、別の要因を難しく考えてしまいFTP/S経由でファイルを覗いて調べたりもしたが、結局はブラウザ、もといOSに搭載されたベータ版機能の問題だった。別ブラウザで開いて正常だった時に「おや?」と思ったあの気持ちをもっと大切にすれば良かった。こういうケースならば直感を信ずるも良しだ。常に柔軟であれ!

さぁ、悩みのタネは解決した。プライベートリレーが正式にリリースされた暁にはこのような問題も解消することを願って、Have a happy hacking life!

8337669510718828296 https://www.storange.jp/2022/07/wp-admin-403-error.html https://www.storange.jp/2022/07/wp-admin-403-error.html WordPressログイン画面の表示崩れと403エラー 2022-07-27T21:20:00+09:00 https://www.storange.jp/2022/07/wp-admin-403-error.html Hideyuki Tabata 200 200 72 72