Nginx学习日志(四)自定义404,500,502,503等错误页面

865 阅读1分钟

Nginx 错误页面自定义

通常在项目当中会自定义项目的错误界面,当请求不对或者请求错误什么的就会返回一个对用户比较友好的提示界面。

今天打算升级自己的博客客户端,发现在关闭博客程序后再次访问会跳转到Nginx的502错误界面,就想着能不能自定义一下错误界面。 第一步:准备错误界面

文件名为:50x.html

<!DOCTYPE html>
<html>
<head>
<title>Error</title>
<style>
    body {
        width: 35em;
        margin: 0 auto;
        font-family: Tahoma, Verdana, Arial, sans-serif;
    }
</style>
</head>
<body>
<h1>系统出错或升级当中</h1>
<p>请稍后尝试或联系hjljy@outlook.com</p>
</body>
</html>

第二步:修改配置文件

修改nginx 的conf配置文件 (在nginx安装包的conf目录下)

完整配置如下:

 server {
        listen       443 ssl;
        server_name  www.hjljy.cn;
		ssl on;

        ssl_certificate      ../cert/1864683_www.hjljy.cn.pem;
        ssl_certificate_key  ../cert/1864683_www.hjljy.cn.key;
		ssl_session_timeout 5m;
 		ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
 		ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
 		ssl_prefer_server_ciphers on;
 		#  自定义错误页面相关配置   
 		#  开启错误拦截代理
		proxy_intercept_errors on;
		 #错误页面设置为50x.html
		error_page   500 502 503 504  /50x.html; 
 		location = /50x.html {
 			# 50x.html文件所在路径
            root   /usr/local/nginx/html/myerror; 
        }
        #  自定义错误页面相关配置结束
        location / {
            	proxy_pass http://127.0.0.1:8081;
        	proxy_set_header  Host $host:$server_port;
        	proxy_set_header  X-Real-IP  $remote_addr;
      
        }
	}
}

最后访问地址:www.hjljy.cn 成功跳转到50x.html界面

PS:以上的配置也可以用于定义其他的静态资源文件,例如:网站的favicon.ico