比如靜態(tài)資源圖片位于/mnt/software/nginx/html/static/images目錄下，那么nginx.conf中的配置則為：

    # 靜態(tài)文件目錄
      location /static/images/ {
        root    /mnt/software/nginx/html;
        try_files $uri $uri/ =404; #找不到時提示404
      }

當前端發(fā)起的請求地址中帶有 /static/images/時，則到 /mnt/software/nginx/html目錄下的子目錄/static/images/進行查找，圖片存儲的絕對地址為：/mnt/software/nginx/html/static/images/文件名稱。nginx會將它們組合起來，location部分配置的請求路徑的地址，root配置的該地址在服務(wù)器哪個根目錄下。

如果nginx使用的是docker運行，那么root中配置的地址必須是docker容器中nginx靜態(tài)資源地址，而不是掛載的宿主機的地址。docker啟動命令最好包含掛載地址。像下面的啟動命令：

docker run -p 80:80 -p 443:443 --name nginx \
-v /mnt/software/nginx/html:/usr/share/nginx/html \
-v /mnt/software/nginx/logs:/var/log/nginx \
-v /mnt/software/nginx/conf:/etc/nginx \
-v /opt/files/imFilePath:/opt/files/imFilePath \
-d nginx:1.10

 上面的啟動命令中，將80和443端口映射到主機，如果未映射443端口會導致https無法訪問，

然后分別將nginx里面的html掛載到宿主機指定目錄，用于存放前端項目如vue的dist，還有靜態(tài)資源，logs掛載到宿主機上方便查看nginx日志，還有配置文件，最后一個/opt/files/imFilePath用于上傳文件也掛載到宿主機上。

 可以在宿主機目錄 /mydata/nginx/html目錄下新建static文件夾存放靜態(tài)資源如images,css,js。由于 /mydata/nginx/html對應docker里邊nginx的/usr/share/nginx/html目錄，會將資源同步到容器里邊，此時nginx.conf配置靜態(tài)資源訪問時，只需添加如下代碼：

# 靜態(tài)文件目錄
      location /static/images/ {
        root    /usr/share/nginx/html;
        try_files $uri $uri/ =404; #找不到時提示404
      }

而不是下面的配置：

# 靜態(tài)文件目錄
      location /static/images/ {
        root    /mydata/nginx/html;
        try_files $uri $uri/ =404; #找不到時提示404
      }

location中root 和 alias 的區(qū)別

• root：使用 root 指令時，Nginx會將其值與請求的 URI 拼接起來。例如，訪問 /resource/image/test.png 時，Nginx會將請求路徑 /resource/image/ 和 root 中指定的路徑 /mnt/files/imFilePath 拼接起來，形成 /mnt/files/imFilePath/resource/image/test.png。

• alias：與 root 不同，alias 會把匹配的路徑直接替換為指定的路徑。適用于靜態(tài)資源路徑的映射。例如，訪問 /resource/image/test.png 時，Nginx會將請求路徑 /resource/image/替換為 /mnt/files/imFilePath/resource/image/。

alias的配置：

location /resource/image/ {
    alias /mnt/files/imFilePath/resource/image/;
    try_files $uri $uri/ =404;
}

到此這篇關(guān)于nginx配置靜態(tài)資源的訪問的實現(xiàn)的文章就介紹到這了,更多相關(guān)nginx 靜態(tài)資源訪問內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

最新評論