Heroku Advent Calendar 2017 の 12日目です。

Heroku, 便利ですよね。サーバ周りのあれこれについて最小限のことだけを考えればよく、アプリケーション開発に集中できるので、特に専属のインフラエンジニアをアサインできないような状況では大変ありがたいです。

さて、小ネタではありますが、Heroku のエラーページのカスタマイズ方法について。

Heroku のアプリケーションエラーページをカスタマイズ

Heroku のアプリケーションエラー発生時に表示されるページは、デフォルトではこんな画面。

たとえば Heroku の仕様上、リクエストが30秒経過してタイムアウトとなった場合などでこれが表示されます。dyno数 が 0 のときなんかもこのエラーです。

この表示をカスタマイズする方法ですが

• 独自のエラーページを作成して
• それを「Heroku外の領域」に設置
• 環境変数でそのURLを指定

という手順になります。ページの設置先は S3 とかが良いのかなと思うのですが、今回はお手軽に GitHub Pages に載せました。用意したのはこちら。

https://tipsnote.github.io/heroku-error-pages/500.html

ページが用意できたら、Heroku の環境変数 ERROR_PAGE_URL で、さきほどのURLを指定してやれば完了です。設定はブラウザからでもいいですし、CLI からならこうでしょうか。

heroku config:set ERROR_PAGE_URL=用意したページのURL --app アプリ名

試しに必ずタイムアウトするサンプルページを作ってアクセスしてみると、カスタマイズした画面が表示されました。(30秒お待ちください)

https://errorpage.herokuapp.com/500

よーしよしよし。

メンテナンス画面もカスタマイズ

メンテナンス画面も同様です。
Herokuでは管理画面からポチっとするだけでサイトをメンテナンスモードにできます。その際の表示ページについてもHeroku外の領域に設置し、環境変数 MAINTENANCE_PAGE_URL を指定するという手順でカスタマイズ可能です。

https://tipsnote.github.io/heroku-error-pages/maintenance.html

こんなメンテナンスページを用意して

heroku config:set MAINTENANCE_PAGE_URL=用意したページのURL --app アプリ名

と設定する感じですね。

エラーページを手軽につくる

ちょっと話がそれますが、こんなサイトがありまして、

• Better Error Pages by Statuspage

こちら、404, 500 などのエラーページをさくっと作成できるWEBサービスです。用意されているテンプレートと色などを選択したら、すぐに使えるエラーページをダウンロードできるというもの。今回のサンプルではこれを使ってみました。

その他のエラーページ

403 や 404 などのエラーページについては、Heroku 特有の仕様はなく、一般的なサーバでの設定方法と同じです。

念のために書いておきますと、Apache であれば .htaccess に

ErrorDocument 403 /403.html
ErrorDocument 404 /404.html

などと書き、対象のページを用意する (この場合は Heroku内の領域でOK) という感じですね。

https://errorpage.herokuapp.com/403
https://errorpage.herokuapp.com/404

以上ご参考まで。

リンク

• Error Pages | Heroku Dev Center
• Better Error Pages by Statuspage
• 今回使用したサンプルコード