介绍

Nginx 是一个高性能的 Web 服务器,能够提供灵活和强大的内容。在设计您的 Web 页面时,通常有助于定制您的用户将看到的每个内容。这包括当他们请求不可用内容时的错误页面。

前提条件

要开始使用此指南,您需要一个具有)来设置此类用户。

您还需要在您的系统上安装 Nginx. 了解如何通过遵循此指南来设置(https://andsky.com/tech/tutorials/how-to-install-nginx-on-ubuntu-14-04-lts)。

完成上述步骤后,继续使用此指南。

创建你的自定义错误页面

我们将为示范目的创建一些自定义错误页面,但您的自定义页面显然会有所不同。

我们将将我们的自定义错误页放入 /usr/share/nginx/html 目录中,Ubuntu 的 Nginx 将其设置为默认文件根。我们将为 404 错误创建一个页面,称为 custom_404.html,并为一般 500 级错误创建一个页面,称为 custom_50x.html. 如果您只是在测试,您可以使用以下行:

1echo "<h1 style='color:red'>Error 404: Not found :-(</h1>" | sudo tee /usr/share/nginx/html/custom_404.html
2echo "<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
3echo "<h1>Oops! Something went wrong...</h1>" | sudo tee /usr/share/nginx/html/custom_50x.html
4echo "<p>We seem to be having some technical difficulties. Hang tight.</p>" | sudo tee -a /usr/share/nginx/html/custom_50x.html

我们现在有两个自定义错误页面,我们可以服务客户端请求导致不同的错误。

配置 Nginx 以使用您的错误页面

现在,我们只需要告诉 Nginx 每当出现正确的错误条件时,它应该使用这些页面。在您想要配置的 /etc/nginx/sites-enabled 目录中打开服务器封锁文件。我们将使用默认服务器封锁文件,称为 default,但如果您正在使用非默认文件,您应该调整自己的服务器封锁:

1sudo nano /etc/nginx/sites-enabled/default

现在我们可以将 Nginx 指向我们的自定义错误页面。

将 404 错误导向自定义 404 页面

使用「error_page」指令,以便在出现404错误时(当未找到所请求的文件时),为您创建的自定义页面提供服务。我们将为该文件创建一个位置块,在那里我们能够确保根匹配我们的文件系统位置,并且该文件只能通过内部的Nginx重定向访问(客户端无法直接请求):

 1[label /etc/nginx/sites-enabled/default]
 2server {
 3        listen 80 default_server;
 4        listen [::]:80 default_server ipv6only=on;
 5
 6        . . .
 7
 8        error_page 404 /custom_404.html;
 9        location = /custom_404.html {
10                root /usr/share/nginx/html;
11                internal;
12        }
13}

通常情况下,我们不必在新位置块中设置根,因为它与服务器块中的根相匹配,但是,我们在这里是明确的,所以即使我们将我们的常规网页内容和相关文档根移动到不同的位置,我们的错误页面也会被服务。

将 500 级错误直接发送到自定义 50x 页面

接下来,我们可以添加指南,以确保当 Nginx 遇到 500 级错误(服务器相关问题)时,它将服务于我们创建的其他自定义页面。

 1[label /etc/nginx/sites-enabled/default]
 2server {
 3        listen 80 default_server;
 4        listen [::]:80 default_server ipv6only=on;
 5
 6        . . .
 7
 8        error_page 404 /custom_404.html;
 9        location = /custom_404.html {
10                root /usr/share/nginx/html;
11                internal;
12        }
13
14        error_page 500 502 503 504 /custom_50x.html;
15        location = /custom_50x.html {
16                root /usr/share/nginx/html;
17                internal;
18        }
19
20        location /testing {
21                fastcgi_pass unix:/does/not/exist;
22        }
23}

在底部,我们还添加了一个愚蠢的FastCGI通道,以便我们可以测试我们的500级错误页面。这不会正常工作,因为后端不存在。

保存并关闭文件,当你完成。

重新启动 Nginx 并测试您的页面

通过键入测试您的配置文件的语法:

1sudo nginx -t

如果报告了任何错误,请在继续之前修复它们。当没有返回语法错误时,请通过键入重新启动 Nginx:

1sudo service nginx restart

现在,当您访问服务器的域或IP地址并要求一个不存在的文件时,您应该看到我们设置的404页面:

1http://server_domain_or_IP/thiswillerror

nginx custom 404

当您访问我们为 FastCGI 通道设置的位置时,我们将收到 502 Bad Gateway 错误,并在我们的自定义 500 级页面中显示:

1http://server_domain_or_IP/testing

nginx custom 50x

您现在可以回去并从您的 Nginx 配置中删除假的 FastCGI 通道位置。

结论

您现在应该为您的网站提供自定义错误页面,这是一个简单的方式来个性化用户的体验,即使他们遇到问题。这些页面的一个建议是包括链接到他们可以寻求帮助或更多信息的地方。

如何在 Ubuntu 14.04 上配置 Nginx 以使用自定义错误页面

介绍