nginx過濾url實現前臺js的配置問題

時間 2019-12-06

標籤 nginx 過濾 url 實現前臺配置問題欄目 Nginx 简体版

原文原文鏈接

咱們在開發的過程當中,可能須要一些配置,這些配置可能就是僅僅爲了開發的方便,比方說,訂單過時時間,生產環境須要半小時失效,可是真正開發時,我不可能等上個半小時,因此這個時間這個失效時間咱們會寫在配置文件中,這樣開發環境和生產環境各一套配置,來回切換很方便的.javascript

基於摘要裏的,在Java後臺實現很方便,只須要讀取properties配置文件便可html
可是在前臺js,js是在瀏覽器裏執行的,沒法讀取服務器上的配置,除非請求後臺,可是每次的開銷也是挺大的,因此這個想法被ps了java
這時候能夠利用nginx,前臺靜態頁面是部署在nginx中,因此咱們能夠配置nginx過濾某個js的url,而後指向咱們須要的文件nginx

前臺代碼api

index.html

<!-- 即配置文件 -->
<script src="/config.js"></script>
<!-- 動態加載js -->
<script type="application/javascript">
    if (config.devMode == 'dev') {
        loadJs("開發環境的js");
    } else {
        loadJs("開發環境的js");
    }    

    function loadJs(url, callback) {
        // 實現
    }
</script>

配置文件(生產環境配置和開發環境的配置在不一樣路徑下,可是文件名同名)瀏覽器

var config = {
    // 或者 prd
    devMode: 'dev',
    // 還能夠配置請求後臺的url前綴
    serverUrl: 'http://dev.company.com'
    // serverUrl: 'http://api.company.com'
}

nginx的配置服務器

server {
    listen       80;
    server_name  www.company.com;

    location / {
        root /Users/sunhao/Documents/company/project;
        index index.html;
        try_files $uri $uri/ /index.html;
        expires -1;
    }
}
server {
    listen       80;
    server_name  debug.company.com;

    location / {
        root /Users/sunhao/Documents/company/project;
        index index.html;
        try_files $uri $uri/ /index.html;
        expires -1;
    }

    location ~ .flower\.js$ {
        root /Users/sunhao/Documents/company/project/js;
    }
}