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

介绍

Nginx是一款高性能的Web服务器,能够以灵活性和强大的功能提供内容。在设计网页时,自定义用户将看到的每条内容通常很有帮助。这包括他们请求不可用内容时的错误页面。在本指南中,我们将演示如何配置Nginx以在Ubuntu 14.04上使用自定义错误页面。

要完成本教程,您需要具备一台已经设置好可以使用sudo命令的非root账号的Ubuntu服务器,并且已开启防火墙。没有服务器的同学可以在这里购买,不过我个人更推荐您使用免费的腾讯云开发者实验室进行试验,学会安装后再购买服务器

准备

要开始使用本指南,您需要具有sudo权限的非root用户。

您还需要在系统上安装Nginx。

完成上述步骤后,请继续阅读本指南。

创建自定义错误页面

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

我们将自定义错误页面放在Ubuntu的Nginx设置其默认文档根目录的/usr/share/nginx/html目录中。我们将为404错误调用一个叫custom_404.html的页面,调用一个500级错误custom_50x.html。如果您只是测试,可以使用以下行。否则,将您自己的内容放在以下位置:

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

我们现在有两个自定义错误页面,我们可以在客户端请求导致不同错误时提供这些页面。

配置Nginx以使用错误页面

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

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

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

将404错误直接发送到自定义404页面

使用error_page指令,以便在发生404错误时(未找到请求的文件时),提供您创建的自定义页面。我们将为该文件创建一个位置块,我们可以确保根与我们的文件系统位置匹配,并且该文件只能通过内部Nginx重定向访问(不能由客户端直接请求):

server {
        listen 80 default_server;
        listen [::]:80 default_server ipv6only=on;
​
        . . .
​
        error_page 404 /custom_404.html;
        location = /custom_404.html {
                root /usr/share/nginx/html;
                internal;
        }
}

通常,我们不必在新的位置块中设置root,因为它与服务器块中的根匹配。但是,我们在此明确说明,即使我们将常规Web内容和关联文档根目录移动到其他位置,也会提供错误页面。

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

接下来,我们可以添加指令以确保当Nginx遇到500级错误(服务器相关问题)时,它将为我们制作的其他自定义页面提供服务。这将遵循我们在上一节中使用的完全相同的公式。这次我们设置了多个500级错误,以便全部使用custom_50x.html页面:

server {
        listen 80 default_server;
        listen [::]:80 default_server ipv6only=on;
​
        . . .
​
        error_page 404 /custom_404.html;
        location = /custom_404.html {
                root /usr/share/nginx/html;
                internal;
        }
​
        error_page 500 502 503 504 /custom_50x.html;
        location = /custom_50x.html {
                root /usr/share/nginx/html;
                internal;
        }
​
        location /testing {
                fastcgi_pass unix:/does/not/exist;
        }
}

在底部,我们还添加了一个虚拟FastCGI传递,以便我们可以测试我们的500级错误页面。由于后端不存在,因此无法正常工作。在此处请求页面将允许我们测试500级错误是否为我们的自定义页面提供服务。

完成后保存并关闭文件。

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

键入以下命令测试配置文件的语法:

sudo nginx -t

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

sudo service nginx restart

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

http://server_domain_or_IP/thiswillerror

当您转到我们为FastCGI通行证设置的位置时,我们将在我们的自定义500级页面上收到502 Bad Gateway错误:

http://server_domain_or_IP/testing

您现在可以返回并从Nginx配置中删除假的FastCGI传递位置。

结论

您现在应该为您的网站提供自定义错误页面。即使遇到问题,这也是一种简化用户体验个性化的方法。面对这些页面的一个建议是添加能指向他们可以获取帮助或更多信息的位置的链接。如果您这样做了,请确保即使发生相关错误也可以访问链接目标。

想要了解更多关于配置Nginx以使用自定义错误页面的相关教程,请前往腾讯云+社区学习更多知识。


参考文献:《How To Configure Nginx to Use Custom Error Pages on Ubuntu 14.04》

原创声明,本文系作者授权云+社区发表,未经许可,不得转载。

如有侵权,请联系 yunjia_community@tencent.com 删除。

编辑于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏IT笔记

Nginx学习之自定义访问日志

写在开始 日志的重要性不言而喻,一般来说我们开发过程中会为每个项目定义自己的日志格式以及存储路径。 就我们普通的JAVAWEB项目来说,重要的日志一般输出并存放...

3475
来自专栏云计算教程系列

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

Nginx是一款高性能的Web服务器,能够以灵活性和强大的功能提供内容。在设计网页时,自定义用户将看到的每条内容通常很有帮助。这包括他们请求不可用内容时的错误页...

480
来自专栏月牙寂

k8s源码分析-----EndpointController

第一时间获取文章,可以关注本人公众号 月牙寂道长 yueyajidaozhang

2905
来自专栏郭耀华‘s Blog

linux下安装git提示”无法打开锁文件 /var/lib/dpkg/lock - open (13: 权限不够)“

如图所示,输入命令:apt-get install git后提示权限不够 解决方法,在命令前加 sudo即可 sudo apt-get install git ...

4006
来自专栏好好学习吧

testng执行多个suite

由于testng.xml中只能设置一个<suite>标签,就无法创建多个测试集,通过<suite-files >标签可以实现允许多个测试集。

3291
来自专栏电光石火

EMLOG无插件实现网站源码压缩

在以往的Emlog优化教程中,相信都是使用的代码压缩插件,今天主要是分享插件的代码版本,也就是不使用插件,直接将代码丢在module.php中就可以,好吧,又消...

2675
来自专栏python3

python-web环境

Web应用程序是一种可以通过Web访问的应用程序,程序的最大好处是用户很容易访问应用程序,用户只需要有浏览器即可,不需要再安装其他软件。应用程序有两种模式C/S...

1101
来自专栏中国白客联盟

Android动态调试(三)Xposed hook

1202
来自专栏魏艾斯博客www.vpsss.net

开启 CDN 后 wordpress 后台打不开的解决办法

3984
来自专栏bboysoul

什么是EOF

EOF的意思是End Of File是文件尾的标志。在数值上来说就是-1。 当在文件操作的时候,碰到文件结束,或者数据读取错误是均会返回EOF。 在linu...

942

扫码关注云+社区