Preface
I am currently used to two deployment methods for nginx: BT Panel and Docker. Among them, nginx on BT Panel is mainly used for SSL decryption and reverse proxy, focusing on convenience (for detailed configuration steps, see:Linux Panel Series: Configuring Reverse Proxy and Publishing Using Non-443 Ports); nginx deployed via Docker is mainly used together with PHP, which is also deployed via Docker, to meet my website building needs (for detailed configuration steps, see:Docker Series: Single-container Nginx, Single-container PHP (one version) Multi-site Sharing)。
However, because the community edition of SafeLine WAF does not support load balancing:
Only the professional edition supports multiple upstream servers (the professional edition costs over 1,500 RMB a year), which I can't afford, so I have to add another load balancer under the SafeLine WAF to achieve this.
There are two load balancing methods to choose from:
Zevenet Community Edition:
The advantage of Zevenet is that it has a graphical interface, and the common features of the community edition work fine. However, I always feel that Nginx is relatively more lightweight, and Nginx can do more things.
nginx
The upstream feature of nginx can achieve general load balancing, but it lacks a graphical interface, which is quite annoying. Although writing configurations is not difficult, after getting used to configuring GUIs like F5 and A10, writing configuration files directly always feels awkward, and it's not easy to demonstrate or take screenshots. So I couldn't help but think, it would be great if nginx had a graphical interface...
At this time, I discovered nginxwebui (project address:https://github.com/cym1102/nginxWebUI)：
The official description is as follows:
nginxWebUI is a tool for graphical management of nginx configurations. You can use web pages to quickly configure various functions of nginx, including HTTP protocol forwarding, TCP protocol forwarding, reverse proxy, load balancing, static HTML servers, automatic SSL certificate application, renewal, and configuration. Once configured, it can generate the nginx.conf file with one click, and can control nginx to start and reload using this file, completing the closed loop of graphical control for nginx.
This sparked great interest in me, and this article is a record of my process of researching and playing around with nginxwebui.
Deploy nginxwebui
nginxwebui can be deployed under Linux and Windows, requiring separate installations of nginx and Java environments; it can also be deployed via Docker. As per my usual practice, if Docker is available, I prioritize Docker, so this article will directly deploy it using Docker.
Pre-deploy nginxwebui
First, use the simplest command to create nginxwebui:
docker run --name nginxwebui -d -e BOOT_OPTIONS="--server.port=8080" --privileged=true cym1102/nginxwebui:latest
Then copy the/home/nginxWebUIdirectory inside the container to the host machine's/dockerdirectory:
docker cp nginxwebui:/home/nginxWebUI /docker
The purpose of doing this is to first copy out the contents of the folders required for the normal deployment of nginxwebui, because if you directly use the -v parameter to mount an empty folder from the host machine into the container, the container won't start at all.
Delete the container:
docker stop nginxwebui
docker rm nginxwebui
Formally deploy nginxwebui
The Docker format command is as follows:
docker run --name nginxwebui -d --restart=always \
-v /docker/nginxWebUI:/home/nginxWebUI \ #挂载宿主机目录到容器内部
-e BOOT_OPTIONS="--server.port=8080" \ #参数可填充java启动参数, 可以靠此项参数修改端口号;--server.port 占用端口, 不填默认以8080端口启动
--privileged=true \ #给于容器内的root用户真正的root权限
-p 80:80 -p 443:443 -p 8080:8080 \ #其实nginxwebui的作者推荐使用host模式，但是我只用得到80和443以及8080(8080是管理端口)，所以我就指定了这3个端口，大家可以根据自己的实际环境修改映射的端口
cym1102/nginxwebui:latest /bin/bash
docker run --name nginxwebui -d --restart=always \
Configure nginxwebui
Initialize nginxwebui
Usehttp://宿主机ip:8080-v /docker/nginxWebUI:/home/nginxWebUI \ # mount host directory to container interior
-e BOOT_OPTIONS="--server.port=8080" \ # parameter can fill Java startup parameters, can modify port number via this parameter; --server.port occupied port, if left blank, starts with port 8080 by default
--privileged=true \ # give the root user inside the container true root privileges
-p 80:80 -p 443:443 -p 8080:8080 \ # actually the author of nginxwebui recommends using host mode, but I only need 80, 443, and 8080 (8080 is the management port), so I specified these 3 ports, you can modify the mapped ports according to your actual environment
Pre-configuration
Local - Reverse Proxy (server)
cym1102/nginxwebui:latest /bin/bashwww.example.comNote: Please remove # and the subsequent comments yourself
Local - Stream Parameter Configuration
Log in to nginxwebui:
Log in with the newly created account:
Below is the interface of nginxwebui:
Local - Load Balancing (upstream)
A user tutorial is thoughtfully provided in the top right corner:
Then set it in the reverse proxy menu:
If it is Layer 4 load balancing, you need to select the forwarding type as tcp/udp when creating an upstream group:
Then set it in the reverse proxy menu:
Local - Static Webpage Upload
When we want to deploy the app using source code, we need to select ”Static HTML” as the proxy type for nginxWebUI's reverse proxy, and then use root to specify the working directory. Before doing this, we need to upload the source code files to the designated directory of nginxWebUI.
Compress the source code folder to be uploaded into a zip package format, and then specify the working directory. The -v parameter we used earlier when creating the Docker container specified the host path mounted to /home/nginxWebUI inside the container, so we can directly create an html directory under this path (using www.example.com.zip as an example):
At this point, the zip package has been automatically extracted to
/home/nginxWebUI/html/www.example.com：
Then configure it in the reverse proxy:
In the image above, the proxy target can be in root mode or alias mode. You can choose according to your own configuration habits.
Local - Certificate Management
In certificate management, you can add certificates, issue them (apply for certificates through Let's Encrypt, which only supports issuing certificates under Linux), and renew them. After enabling scheduled renewal, the system will automatically renew certificates that are about to expire (only certificates older than 60 days will be renewed). The certificate issuance usesacme.sh的dnsmode:
Local - Other Settings
There are some other settings that are very simple and clear, so I won't explain them one by one:
There are some other things, which I won't list one by one.
Local - Enable Configuration
A unique feature of nginxWebUI is that all the above configurations are actually just pre-configurations. None of the above settings have taken effect yet; you need to click ”Replace File” under the enable configuration menu for them to take effect:
After clicking ”Replace File”:
By default, all configurations are in nginx.conf. If you prefer to split them into multiple files by different domain names, you can turn on the ”Decompose files by domain name” switch:
This makes everything look much cleaner overall.
System Management - Remote Server
If there are multiple nginxWebUI servers, you can log into one of them and add the IP, username, and password of the other servers in remote management, allowing you to manage all nginx servers from a single machine.
At the same time, nginxWebUI also provides a one-click synchronization function, which can synchronize the data configuration and certificate files of a certain server to other servers. The remote server interface is as follows:
Summary
Actually, everyone has a different way of configuring nginx. For example, I am more used to building websites directly using the official nginx via Docker, and using nginxWebUI would actually reduce my efficiency. However, for friends who are not so familiar with nginx configuration, I think nginxWebUI is a great helper. The graphical interface makes the configuration more intuitive and the presentation is good, making it a very nice auxiliary tool for nginx configuration. However, nginxWebUI can only cover about 90% of the common functions of nginx, and some advanced functions that are not included still need to be manually added to the final generated nginx.conf file.
I specifically use nginxWebUI for Layer 4 and Layer 7 load balancing (generally Layer 4 load balancing is enough), and the planned structure has finally been fully achieved:
