一文彻底搞懂Nginx的.conf文件路径配置_nginx配置文件路径

前言：最近在Nginx上部署Vue项目，同时还存了一些静态资源，但我查了好久都没找到一篇详细介绍路径配置的文章，因此就根据我有限的经验写了这篇文章，希望能够对读者有所帮助

详解server中各部分作用及如何配置

如下图所示，这是我配置好的一个server代码块，我这里配置了https，所以会比默认的多一部分内容，如果你只需要配置http，则只需关注红色方框的部分即可，下面会按顺序讲解。

①listen项

用来配置端口号的，常见端口号如 http 是80端口， https 是443端口，如图所示，可以配置多个端口，表示通过这些端口都可以请求到。

注意事项：

如果是80端口或443端口，是不需要写在路径中的，因为完整路径前的http或https就表明了端口；

但如果配置了静态资源是其他端口，如 8080 端口，则需要在访问时加上端口号才能请求到

例子：

配置文件：

访问路径：

②server_name项

如果要配置域名就写域名，没有域名就写localhost，这一项决定了访问路径中的协议和端口之间的内容，也就是下图的内容（我这里配置了域名）

如果写的是localhost，则可以在路径上通过 部署到的电脑的IP地址 进行访问，就是把上图的域名替换为ip地址进行请求

③location 后的路径项

这一项决定了访问路径的填写和访问到的资源路径两方面，后者一般需要和第④项结合着理解，一下还会提及

简单而言，我推荐的写法是 “/+你想写的符号”，如下：

这里的rotograph就是 “你想写的符号”

而这个符号决定了访问路径，如按上图，那么我的访问路径就是

也就是说这个符号在访问路径中处于端口号的后面，而其所访问的就是你设置所指向的资源，第④项会说的。

注意事项：

那么当我们不写符号时，也就是 location / 这样，则在访问路径的端口号后不需要任何东西就可以访问到指定的资源，就是通常理解的“首页”

而如果我们配置了多个location块，而其后的符号都是相同的，这时会遵循长路径优先匹配原则，也就是输入网址，会优先匹配到指定资源路径更长的那个

④root 项

这一项填写的是根路径，其实还有另外一项，叫 alias，它们的区别可以见 root和alias的区别 这篇文章（不保真）。

这里主要说一下root，它会结合第③项配置的路径，从而得到指定要访问的资源路径的真实地址。

例子：

那么，我想通过 http://xxx:端口名/rotograph 这个路径来访问这个资源怎么办？

将根路径设置成 /usr/show 即可，这里千万注意不要漏掉前面的 /，写成 usr/show是不对的。

注意事项：

如果我们在root项中前面没有写 /（默认的就没写），那么会访问到哪里呢？

其实Nginx有一个默认站点目录，一般为 /usr/share/nginx/html ，所以你将默认的文件中的html改成这个路径，也会返回Nginx的那个页面，我猜测，如果不写 /，那么所有root后的配置路径在访问时都会在前面被拼接一个 /usr/share/nginx/，如下所示：

这个配置路径前没有 / ，那么其访问的真实资源地址就是下图红框中的地址

所以，如果我们想把项目部署到别的目录，那么配置root项时路径前一定要加 / ！

如下：

这样配置，就只需将项目部署到如下地址 /webapp/vue1中即可。

⑤index项

这一项最简单，就是定位到指定资源目录后，你想展示那个文件，如我设置 index.html就展示名为 index.html的文件，我也可以设置成 pic1.jpg，那么就展示一张图片

注意事项：

配置到index项的文件是不需要在路径中写出的，会自动展示，如下：

配置：

访问效果：

后记

综上，只要给出想要访问的资源，那么就很容易配置location块，只需要将指定资源地址合理划分就能得到第③项和第④项了，如下：

将红色框中路径作为root项，将黄色框中/img作为location后的路径项，就可以轻松通过 http://ip地址:端口号/img访问到该目录啦~

以上就是这篇文章的全部内容了，希望能够对你有所帮助，如果你喜欢这篇文章的话，求赞、求收藏、求评论、求分享，最重要的是点一个大大的关注，各位的支持就是我写博客的最大动力，ok各位，我们下篇再见！