Использование WebUI для Nginx: обзор веб-интерфейсов

Nginx - это популярное ПО для создания веб-серверов, на котором размещено почти 34% всех сайтов в интернете. Nginx используют в частной и корпоративной IT-инфраструктуре для запуска сайтов и настройки прокси. Работа через Nginx требует определенных технических навыков, ведь управление сервером происходит через редактирование конфигурационных файлов и работу в терминале. 

Решить эти задачи помогают веб-интерфейсы управления Nginx. Они позволяют настроить сервер, следить за его состоянием и редактировать конфигурации из браузера в привычной графической среде. 

В статье рассмотрим два популярных веб-интерфейса: Nginx UI и Nginx Proxy Manager и покажем как установить Nginx.

Выгоды использования Nginx UI и Nginx Proxy Manager

Подобные веб-интерфейсы подходят для использования в различных случаях. Например, если недостаточно серверных или финансовых ресурсов для размещения систем мониторинга и визуализации. Они позволяют собирать понятные данные о состоянии вашего веб-сервера.

Также через панель управления можно редактировать конфигурации сайтов, размещенных на веб-сервере, что повышает безопасность сервера. Пропадает необходимость  создавать отдельных пользователей в ОС, выдавать им права и следить за их действиями. В конечном счете благодаря веб-интерфейсам, минимизируется перечень используемого в работе ПО, ведь доступ до панели управления осуществляется через веб-браузер

Функциональность Nginx UI

Nginx UI – веб-сервер с открытым исходным кодом, представляющей собой простое и многофункциональное решение по управлению, мониторингу и администрированию серверов nginx. Проект реализован на Go и Vue.js.

Основные возможности:

• Создание и редактирование виртуальных сайтов.
  
  
• Поддержка Let’s Encrypt и SSL-сертификатов.
  
  
• Мониторинг ресурсов: памяти, диска, сети, CPU.
  
  
• Файловая структура сервера не меняется — все остается в стандартной папке /etc/nginx.

Установка Nginx UI

Выполним установку Nginx UI на виртуальном сервере под управлением ОС Ubuntu 22.04.5 с установленным nginx. Обратите внимание: Nginx UI не поддерживается на Nginx Windows — для этой ОС потребуется отдельная настройка вручную. 

Для установки в терминале сервера выполним команду 

bash -c "$(curl -L https://raw.githubusercontent.com/0xJacky/nginx-ui/main/install.sh)" @ install

Начнется установка сервиса. После этого он автоматически начнет работу на порту 9000 tcp. 

Для удаления панели выполните команду:

bash -c "$(curl -L https://raw.githubusercontent.com/0xJacky/nginx-ui/main/install.sh)" @ remove

Веб-панель представляет собой бинарный файл и systemd-юнит для управления внутри ОС. Скрипт загружает конфигурацию, формирует systemd-демон и запускает его. Все данные хранятся в базе данных sqllite вместе с конфигурацией.

Файл конфигурации по умолчанию расположен по пути /usr/local/etc/nginx-ui/app.ini.  В нем можно изменять параметры панели: переключить с http на https, изменить порт подключения, включить ротацию логов и другое.

Подключимся к интерфейсу по ссылке: http://<IP-адрес>:9000. Появляется окно для завершения настройки. В нем необходимо указать имя пользователя с правами администратора, его почтовый адрес, пароль и, опционально, название базы данных.

Далее открывается форма авторизации в системе. Для первичного входа в систему используются данные, введенные на предыдущем шаге. После успешной авторизации попадаем на главную страницу, где расположены графики потребления памяти, дискового пространства и swap, а также графики сетевой нагрузки и загрузки IOPS и базовые сведения о системе.

Работа с конфигурациями

Функционал изменения содержания конфигурационного файла реализован в виде текстового редактора с интеграцией Chat GPT. Подключить нейросеть можно в конфигурации самого Nginx UI. Открытие папки или файла происходит через кнопку Modify в правой части строки с файлом или папкой.

Конфигурации проходят автоматическое тестирование. После изменения файл можно сразу же отправить «в продакшн», нажав соответствующую кнопку.

В панели используется локальная база пользователей, которых можно создавать, изменять и удалять в отдельном меню. Поддерживается включение двухфакторной авторизации с Google Authenticator. Для работы в веб-терминале будет необходимо авторизоваться дополнительно, используя созданную в ОС учетную запись.

Резервное копирование и восстановление

Еще в панели предусмотрен функционал создания резервных копий конфигураций nginx и UI. Сделать это можно в соответствующем меню

Резервная копия создается через кнопку Create Backup

На компьютер будет загружен zip-архив с конфигурациями и потребуется сохранить токен восстановления, который отобразится на экране – без него восстановить настройки сервера Nginx не удастся

Для восстановления необходимо перенести архив в соответствующее поле, ввести токен, выбрать, что будет восстановлено: 

• настройки nginx 
• настройки UI
• и то, и другое. 

После нажатия на кнопку Start Restore выбранные настройки будут восстановлены, а Nginx перезапущен.

