タイトルで言い切ってますが…
CloudFront の「Compress Objects Automatically」ってオプションを有効にすると、対応しているブラウザに対しては圧縮転送をしてくれるはずなんですが、オリジンサーバが WordPress の場合、これが有効になりません。
css とか js なんかの静的ファイルはちゃんと圧縮してくれてるんですが…
調べたところ、CloudFront で compress オプションが有効になるには、以下の条件があるようです。
- The file must be of a type that CloudFront compresses.
- The file size must be between 1,000 and 10,000,000 bytes.
- The response must include a Content-Length header so CloudFront can determine whether the size of the file is in the range that CloudFront compresses. If the Content-Length header is missing, CloudFront won't compress the file.
- The response must not include a Content-Encoding header.
これの「The response must include a Content-Length header so CloudFront can determine…」が引っかかってるんですね…
そんなわけで、Content-Length ヘッダを創出してやればちゃんと CloudFront で圧縮転送オプションが有効になります。
ob_start() と ob_end_flush() にお出まししてもらいましょうか。
このサイトは TwentyTwelve の子テーマとして作成されてるので、テーマの index.php を以下のようにしました。
普通のテーマなら、index.php の最初で <?php ob_start();>
して、最後で <?php header('Content-Length: '.ob_get_length()); ob_end_flush(); ?>
すればいいかな。
まぁ、子テーマにしてテーマディレクトリに上記のような index.php を置いておく方が後々のテーマのアップデート時とか楽なので、その方がいいでしょう。
ちゃんと gzip されるようになりましたね。
$ curl --head -H "Accept-Encoding: gzip" https://dogmap.jp/ HTTP/1.1 200 OK Content-Type: text/html; charset=UTF-8 Connection: keep-alive Content-Encoding: gzip Date: Fri, 26 May 2017 07:50:25 GMT Server: nginx Strict-Transport-Security: max-age=31536000; includeSubDomains; preload Vary: Accept-Encoding X-Cache-Status: HIT X-Cached: Fri, 26 May 2017 07:50:09 GMT X-Cache: Miss from cloudfront Via: 1.1 2bb00e225b1b6c3d82913e7c9db706c5.cloudfront.net (CloudFront) X-Amz-Cf-Id: cFG5SBIQJjYYWwuMHX6RV-WOt77-pTKtqoI-UwLz9c2cU1O0I6nSaA==
現場からは以上です。