原文：https://www.zhyd.me/article/106

在网站发版时，总会有那么一小段时间服务是访问不通的，一般用户看到的都会是一个502的错误页面

那么可以通过nginx实现一个简单的通知页面，比如：

实现这个功能，只需要两步：
第一：编写“upgrading.html”

例如本站的“upgrading.html”

<!DOCTYPE html>

<html>

<head>

    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

    <meta charset="utf-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1">

    <title>张亚东博客</title>

    <link href="https://static.zhyd.me/static/img/favicon.ico" rel="shortcut icon" type="image/x-icon">

    <link href="https://cdn.bootcss.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet">

</head>

<body>

<div class="container">

    <div class="row">

        <div class="col col-md-12 text-center">

            <div class="alert alert-success alert-dismissable" style="margin-top: 20px">

                <button type="button" class="close" data-dismiss="alert">&times;</button>

                <strong>网站正在维护!</strong> 请稍等一会，先听听歌吧~~

            </div>

        </div>

    </div>

    <div class="row">

        <div class="col col-md-12 text-center">

            <iframe frameborder="no" border="0" marginwidth="0" marginheight="0" width=330 height=450 src="https://music.163.com/outchain/player?type=0&id=879855523&auto=1&height=430"></iframe>

        </div>

    </div>

</div>

</body>

</html>

第二：修改nginx配置文件

在server中增加如下配置：

error_page 502 upgrading.html;

error_page 503 upgrading.html;

error_page 504 upgrading.html;

location = /upgrading.html {

    root /usr/share/nginx/html;

}

完整配置的格式如下：

server {

    listen  80;

    server_name xxx;

    error_page 502 upgrading.html;

    error_page 503 upgrading.html;

    error_page 504 upgrading.html;

    location = /upgrading.html {

        root /usr/share/nginx/html;

    }

    location / {

        // ... 省略

    }

}

这段代码的意思就是：当系统返回502、503或者504响应时，跳转到 upgrading.html页面。其中root 指向的是upgrading.html文件的目录

通过Nginx实现一个简单的网站维护通知页面的更多相关文章

  1. 利用angular4和nodejs-express构建一个简单的网站（五）—用户的注册和登录-HttpClient

    上一节简单介绍了一下利用angular构建的主路由模块,根据上一节的介绍,主页面加载时直接跳转到用户管理界面,下面就来介绍一下用户管理模块.启动应用后,初始界面应该是这样的: 用户管理模块(users ...

  2. HTTP lab01 做一个简单的测试用 web页面

      做一个简单的测试用 web页面     1.安装httpd服务   yum install httpd   安装完httpd服务后,系统就自动生成了/var/www/html目录     创建一个 ...

  3. 初始nginx（启动运行） 使用nginx做一个简单的静态资源服务器

    第一次接触nginx的时候,那时候公司还是用的一些不知名的小技术,后来公司发展问题,重新招了人,然后接触到nginx,公司 使用nginx用来做代理服务器,所有请求 都先经过nginx服务器,然后交由 ...

  4. Flutter随笔（二）——使用Flutter Web + Docker + Nginx打造一个简单的Web项目

    前言 Flutter作为一个跨平台UI框架,功能十分强大,仅用一套代码便能编译出Android.iOS.Web.windows.macOS.Windows.Linux等平台上的应用,各平台应用体验高度 ...

  5. 使用nginx搭建一个简单的负载均衡

    在windows系统上使用IIS模拟出两个不同服务器的站点: 然后再NGINX使用轮询机制配置两个服务器以及虚拟服务器的端口: 需要注意的是,配置虚拟代理域名的话需要找到windowsC盘下的host ...

  6. 利用angular4和nodejs-express构建一个简单的网站（一）——构建前后端开发环境

    学习了一段时间的angular4知识,结合以前自学的nodejs-express后端框架知识,做了一个利用angular4作为前端,node-express作为后端服务器的网站.这个网站的功能很简单, ...

  7. 一个简单的网站web项目的详解

    有不对的术语,或者不好理解的部分,欢迎大家批评指正,谢谢大家! 近期做的网站web项目,实现登录功能,查询功能.首先把这个项目分为几个模块来处理,当前用户模块,历史用户模块,历史记录模块,数据库模块, ...

  8. 记录使用Redis和nginx 实现一个简单的负载均衡（FB）

    这两年在博客园看了不少大牛的分享,一直打算能写点什么东西. 之前偶然看见一个利用Redis 当作 Session数据宿主的demo,出处我已经找不到了.后来没事看了看nginx相关的东西.其中负载均衡 ...

  9. 利用angular4和nodejs-express构建一个简单的网站（十）—好友模块

    上一章讲解了用户登录的相关代码.用户登录成功后,就会进入好友模块,在好友模块中会根据不同的用户ID显示相应的好友列表,点击好友列表中的单个好友就会进入编辑单个好友页面,对好友信息进行编辑.点击列表页面 ...

随机推荐

  1. LeetCode：接雨水【42】

    LeetCode:接雨水[42] 题目描述 给定 n 个非负整数表示每个宽度为 1 的柱子的高度图,计算按此排列的柱子,下雨之后能接多少雨水. 上面是由数组 [0,1,0,2,1,0,1,3,2,1, ...

  2. TestDirector（TD）—测试管理工具

    简介 TestDirector是全球最大的软件测试工具提供商Mercury Interactive公司生产的企业级测试管理工具,也是业界第一个基于Web的测试管理系统,它可以在您公司内部或外部进行全球 ...

  3. .Net Core 定时任务TimeJob

    转载自:https://blog.csdn.net/u013711462/article/details/53449799 定时任务 Pomelo.AspNetCore.TimedJob Pomelo ...

  4. Django框架深入了解_04(DRF之url控制、解析器、响应器、版本控制、分页)

    一.url控制 基本路由写法:最常用 from django.conf.urls import url from django.contrib import admin from app01 impo ...

  5. Django 自定义表名

    class UserInfo(AbstractUser): phone = models.BigIntegerField(null=True, blank=True) create_time = mo ...

  6. max_prepared_stmt_count参数

    MySQL报错[mysqld-5.5.17-log]Can't create more than max_prepared_stmt_count statements (current value: ...

  7. Codeforces 1207 G. Indie Album

    Codeforces 1207 G. Indie Album 解题思路 离线下来用SAM或者AC自动机就是一个单点加子树求和,套个树状数组就好了,因为这个题广义SAM不能存在 \(len[u] = l ...

  8. MVC-09安全

    部分8:添加安全. MVC应用程序安全性 Models文件夹包含表示应用程序模型的类. Visual Web Developer自动创建AccountModels.cs文件,该文件包含用于应用程序认证 ...

  9. webapi session

    webapi中使用session 修改global.cs里面的内容 using System; using System.Web; using System.Web.Routing; using Sy ...

  10. 微信web开发问题记录

    问题一.微信浏览器中无法使用reload重载文档[VUE框架] 问题分析: 微信不支持location.reload()方法,在微信浏览器中会失效 Vue中的路由跳转是类似于ajax局部刷新,因此使用 ...