利用nginx把vue项目部署到局域网ip,页面显示空白?你的nginx真的有权限吗

背景
在配置完nginx配置文件后,运行vue项目
发现在 127.0.0.0 可以正常运行
但在局域网ip访问就是页面一片空白

后来翻阅了网上的很多解决办法
比如说管理员权限开启nginx
或者nginx.conf文件最开始一行加上user root wheel;
在我这里都没有效果

无意间打开了safari浏览器,发现竟然在safari上显示了正常的页面
于是想到是不是与浏览器访问本地文件的权限有关

浏览器报错:
利用nginx把vue项目部署到局域网ip,页面显示空白?你的nginx真的有权限吗

解决方法

用下面的命令开放权限

sudo nginx -s stop
sudo chmod -R 777 /usr/local/var/run/nginx/*
nginx

利用nginx把vue项目部署到局域网ip,页面显示空白?你的nginx真的有权限吗

开放权限完成后重启一下nginx服务

这里提醒一点,重启服务最好不使用reload
因为如果你一开始启动服务的时候就没有启动成功,reload是不会给任何报错的
我就摔了一个大坑

所以我们先关掉服务,再重新开启

利用nginx把vue项目部署到局域网ip,页面显示空白?你的nginx真的有权限吗

sudo nginx -s stop
sudo nginx

这样就成功解决啦~

原因

nginx 反向代理配置的参数说明
proxy_connect_timeout 600;              #nginx跟后端服务器连接超时时间(代理连接超时时间长度)
proxy_read_timeout    600;              #连接成功后,后端服务器响应时间(代理接收超时时间长度)
proxy_send_timeout    600;              #后端服务器数据回传时间(代理发送超时)
proxy_buffer_size     666k;              #设置代理服务器(nginx)保存用户头信息的缓冲区大小
proxy_buffers         666k;            #proxy_buffers缓冲区,网页平均在666k以下
proxy_busy_buffers_size  666k;           #高负荷下缓冲大小(建议设置大小proxy_buffers*2)
proxy_temp_file_write_size  666k;      #设定缓存文件夹大小

当加载的文件量超过proxy_temp_file_write_size所设置的值时,nginx会将文件写入缓存到proxy_temp文件夹中。
然而对这个目录没有读写权限,nginx 的工作进程对大文件做了缓存,这个缓存在 %nginx%/proxy_temp 目录下,主进程在读取缓存的时候由于权限问题而无法访问

相关推荐