利用nginx把vue項目部署到局域網ip，頁面顯示空白？你的nginx真的有權限嗎

背景
在配置完nginx配置文件後，運行vue項目
發如今 127.0.0.0 能夠正常運行
但在局域網ip訪問就是頁面一片空白

後來翻閱了網上的不少解決辦法
好比說管理員權限開啓nginx
或者nginx.conf文件最開始一行加上user root wheel;
在我這裏都沒有效果

無心間打開了safari瀏覽器，發現居然在safari上顯示了正常的頁面
因而想到是否是與瀏覽器訪問本地文件的權限有關

瀏覽器報錯：

解決方法

用下面的命令開放權限

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

開放權限完成後重啓一下nginx服務

這裏提醒一點，重啓服務最好不使用reload
由於若是你一開始啓動服務的時候就沒有啓動成功，reload是不會給任何報錯的
我就摔了一個大坑

因此咱們先關掉服務，再從新開啓

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 目錄下，主進程在讀取緩存的時候因爲權限問題而沒法訪問