Nginx エラーページの構成、Web サイトのエラープロンプトを美しくする-Nginx-php.cn

Nginx エラーページの構成、Web サイトのエラープロンプトを美しくする

PHPz

リリース： 2023-07-04 13:33:11

オリジナル

2907 人が閲覧しました

Nginx エラーページの設定、Web サイトの障害プロンプトを美しくする

Web サイトの運用中にサーバーエラーやその他の障害が発生することは避けられず、これらの問題によりユーザーは Web サイトに正常にアクセスできなくなります。ユーザーエクスペリエンスと Web サイトのイメージを向上させるために、Nginx エラーページを構成して Web サイトのエラープロンプトを美しくすることができます。この記事では、Nginx のエラーページ設定機能を使用してエラーページをカスタマイズする方法を紹介し、参考としてコード例を示します。

1. Nginx 設定ファイルを変更する

まず、Nginx 設定ファイルを開く必要があります。通常、このファイルは /etc/nginx/nginx.conf または /etc/nginx/conf にあります。 .d/default.conf。サーバーブロックを見つけて、次の構成を追加します。

server {
    ...
    error_page 403 /error/403.html;
    error_page 404 /error/404.html;
    error_page 500 502 503 504 /error/50x.html;
    ...
}

ログイン後にコピー

上記の構成では、error_page ディレクティブを使用してエラーページのパスを設定します。これはローカルファイルパスまたは URI です。 403 はアクセス拒否エラーを示し、404 はページにエラーがないことを示し、500、502、503、および 504 はサーバーエラーを示します。

2. エラーページの作成

対応するエラーページファイルを作成し、指定されたパスに保存する必要があります。次に、403 エラーページを例として、403.html という名前のファイルを作成し、nginx 構成ディレクトリの下のエラーディレクトリに保存します。

$ sudo mkdir /usr/share/nginx/error
$ sudo touch /usr/share/nginx/error/403.html
$ sudo nano /usr/share/nginx/error/403.html

ログイン後にコピー

403.html では、エラーメッセージをカスタマイズし、テキスト、アイコン、リンクなどを追加して、403 エラーが発生したことをユーザーに通知できます。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>403 Forbidden</title>
    <style>
        body {
            font-family: Arial, sans-serif;
            background-color: #f6f6f6;
            margin: 0;
            padding: 50px;
            text-align: center;
        }
        h1 {
            font-size: 24px;
            color: #333;
            margin-bottom: 20px;
        }
        p {
            font-size: 18px;
            color: #666;
            margin-bottom: 20px;
        }
    </style>
</head>
<body>
    <h1>403 Forbidden</h1>
    <p>抱歉，您没有权限访问该页面。</p>
</body>
</html>

ログイン後にコピー

3. Nginx の再起動

上記の設定が完了したら、設定を有効にするために Nginx を再起動する必要があります。

$ sudo systemctl restart nginx

ログイン後にコピー

4. 設定の確認

ブラウザに存在しない URL (http://example.com/123456 など) を入力すると、カスタマイズされた 404 エラーページが表示されます。同じ原理で、ユーザーが URL にアクセスする権限を持っていない場合、カスタマイズされた 403 エラーページも表示されます。

Nginx エラーページの設定を通じて、Web サイトの障害プロンプトを美しくし、ユーザーエクスペリエンスと Web サイトのイメージを向上させることができます。 403 および 404 エラーページに加えて、500、502、503 などの他のタイプのエラーページもカスタマイズできます。上記の手順に従い、対応する error_page ディレクティブを Nginx 構成ファイルに追加し、対応するエラーページファイルを作成するだけです。

概要:

Nginx は柔軟なエラーページ構成機能を提供しており、Web サイトのエラープロンプトページをカスタマイズできます。エレガントなエラーページのデザインとプロンプト情報により、ユーザーエクスペリエンスを向上させると同時に、フレンドリーでプロフェッショナルなイメージをユーザーに提示できます。上記はNginxのエラーページ設定の紹介とサンプルコードで、Webサイトのエラープロンプトを美しくするのに役立つことを願っています。

以上がNginx エラーページの構成、Web サイトのエラープロンプトを美しくするの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。