Nginx エラー ページの構成、Web サイトのエラー プロンプトを美しくする
- PHPzオリジナル
- 2023-07-04 13:33:112840ブラウズ
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 サイトの他の関連記事を参照してください。