Данная веб-панель это своего рода «швейцарский нож» для управления веб-сервером Nginx. Через нее администратор может мгновенно получать данные о состоянии сервера, следить за потреблением ресурсов, изменять конфигурации, просматривать логи nginx в удобном читабельном формате. При необходимости, можно подключиться к терминалу ОС. Решение имеет современный графический интерфейс и встроенную интеграцию с Chat GPT, который поможет избежать ошибок в конфигурации. 

Nginx Proxy Manager: управление прокси через веб

Второй представитель веб-интерфейсов для Nginx – Nginx Proxy Manager. Решение предназначено для настройки сервера и управления Nginx в случае, когда он используется в качестве proxy-сервера. Продукт выполнен в виде docker-контейнера – для его установки на сервере потребуется развернуть docker.

Установка и настройка Nginx Proxy Manager

Для обзора будем использовать сервер с ОС Ubuntu 22.04.5 и установленными Docker и плагином Docker Compose. Такой вариант отлично подходит для задач, связанных с настройкой Nginx Ubuntu, включая управление прокси-хостами через удобный веб-интерфейс.

Подключимся к серверу с docker и создадим файл с расширением *.yml: touch compose.yml и откроем его:

touch compose.yml
sudo nano compose.yml

services:
app:
image: 'jc21/nginx-proxy-manager:latest'
restart: unless-stopped
ports:
- '80:80'
- '81:81'
- '443:443'
volumes:
- ./data:/data
- ./letsencrypt:/etc/letsencrypt

В данной конфигурации мы указали следующие параметры:

• Образ, который будет загружен (jc21/nginx-proxy-manager) последней версии
• Порты, которые будут прослушиваться контейнером: tcp 80 – порт HTTP, tcp 443 – порт HTTPS и tcp 81 – порт для подключения к веб-панели администратора. 
• Два примонтированных тома из хостовой ОС для хранения данных и сертификатов

Подобная конфигурация заявлена разработчиком как минимально необходимая.

Закроем файл и выполним создание контейнера:

docker compose up -d

Проверим, что контейнер запущен и работает:

docker ps

Nginx proxy manager docker запущен и теперь подключимся к веб-панели администратора по адресу: http://<IP-адрес_сервера>:81 и попадаем на страницу авторизации.

Для первого входа вводим учетные данные по умолчанию: admin@example.com и пароль changeme

После авторизации нам предлагают изменить информацию об администраторе. Обязательно должен быть изменен адрес электронной почты – другие поля могут остаться без изменений. Далее задаем новый пароль. После чего оказываемся в главном окне.

В окне нет графиков – только сводная статистика по количеству управляемых и недоступных хостов, количеству потоков и хостов пересылки.

Добавить proxy-хост можно в меню Hosts -> Proxy Hosts -> Add Proxy Host

В открывшемся меню необходимо указать

•  доменное имя, по которому будут обращаться пользователи
• Адрес или доменное имя хоста и порт, на который будет выполняться пересылка с указанного выше доменного имени
• Протокол: http или https

В качестве дополнительных параметров можно указывать Access List, содержащий правила доступа до хоста, блокировку общеизвестных веб-угроз и поддержку веб-сокетов, если таковую требует приложение, находящееся за Proxy.

Access List и SSL

Также в отдельном меню можно указать SSL-сертификаты и связанные с ними опции — именно здесь осуществляется ssl настройка nginxдля нужных доменов. 

После добавления данных нажимаем Save и наш хост добавлен.

Для создания списка контроля доступа, необходимо перейти в меню Access List и нажать на кнопку «Add Access List»

Во вкладке Details можно указать имя списка и выбрать два параметра: Satisfy Any и Pass Auth to Host

Во вкладке Authorization укажите параметры для простой авторизации через модуль Nginx ngx_http_auth_basic_module

Во вкладке Access выполняется настройка самого списка контроля доступа, указывая IP-адреса и подсети и сопоставляя им действия: allow – разрешить доступ и deny – запретить доступ.

Список построен по принципу – что не разрешено, то запрещено. Правила выполняются сверху вниз до первого совпадения источника.

В меню SSL Certificates осуществляется управление SSL сертификатами, которые используют сайты.

Во вкладке Users происходит управление локальными пользователями системы.

В меню Audit Log можно просмотреть локальные логи.

Во вкладке Settings можно настроить, какую страницу будет видеть пользователь при запросе на несуществующий адрес на наш Proxy.

В заключении можно подметить, что продукт, хоть и не имеет обширного функционала для мониторинга состояния сервера и требует дополнительного ПО для работы, но значительно упрощает конфигурацию пограничного proxy сервера на базе nginx, имея при себе функционал блокировки общеизвестных атак и встроенные списки контроля доступа. И со своими задачами ПО справляется хорошо.

В статье рассмотрены два совершенно разных продукта, имеющих различный функционал и предназначенный для разных задач, но одно они имеют общее – благодаря им, настройка Nginx становится куда проще и понятнее. Сервисы имеют приятный графический интерфейс, что упрощает с ними работу. Установка подобных решений поможет вам упростить взаимодействие с Nginx.