current position:Home>Still working on nginx configuration? Try this visual configuration tool. It's really powerful!

Still working on nginx configuration? Try this visual configuration tool. It's really powerful!

2022-04-29 06:08:41macrozheng

Nginx It's a very popular Web The server , As a programmer, I'm sure you're dealing with it . When I use Nginx In the process of , I always think its configuration is troublesome , Especially in Linux On the server vim When you configure it by hand ! Recently found an open source Nginx Visual configuration tool NginxConfig, Can be easily generated Nginx To configure , I recommend it to you !

SpringBoot Actual e-commerce projects mall(50k+star) Address :

NginxConfig brief introduction

NginxConfig It's called The only thing you need Nginx Configuration tool , You can use a visual interface to generate Nginx To configure , Very powerful , stay Github Previous 15K+Star

Here is NginxConfig An effect picture in the process of use , You can have a look at !


Next, I will introduce NginxConfig Installation , stay Linux It's easy to install it on .

install Node.js

because NginxConfig It's based on Vue Front end projects , First we have to install Node.js.

  • After downloading successfully, unzip the installation package to /usr/local/src/ Under the table of contents , Use the following command ;
cd /usr/local/src/
tar xf node-v16.14.2-linux-x64.tar.xz
cd node-v16.14.2-linux-x64/
./bin/node -v
  • Use ./bin/node -v Command to view the currently installed version ;

  • If you want to Linux Run it directly from the command line , You need to node and npm Command to create soft links ;
ln -s /usr/local/src/node-v16.14.2-linux-x64/bin/node /usr/bin/node
ln -s /usr/local/src/node-v16.14.2-linux-x64/bin/npm /usr/bin/npm
node -v
npm -v
  • After creation, use the command to view the version , thus Node.js installation is complete .

install NginxConfig

Node.js After installation , You can start the installation NginxConfig 了 .

  • After downloading, extract to the specified directory , And use npm Command to install dependencies and run ;
tar -zxvf
npm install
npm run dev
  • NginxConfig After running successfully, you can directly access , It's good to see that the interface supports Chinese , Access address :


Next, let's experience NginxConfig Visual configuration generation function , See if it's strong enough !

Preparation for use

  • First we need to install Nginx,Nginx For the installation of, please refer to the previously written Nginx Use the tutorial ;
  • We will implement the following functions , Access static websites in different directories through static proxy , Access through dynamic proxy SpringBoot Provided API Interface ;
#  Static proxy , visit mall Document site
#  Static proxy , visit mall The front-end project
#  A dynamic proxy , visit mall on-line API
  • Need to modify this machine in advance host file .

Document website configuration

Let's configure mall Access to documentation websites , The domain name is
  • stay NginxConfig Good choice Preset For the front end , Then modify the service configuration , Configure the site 、 Path and running Directory ;

  • Unwanted HTTPS You can choose not to enable ;

  • And then in Global configuration -> Security Medium removal Content-Security-Policy Set up ;

  • Revise performance To configure , Turn on Gzip Compress , Delete resource validity limit .

Front end website configuration

Configure again mall Access to front-end websites , The domain name is
  • Next, let's add another site , Modify the service configuration , Others are basically consistent with the above .

API Website configuration

Finally, configure mall Of Swagger API Access to documentation websites , The domain name is
  • Continue to add a site , Modify service configuration , Just change the site name ;

  • Then enable the reverse proxy and set , Reverse proxy to online API;

  • The routing function can be turned off temporarily .

Use configuration

  • Then we can download directly NginxConfig Generate a good configuration for us ;

  • So let's see NginxConfig Give us the generated configuration content , This configuration may take a while ;

  • Click the button to download the configuration , Change your name when you're done , And then upload it to Linux Server's Nginx Configuration directory , Use the following command to unzip ;
tar -zxvf
  • You can see NginxConfig The following configuration file will be generated for us ;

  • The next... We will mall Documentation websites and mall The front-end website is put into Nginx Of html Under the table of contents , And then restart Nginx You can see the effect ;
docker restart nginx


I experienced NginxConfig Generated configuration , This handwriting free configuration , The way to generate configuration directly through the visual interface is really easy to use .NginxConfig It is worthy of high-performance configuration 、 Security 、 The stability of the NgInx The easiest way to the server !

Project address

copyright notice
author[macrozheng],Please bring the original link to reprint, thank you.

Random recommended