[自分用メモ][wordpress] CloudFront経由の配信でWordPressのビジュアルエディタが使えないときの対処方法

2019-04-02 11:07:31Amazon Web Services, wordpressAmazon, aws, CloudFront, lightsail, User-Agent, wordpress, 設定

Screenshot_2019-03-31 Visual Editor

気が付いている人もいると思いますが、lightsailを使用して構築しているこのWordPressですが、さらにAWS CloudFrontを使用して、CDNからの配信も行うようにしようと思っています。

時間を見つけては、他のWebサイトを参考にしつつCloudFrontを配置したりしているのですが、CloudFront越しにWordPressの更新を使用と思うと、投稿画面にビジュアルがないことに気が付きました。

なんかこの問題、有名な話題らしく似たような記事が散見されます。結論から言うと以下のことのようです。

POINT

Cloud Front経由でアクセスする場合、User-agent は「Amazon CloudFront」で書き換えられてしまう為、PCからのアクセスでないと判定されビジュアルエディタ機能がOFFになってしまう

なるほど。

対応方法自体はいくつかあるらしいのですが、一番簡単だと思われるのは、User-agentをそのままOrigin(つまりWordPress)に渡すようにすればよいとのこと。

CloudFront Behaviors で変更します。

path-Pattern : /wp-admin/* の場合において、CloudFront Behaviors の設定で、「Forward Headers:whitelist」に設定変更を行い、「Whitelist Headers」に「User-agent」を登録することで、接続端末のUser-agentがそのままWordPressに渡されるようになります。

5ca09bfbb8e44300505c1ad2

CloudFrontを始めとした、CDNを使用したことが無いので、この辺りはちゃんと勉強しないと拙いですね・・・

AWS認定アソシエイト3資格対策~ソリューションアーキテクト、デベロッパー、SysOpsアドミニストレーター~
平山 毅 岡 智也 池田 大 原 江梨佳 澤田 拓也 原 俊太郎 仲村 勇亮 上村 祐輝 鳥谷部 昭寛
リックテレコム (2019-06-13)
売り上げランキング: 2,599
Amazon Web Services ネットワーク入門 (impress top gear)
大澤 文孝
インプレス (2016-11-11)
売り上げランキング: 137,965