前言
nginx是一款非常流行的web服务器，作为程序员我相信大家没少和它打交道。在我使用nginx的过程中，一直觉得它的配置很麻烦，尤其是在linux服务器上用vim手撸配置的时候！最近发现一款开源的nginx可视化配置工具nginxconfig，能轻松生成nginx配置，推荐给大家！
springboot实战电商项目mall（50k+star）地址：
https://github.com/macrozheng/mall
nginxconfig简介
nginxconfig号称你唯一需要的nginx配置工具，可以使用可视化界面来生成nginx配置，功能非常强大，在github上已有15k+star！
下面是nginxconfig使用过程中的一张效果图，大家可以看下！
安装
接下来介绍下nginxconfig的安装，在linux上安装它还是比较方便的。
安装node.js
由于nginxconfig是一个基于vue的前端项目，我们首先得安装node.js。
首先从官网下载node.js的安装包
下载地址：https://nodejs.org/zh-cn/download/
下载成功后将安装包解压到/usr/local/src/目录下，使用如下命令即可；
cd /usr/local/src/ tar xf node-v16.14.2-linux-x64.tar.xz cd node-v16.14.2-linux-x64/ ./bin/node -v
使用./bin/node -v命令可查看当前安装版本；
如果想在linux命令行中直接运行，还需对node和npm命令创建软链接；
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
创建完成后使用命令查看版本，至此node.js安装完成。
安装nginxconfig
node.js安装完成后，就可以开始安装nginxconfig了。
首先下载nginxconfig的安装包，
下载地址：https://github.com/digitalocean/nginxconfig.io
下载完成后解压到指定目录，并使用npm命令安装依赖并运行；
tar -zxvf nginxconfig.io-master.tar.gz npm install npm run dev
nginxconfig运行成功后就可以直接访问了，看下界面支持中文还是挺不错的，访问地址：http://192.168.3.105:8080
使用
接下来我们就体验下nginxconfig的可视化配置生成功能，看看是不是够强大！
使用准备
首先我们需要安装nginx，nginx的安装可以参考之前写的nginx使用教程 ；
我们将实现如下功能，通过静态代理访问在不同目录下的静态网站，通过动态代理来访问springboot提供的api接口；
# 静态代理，访问mall文档网站 docs.macrozheng.com # 静态代理，访问mall前端项目 mall.macrozheng.com # 动态代理，访问mall线上api api.macrozheng.com
需要提前修改下本机host文件。
192.168.3.105 docs.macrozheng.com
192.168.3.105 mall.macrozheng.com
192.168.3.105 api.macrozheng.com
文档网站配置
我们先来配置下mall文档网站的访问，域名为：docs.macrozheng.com。
在nginxconfig中选择好预设为前端，然后修改服务配置，配置好站点、路径和运行目录；
不需要https的话可以选择不启用；
然后在全局配置->安全中去除content-security-policy设置；
再修改性能配置，开启gzip压缩，删除资源有效期限制。
前端网站配置
再来配置下mall前端网站的访问，域名为：mall.macrozheng.com。
接下来我们再添加一个站点，修改下服务配置即可，其他和上面的基本一致。
api网站配置
最后配置下mall的swagger api文档网站的访问，域名为：api.macrozheng.com。
继续添加一个站点，修改服务配置，只需修改站点名称即可；
然后启用反向代理并设置，反向代理到线上api；
路由功能暂时不用可以关闭。
使用配置 接下来我们就可以直接下载nginxconfig给我们生成好的配置了；
我们先来看下nginxconfig给我们生成的配置内容，这种配置手写估计要好一会吧；
点击按钮下载配置，完成后改个名字，然后上传到linux服务器的nginx配置目录下，使用如下命令解压；
tar -zxvf nginxconfig.io.tar.gz
大家可以看到nginxconfig将为我们生成如下配置文件；
接下来将我们之前的mall文档网站和mall前端网站放到nginx的html目录下，然后重启nginx就可以查看效果了；
docker restart nginx
先访问下我们的mall文档网站，访问地址：http://docs.macrozheng.com/
在访问下mall的前端网站，访问地址：http://mall.macrozheng.com
最后访问下mall的api文档网站，访问地址：http://api.macrozheng.com/swagger-ui.html
总结
体验了一把nginxconfig的配置生成功能，这种不用手写配置，直接通过可视化界面来生成配置的方式确实很好用。nginxconfig不愧是配置高性能、安全、稳定的nginx服务器的最简单方法！
项目地址 https://github.com/digitalocean/nginxconfig.io
以上就是nginx开源可视化配置工具nginxconfig使用教程的详细内容，更多关于nginx配置可视化nginxconfig的资料请关注其它相关文章！
