[自分用メモ][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を使用したことが無いので、この辺りはちゃんと勉強しないと拙いですね・・・

この1冊で合格! AWS認定ソリューションアーキテクト - アソシエイト テキスト&問題集
アクセンチュア株式会社 青柳 雅之 飯田 敏樹 柿沼 力 門畑 顕博 他
KADOKAWA (2019-07-20)
売り上げランキング: 679
AWS認定アソシエイト3資格対策~ソリューションアーキテクト、デベロッパー、SysOpsアドミニストレーター~
平山 毅 岡 智也 池田 大 原 江梨佳 澤田 拓也 原 俊太郎 仲村 勇亮 上村 祐輝 鳥谷部 昭寛
リックテレコム (2019-06-13)
売り上げランキング: 2,599