通过nginx配置Vue nginx报403问题的解决方法

最新推荐文章于 2024-07-15 19:03:07 发布

Magic1an

最新推荐文章于 2024-07-15 19:03:07 发布

阅读量1.1w

点赞数 2

分类专栏：开发文章标签： vue

本文链接：https://blog.csdn.net/Magic1an/article/details/100936962

版权

开发专栏收录该内容

3 篇文章 0 订阅

订阅专栏

今天在服务器上通过子目录部署vue build后的文件时，遇到了部署后访问该路径报403 Forbidden的问题。具体情况如下：

nginx的版本为1.17.3

此时nginx.conf的配置情况

server {
                listen  5000;
                server_name     localhost;
                location /manager {
                        alias   /home/xxxx/Project/vue/dist;
                        index   index.html;
                        try_files   $uri $uri/ /index.html;
                }
        }

最终找到问题是由于try_files 中包含有$uri/的文件夹，此时如果去掉$uri/，nginx便会正常运行，但是这时候因为alias配置的为一个文件夹，而try_files又不包括文件夹，所以nginx会无法正确匹配到index.html。

所以只是去掉$uri/并不是最好的解决办法。之所以去掉$uri/便可以正常运行的原因是因为nginx会自动为文件夹下的文件创建索引，但是nginx创建索引的配置默认是关闭的，所以nginx自己会把自己给禁止掉，最终导致403错误的发生。因此我只需要在配置中打开创建索引就可以了。最终配置如下：

server {
                listen  5000;
                server_name     localhost;
                location /manager {
                        autoindex on;
                        alias   /home/xxxx/Project/vue/dist;
                        index   index.html;
                        try_files   $uri $uri/ /index.html;
                }
        }

success！