nginx內部訪問特性如何實現(xiàn)靜態(tài)資源授權訪問

更新時間：2024年06月19日 15:24:59 作者：左直拳

這篇文章主要介紹了nginx內部訪問特性如何實現(xiàn)靜態(tài)資源授權訪問方式,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教

nginx內部訪問特性實現(xiàn)靜態(tài)資源授權訪問

在nginx中，將靜態(tài)資源設為internal；然后將前端的靜態(tài)資源地址改為指向后端，在后端的響應頭部中寫上靜態(tài)資源地址。

近期客戶對我們項目做安全性測評，暴露出一些安全性問題，其中一個是有些靜態(tài)頁面（*.html）無須授權即可直接訪問，里面的信息一覽無遺，不安全。

這些靜態(tài)頁面都是arcgis地圖頁面，依賴arcgis for js，沒有辦法做成一般意義上的動態(tài)頁面?；蛘哒f，該項目是個老項目，目前只處于維護階段，大規(guī)模改頭換面不現(xiàn)實。

怎么辦，有沒有什么方法，不改這些靜態(tài)頁面，或者是不做大的調整，就能實現(xiàn)只有登錄后才能訪問它們呢？

看到網(wǎng)上有文章介紹，可以利用nginx的internal特性，將靜態(tài)資源設為內部訪問，即可實現(xiàn)需要鑒權才能訪問。

原理說起來也比較簡單。所謂內部訪問，是指你直接在瀏覽器輸入靜態(tài)資源地址，將無法訪問，會直接報404，只有通過后端向nginx發(fā)送特定信息才可以。而后端，我們是要登錄系統(tǒng)以后才能請求的，所以就能實現(xiàn)我們想要的效果了。

具體來說就是：

假設我們前端部署在nginx，原本我們要訪問某個靜態(tài)頁面：/A.html，現(xiàn)在不行了，要將地址改為 /api/static/getA，改而向后端請求；后端收到請求后，在響應信息頭里加上一句：

response.setHeader("X-Accel-Redirect", "/A.html");

返回；nginx接收到響應信息后，于是將/A.html最終返回。

現(xiàn)在來真的，我們要實現(xiàn)/projects/dzzhyj/index.html的鑒權訪問。

實現(xiàn)步驟

一、配置nginx

server {
    listen      8001;
    server_name 192.168.0.218;
    
        。。。
    
    location /projects/dzzhyj/ {
        alias /home/gzdd_html/gzdd/projects/dzzhyj/;#物理路徑

        location ~* \.html$ {#只設置*.html為內部訪問
            internal;
        }
    }      
}

二、修改前端代碼

<template>
  <div class="-map-container">
<!--    <iframe src="/projects/dzzhyj/index.html" ></iframe> -->
    <iframe src="/api/dzzhyj/redirect/dzzhyj" ></iframe>
  </div>
</template>

三、增加后端代碼

@Controller
@RequestMapping("redirect")
public class RedirectController {
    @GetMapping("/dzzhyj")
    public void handleDzzhyj(HttpServletRequest request, HttpServletResponse response) throws Exception {
            response.setHeader("X-Accel-Redirect", "/projects/dzzhyj/index.html");
    }
}

四、運行結果

直接訪問靜態(tài)頁面，不行

通過后端地址可以

但后端必須登錄才行

完美。

說下總結

這功能在nginx下才能使用。

其他web服務器有沒有類似機制不得而知。

但我們平時開發(fā)，用vue，都直接用npm來跑，所以后端代碼做點更改，判斷是nginx發(fā)出的請求，才做上述處理，否則跳轉：

@Controller
@RequestMapping("redirect")
public class RedirectController {
    @GetMapping("/dzzhyj")
    public void handleDzzhyj(HttpServletRequest request, HttpServletResponse response) throws Exception {
        String xForwardedForHeader = request.getHeader("X-Real-IP");
        if (xForwardedForHeader != null && !xForwardedForHeader.isEmpty()) {
            // 請求經(jīng)過了 Nginx
            response.setHeader("X-Accel-Redirect", "/projects/dzzhyj/index.html");
        } else {
            // 請求未經(jīng)過 Nginx
            String[] hosts = request.getHeader("X-Forwarded-Host").split(",");
            String url = String.format("http://%s/projects/dzzhyj/index.html",hosts[0]);
            response.sendRedirect(url);
        }
    }
}

其實沒有方法能直接判斷請求是否來自nginx，我是比較了從node發(fā)出的請求和從nginx發(fā)出的請求所包含的鍵值，看其中有沒有包含“X-Real-IP”，簡單地做了一下判斷，不一定對。

1）vue運行時的請求request結構