TOC

CentOS 7でカスタムエラーページを使用するようにNginxを構成する方法

前書き

Nginxは、柔軟性とパワーを備えたコンテンツを提供できる高性能Webサーバーです。 Webページを設計するとき、ユーザーに表示されるすべてのコンテンツをカスタマイズすると役立つことがよくあります。 これには、利用できないコンテンツを要求したときのエラーページが含まれます。 このガイドでは、CentOS 7でカスタムエラーページを使用するようにNginxを構成する方法を示します。

前提条件

このガイドを始めるには、 `+ sudo +`権限を持つ非rootユーザーが必要です。 このタイプのユーザーを設定するには、https：//www.digitalocean.com/community/tutorials/initial-server-setup-with-centos-7 [CentOS 7の初期設定ガイド]に従ってください。 また、システムにNginxをインストールする必要があります。 https://www.digitalocean.com/community/tutorials/how-to-install-nginx-on-centos-7 [このガイド]に従って、これを設定する方法を学びます。

カスタムエラーページを作成します

デモ用にいくつかのカスタムエラーページを作成しますが、カスタムページは明らかに異なります。

カスタムエラーページは、CentOSのNginxがデフォルトのドキュメントルートを設定する `+ / usr / share / nginx / html `ディレクトリに配置します。 「 custom_404.html 」と呼ばれる404エラー用のページと、「 custom_50x.html +」と呼ばれる一般的な500レベルのエラー用のページを作成します。 テストするだけの場合は、次の行を使用できます。 それ以外の場合は、次の場所に独自のコンテンツを配置します。

echo "<h1 style='color:red'>Error 404: Not found :-(</h1>" | sudo tee /usr/share/nginx/html/custom_404.html
echo "<p>I have no idea where that file is, sorry.  Are you sure you typed in the correct URL?</p>" | sudo tee -a /usr/share/nginx/html/custom_404.html
echo "<h1>Oops! Something went wrong...</h1>" | sudo tee /usr/share/nginx/html/custom_50x.html
echo "<p>We seem to be having some technical difficulties. Hang tight.</p>" | sudo tee -a /usr/share/nginx/html/custom_50x.html

これで、クライアントリクエストがさまざまなエラーになったときに提供できる2つのカスタムエラーページができました。

エラーページを使用するためのNginxの構成

ここで、正しいエラー状態が発生したときにこれらのページを使用する必要があることをNginxに伝える必要があります。 サーバーブロックを調整する必要があります。 CentOS 7では、プライマリサーバーブロックは `+ / etc / nginx / nginx.conf +`ファイルにあります。 このサーバーブロックを構成しますが、構成した他のサーバーブロックを調整する必要があります。

sudo nano /etc/nginx/nginx.conf

ファイル内で、サーバーコンテキストを定義するブロックを見つけます。 これで、カスタムエラーページにNginxを向けることができます。

カスタム404ページへの404エラーのダイレクト

CentOS Nginx構成ファイルは、 `+ error_page +`ディレクティブを使用して404エラーページを既に定義しています。 404エラーが発生したとき（要求されたファイルが見つからないとき）、作成したカスタムページが提供されるように、これを変更する必要があります。 ファイルに関連付けられたロケーションブロックを調整して、ルートがファイルシステムのロケーションと一致し、ファイルがNginxの内部リダイレクト（クライアントから直接要求できない）を介してのみアクセスできることを確認できるようにします。

/etc/nginx/nginx.conf

http {

   . . .

   server {

       . . .

       error_page 404 /;
       location = / {


       }

       . . .
   }
}

通常、サーバーブロックのルートと一致するため、新しいロケーションブロックに「+ root +」を設定する必要はありません。 ただし、通常のWebコンテンツと関連するドキュメントルートを別の場所に移動してもエラーページが表示されるように、ここでは明示的にしています。

カスタム50xページへの500レベルのエラーのダイレクト

次に、ディレクティブを追加して、Nginxが500レベルのエラー（サーバー関連の問題）に遭遇したときに、作成した他のカスタムページを処理するようにします。 これは、前のセクションで使用した式とまったく同じです。 今回は、すべてが `+ custom_50x.html +`ページを使用するように複数の500レベルエラーを設定します。

/etc/nginx/nginx.conf

http {

   . . .

   server {

       . . .

       error_page 404 /custom_404.html;
       location = /custom_404.html {
           root /usr/share/nginx/html;
           internal;
       }

       error_page  500 502 503 504 /;
       location = / {


       }




   }
}

下部に、ダミーのFastCGIパスも追加して、500レベルのエラーページをテストできるようにしました。 バックエンドが存在しないため、これは正しく機能しません。 ここでページをリクエストすると、500レベルのエラーがカスタムページに配信されることをテストできます。

完了したら、ファイルを保存して閉じます。

Nginxの再起動とページのテスト

次を入力して、構成ファイルの構文をテストします。

sudo nginx -t

エラーが報告された場合は、続行する前に修正してください。 構文エラーが返されない場合、次を入力してNginxを再起動します。

sudo systemctl restart nginx

これで、サーバーのドメインまたはIPアドレスにアクセスして存在しないファイルを要求すると、設定した404ページが表示されます。

http:///thiswillerror

image：https：//assets.digitalocean.com/articles/nginx_custom_error_1404/custom_404.png [nginx custom 404]

FastCGIパス用に設定した場所に移動すると、カスタム500レベルページで502 Bad Gatewayエラーが表示されます。

http:///testing

画像：https：//assets.digitalocean.com/articles/nginx_custom_error_1404/custom_50x.png [nginx custom 50x]

戻って、Nginx構成から偽のFastCGIパスの場所を削除できます。

結論

これで、サイトのカスタムエラーページを提供するはずです。 これは、ユーザーが問題を経験している場合でも、ユーザーエクスペリエンスをパーソナライズする簡単な方法です。 これらのページの1つの提案は、ヘルプや詳細情報を入手できる場所へのリンクを含めることです。 これを行う場合は、関連するエラーが発生している場合でもリンク先にアクセスできることを確認してください。

Related