终极 Nginx 配置指南（全网最详细）

前言

对于自己上线项目的前端来说，nginx也是必须要了解和熟悉的，查了很多的nginx文章，看着写的都很详细，但是却没有了整体的概念。这里就重新梳理一遍，也理清思路。

我们在安装nginx之后，会自动生成很多的文件，但是nginx.conf这个文件是我们的核心，如何去正确的修改和优化它是nginx的核心。

首先我们可以先看下原本的配置，你会觉得无所适从，因为感觉这个鬼东西也太多了吧。而且感觉根本就不理解，也不知道该怎么写。下面，就一步一步的教你如何入门到熟悉

一.nginx.conf原本配置到解释

看到这个118行是不是觉得有点害怕

没关系，我们把其中的注释都删掉，除掉了注释之后的nginx代码，现在只有22行了。感觉好多了

二.整体基本理解

虽然上面有了注解，但是看起来还是很迷糊。接着解释：我们可以把nginx.conf分为三个部分进行理解：

• 第一部分：全局块
• 第二部分：events块
• 第三部分：http块

对应图解：

全局块：

作用：从配置文件开始到 events 块之间的内容，主要会设置一些影响nginx 服务器整体运行的配置指令，主要包括配 置运行 Nginx 服务器的用户（组）、允许生成的 worker process 数，进程 PID 存放路径、日志存放路径和类型以 及配置文件的引入等。

比如上面第一行配置的

上述例子就表示每个 work process 支持的最大连接数为 1024。

这部分的配置对 Nginx 的性能影响较大，在实际中应该灵活配置。

http块：

作用：这算是 Nginx 服务器配置中最频繁的部分，代理、缓存和日志定义等绝大多数功能和第三方模块的配置都在这里。

需要注意的是：http 块也可以包括 http全局块、server 块。

• http全局块

http全局块配置的指令包括文件引入、MIME-TYPE 定义、日志自定义、连接超时时间、单链接请求数上限等。

• server 块

这块和虚拟主机有密切关系，虚拟主机从用户角度看，和一台独立的硬件主机是完全一样的，该技术的产生是为了 节省互联网服务器硬件成本。

• 每个 http 块可以包括多个 server 块，而每个 server 块就相当于一个虚拟主机。
• 而每个 server 块也分为全局 server 块，以及可以同时包含多个 locaton 块。
• 全局 server 块

最常见的配置是本虚拟机主机的监听配置和本虚拟主机的名称或IP配置。

• location 块

一个 server 块可以配置多个 location 块。

这块的主要作用是基于 Nginx 服务器接收到的请求字符串（例如 server_name/uri-string），对虚拟主机名称 （也可以是IP 别名）之外的字符串（例如 前面的 /uri-string）进行匹配，对特定的请求进行处理。地址定向、数据缓 存和应答控制等功能，还有许多第三方模块的配置也在这里进行。

三.最简单的上线

以上，我们就知道了nginx整体大致的结构，以及每部分的结构是用于做什么的。接下来我们就修改nginx关键位置来实现我们网站的代理功能。看着nginx配置很繁琐，但是如果你只是需要上线一个网站，那么你只需要去修改两个地方即可：

我们可以使用默认简单的配置，然后指定server_name和root，主要是告诉nginx代理的ip是xxx，然后我放在服务器的文件在bbb文件夹即可。nginx便会在用户访问这个ip时，自动的将bbb文件夹中的index.html返回到浏览器来展示页面。

四.nginx优化：

1.前端history模式404问题：

这段代码的作用是，当用户刷新页面时，Nginx会先检查当前URL是否存在，如果不存在，就会尝试访问index.html，从而可以正常显示页面。

2.反向代理：

相信大家作为前端都了解跨域问题，目前前端的主流解决跨域的方式就是

1. 开发生产cors解决
2. 开发proxy，生产nginx解决。

如何配置：

理解：

这段代码的意思：大致就是如果遇到以/police请求开头的接口，那么就去访问这个ip地址(http://192.168.1.182:8852/police/)的后台端口。

例如我们通过axios去访问/police/getList这个后台接口时，nginx会将这个请求转发到ip端口为http://192.168.1.182:8852的后台中，后台将结果返回给nginx，nginx再把结果给到浏览器，实现反向代理。

定义多个端口的反向代理：

copy上面的，直接修改代理头和proxy_pass即可。

3.开启gzip：

作用：

开启gzip对于前端来说还是比较重要的，浏览器加载的包大概能节约一半的空间。例如首页需要加载a.js文件，该文件为900kb，在开启gzip之后，浏览器会去加载a.js经过gzip之后的文件a.js.gz，大概只有450kb，能够很好的提升浏览速度。

如何配置：

詳見：终极 Nginx 配置指南（全网最详细）-腾讯云开发者社区-腾讯云