はじめに
株式会社ネクストスケープ、ソリューションビジネス部に所属している小野塚です。
今回は先月の（2023年）5月16日にApp Serviceでパブリックプレビューとなった機能を紹介したいと思います。
「Custom Error page」、つまり、エラーページをカスタマイズできるというもので、具体的には403、502、そして503といったエラーページをApp Serviceの設定で設定し、表示できる機能となります。
要件
こちらの機能ですが、App Serviceであれば何でもというわけではなく、ドキュメントを見ると「using at least a Premium SKU」とあります。
以下はAzureポータルのスケールアップの画面ですが、こちらにある通り「Premium」と書かれたプランであればカスタムエラーページが利用できます。
ちなみにカスタムエラーページを設定した後に、もし対応していないプランにダウングレードした場合は以下のような警告が出ます。
カスタムエラーページの設定
では、カスタムエラーページを実際に設定してみましょう。
設定する箇所ですが、AzureポータルでApp Serviceに遷移し、左側のメニューから「構成」を選択し、表示された画面の上部タブで「エラーページ（プレビュー）」があるのでそれを選択すると以下のような画面が表示されると思います。
この画面においてエラーページの設定を行います。
ご覧の通り、403、502、503の各種エラーコード用に項目が存在していますので、カスタムエラーページを設定したいエラーコードの「編集」の列の鉛筆アイコンをクリックします。
そうすると以下のウィンドウが開きますので、ここでカスタムエラーページとなるHTMLファイルをアップロードします。
ファイルはHTMLファイル１つのみで、以下のスクリーンショットにあるようにファイルサイズは「10KB」までとなっておりますのでご注意ください。
ここで気づいた点がありまして、アップロードするHTMLファイル内に日本語があると「アップロード」ボタンが押せないようです。
エラーページですので英語で書かれているのがあるべき姿かなと思いますし、日本のユーザーしか想定していないということでなければ日本語を記述する必要はあまりないとは思いますが、念のためご注意ください。
さて、「アップロード」ボタンを押すと先ほどの画面に戻り、「状態」の欄が「構成済み」となります。
最後に「構成」画面で保存ボタンを押すのを忘れないようにしてください。
テスト
これで設定が一通り終わりまして恐らく設定したカスタムエラーページが表示されると思うのですが、やはり確認はしてみたいと思うので正しく設定されているかテストをしてみましょう。
テスト方法はMicrosoftのドキュメントでも紹介されているように、AppServiceの「ネットワーク」のアクセス制限を使って、403ページが正しく表示されるかを確認してみたいと思います。
詳しい設定方法は割愛しますが、現在自身が使っているIPアドレスを拒否対象として設定してみます。
そうすれば自分がこのAppServiceのURLにアクセスした場合に403ページが表示されることになります。
まず、先に正常時のページが表示されることを確認しておきます。
以下はAppServiceをデプロイしただけの状態でアクセスした場合に表示されるページです。
そして、先ほどの「アクセス制限」で自分自身のIPアドレスを設定し、改めてアクセスすると以下のように設定したカスタムエラーページが表示されることが確認できます（地味でスミマセン。。）。
最後に
こういったエラーページはWebサーバーやWAF等でデフォルトで用意されています。
しかしながらユーザービリティ的にも、セキュリティ的にもできればデフォルトのものではなく、「そのサイトにおいて」必要な情報が書かれたページを表示するのが望ましいと思います。
この機能がGAになればAppServiceでもこうしてエラーページのカスタマイズができますので、期待して待ちましょう。
