How can the front end appear "system maintenance page" in time when the front end is separated, the back end is maintained or when something goes wrong?

RT
backend java
frontend Vue

Mar.02,2021

the backend writes whether the interface is maintained or not. Before each request, the secondary API is sent to check whether the background is under maintenance, and the status shows that is maintaining at the front end. Otherwise, it's normal. (simple solution.


when an API returns status as 404 , jump to the


initial GET request on the system maintenance page, and the request will be processed by the backend. You can show whatever you want on the back end.
if it is an uncertain "accident" in the middle, what is shown is part of the function of the front end, and just ask the front end to do it.


if you are using axios as an interactive plug-in, you can try the following configuration

this.$http.get(url, data, config)
    .then(res => {
      // success
    })
    .catch((err) => {
      // fail
      if (err.response) {
        // The request was made and the server responded with a status code
        // that falls out of the range of 2xx
        // 2xx
      } else if (err.request) {
        // The request was made but no response was received
        // `error.request` is an instance of XMLHttpRequest in the browser and an instance of
        // http.ClientRequest in node.js
        // 
      } else {
        // Something happened in setting up the request that triggered an Error
      }
      console.log(error.config);
    })

the front end can make a judgment based on the status code returned by the background. When a specific status code appears, it jumps to the maintenance page

.

when configuring nginx, backend maintenance, it automatically jumps to the system maintenance page under maintenance


Thank you very much. The problem has been solved. Let's talk about my practice. Because the size of the server is limited, it is impossible to do Websocket, and want to manipulate the maintenance page at will, so a json file is placed in the root directory of the server front end, and this json file is used as a configuration file. You can configure whether or not to maintain, the time period for maintenance, maintain the content displayed on the page, and then judge it by reading requests from the front end, which is also a way

.
Menu