Как показать состояние работоспособности сервера узла в HTML - PullRequest
Новая
       17

Как показать состояние работоспособности сервера узла в HTML

0 голосов
/ 12 апреля 2019

У меня есть два сервера.Один из них - server1, работающий на порте 8080, а другой - основной сервер приложений, работающий на 8081. Теперь я хочу продемонстрировать состояние работоспособности server1 на пользовательском интерфейсе (HTML), который работает на главном сервере приложений (8081). Я хочу отобразитьэти элементы в HTML.

1. Status code of server one.

2. Server is UP Or Down.

3. Response of the server one.

Это мой код nodejs. 

const express = require('express');
const http = require('http');
const fs = require('fs');
const bodyParser = require('body-parser');
const router = express.Router();
const path = require('path');
const ejs = require('ejs');
const app = express();
const server1 = express();



server1.get('/health', function (req, res, next) {
  res.json({health: true});
   res.status(200).end();
  });

app.engine('html', require('ejs').renderFile);
app.set('view engine', 'html');
app.get('/', (req,res) => {
    res.render('index');
    console.log('server two')
  })

server1.listen(8080);
app.listen(8081);

Часть Ajax: 

var xmlhttp = new XMLHttpRequest();

    xmlhttp.onreadystatechange = function() {
        if (xmlhttp.readyState == 4) {   
           if (xmlhttp.status == 200) {
               document.getElementById("#demo1").innerHTML = xmlhttp.responseText;
           }
           else if (xmlhttp.status == 400) {
              alert('There was an error 400');
           }
           else {
               document.getElementById('demo1').innerHTML = 'something else other than 200 was returned';
           }
        }
    };

    xmlhttp.open("GET", "http://localhost:8080/health", true);
    xmlhttp.send();

HTML:

<div id="demo1"></div>

Что именно нужно сделать, чтобы отобразить состояние здоровьяserver1 в пользовательском интерфейсе.

Ответы [ 2 ]

1 голос
/ 12 апреля 2019

Я написал и опубликовал Node-приложение с React-интерфейсом, которое делает именно это.Это чисто открытый исходный код и бесплатное использование.

Он позволяет вам определять список веб-сайтов, веб-приложений, конечных точек API и серверов для мониторинга в JSON.

Интерфейс React предоставляет панель инструментовпоказывая состояние каждого актива.Бэкэнд будет периодически вызывать каждый «актив» в вашем списке и записывать состояние и время ответа, а также передавать результаты любому подключенному клиенту через Sockets.io.

Не стесняйтесь устанавливать как пакет NPM или переходить наGitHub и клонируйте репозиторий.

Я понимаю, что вам может не потребоваться готовое решение, поэтому не стесняйтесь взглянуть на мой код, чтобы помочь вам в создании собственного решения.

NPM Link

GIT HUB Link

Запуск примера на Heroku

1 голос
/ 12 апреля 2019

Вы можете создать определенный маршрут, который будет вызываться на конкретном setInterval() вашим интерфейсным javascript. Этот маршрут может вернуть JSON с массивом ошибок, если таковые имеются. Что-то вроде: 

app.get('/health-check', (req,res) => {
    // check database connectivity and any other staff you want here 
    // add any errors in an array
    if (errors.length > 0) {
       return res.status(500).json({health: false, errors: errors});
    }
    return res.status(200).send({health: true});
  });

Будьте осторожны, так как могут существовать ошибки, которые вы не хотите показывать своему пользователю. Это будет зависеть от типа приложения и т. Д.

Затем выполните AJAX-вызов из вашего JS-кода в функции setInterval(). Реализация этого будет зависеть от используемой вами библиотеки / фреймворка, но использование jquery, например, будет выглядеть так: 

const healthTimer = setInterval(() => {
  $.ajax({
    url: "[your server url]/health-check",
    type: "GET",
    success: function(xml, textStatus, xhr) {
        // get the server status here if everything is ok
        $('div.server-health span.success').text(`Server Status: ${xhr.status}`);
        $('div.server-health span.error').text('');
        console.log('RESPONSE CODE:', xhr.status);
    },
    error: function (request, status, error) {
        // handle the error rendering here
        $('div.server-health span.error').text(`Server Status: ${status}`);
        $('div.server-health span.success').text('');
        alert(request.responseText);
    }
});
}, 15000); // send the request every 15 seconds

Внутри html-файла у вас может быть <div> для отображения работоспособности сервера: 

<div class="server-health">
  <span class="error"></span>
  <span class="success"></span>
</div>
...