nginx 根據 URL 參數引入不同的文件

同步發布：https://blog.jijian.link/2020-06-30/nginx-import-file/

編程世界中各種奇奇怪怪的需求都有，本次遇到一個需求：根據URL參數判斷，包含 xxx=00001 的頁面上，引入的 test.js 文件要去掉一部分代碼，但是帶有參數和不帶參數的頁面 js 鏈接都為 http://localhost/test.js。意思就是同一個 test.js 需要根據頁面 URL 參數不同，返回不同的內容。並且不能在 js 里面添加判斷，因為 js 代碼里面的判斷一眼就能看出來。

方案一：test.js文件改為動態內容

test.php 示例：

<?php
$js = file_get_contents('./test.js');
$referer = parse_url($_SERVER['HTTP_REFERER']);
parse_str($referer['query'], $query);
if ($query['xxx'] === '00001') {
  // 需要替換的內容
  $js = str_replace(1, 1123, $js);
}
echo $js;
?>

這樣也可以達到替換效果，但是有個問題必須修改 http://localhost/test.js 為 http://localhost/test.php。

作為一個瑟瑟發抖的小前端，終於想起了 nginx 這個神器，還好生產環境也有 nginx，搗騰了一下，最終實現如下：

方案二：使用 nginx 配置不同文件

server {
  # xxxxxxx
  # xxxxxxx
  set $test "D:/www/test.js";
  if ($http_referer ~* "xxx=00001") {
    set $test "D:/www/test1.js";
  }
  location /test.js {
    alias   $test;
    add_header Cache-Control "private, no-store, no-cache, must-revalidate, proxy-revalidate";
    add_header Pragma no-cache;
    add_header Expires 0;
  }
}

此配置的大概意思是：如果 referer 包含 xxx=00001，那么就返回 D:/www/test1.js 否則返回 D:/www/test.js。

后三行的 add_header 作用告訴瀏覽器不緩存此文件。當然這個配置也有個問題，就是 js 文件不會被緩存，每次請求都會重新加載，會影響加載速度，酌情考慮是否需要此配置。