!33 增加nginx 不缓存index.html&优化前端写法

Merge pull request !33 from vFeng/develop

backend/requirements.txt

@@ -1,6 +1,6 @@
 Django==4.2.7
 django-comment-migrate==0.1.7
-django-cors-headers==4.3.0
+django-cors-headers==4.4.0
 django-filter==23.3
 django-ranged-response==0.2.0
 djangorestframework==3.14.0

docker_env/nginx/my-80.conf

@@ -7,6 +7,10 @@ server {
         index index.html index.htm;
         root /usr/share/nginx/html;
         try_files $uri $uri/ /index.html;
+        # 禁止缓存html文件,避免前端页面不及时更新，需要用户手动刷新的情况
+        if ($request_uri ~* "^/$|^/index.html|^/index.htm") {
+             add_header Cache-Control "no-store";
+        }
     }
 
     location ~ ^/api/ {

docker_env/nginx/my.conf

@@ -11,6 +11,10 @@ server {
         real_ip_header X-Forwarded-For;
         root /usr/share/nginx/html;
         index  index.html index.php index.htm;
+        # 禁止缓存html文件,避免前端页面不及时更新，需要用户手动刷新的情况
+        if ($request_uri ~* "^/$|^/index.html|^/index.htm") {
+             add_header Cache-Control "no-store";
+        }
     }
 
     location /api/ {

web/.gitignore

@@ -21,4 +21,5 @@ pnpm-debug.log*
 *.njsproj
 *.sln
 *.sw?
-public/version
+# 构建版本文件，无需上传git
+public/version-build

web/src/utils/upgrade.ts

@@ -5,8 +5,9 @@ import {ElNotification} from "element-plus";
 import fs from "fs";
 
 // 是否显示升级提示信息框
-export const IS_SHOW_UPGRADE_SESSION_KEY = 'isShowUpgrade';
-const versionKey = 'DVADMIN3_VERSION'
+const IS_SHOW_UPGRADE_SESSION_KEY = 'isShowUpgrade';
+const VERSION_KEY = 'DVADMIN3_VERSION'
+const VERSION_FILE_NAME = 'version-build'
 
 export function showUpgrade  () {
     const isShowUpgrade = Session.get(IS_SHOW_UPGRADE_SESSION_KEY) ?? false
@@ -28,13 +29,13 @@ export async function checkVersion(){
         return
     }
     // 获取线上版本号 t为时间戳，防止缓存
-    await axios.get(`/version?t=${new Date().getTime()}`).then(res => {
+    await axios.get(`/${VERSION_FILE_NAME}?t=${new Date().getTime()}`).then(res => {
         const {status, data} = res || {}
         if (status === 200) {
             // 获取当前版本号
-            const localVersion = Local.get(versionKey)
+            const localVersion = Local.get(VERSION_KEY)
             // 将当前版本号持久缓存至本地
-            Local.set(versionKey, data)
+            Local.set(VERSION_KEY, data)
             // 当用户本地存在版本号并且和线上版本号不一致时，进行页面刷新操作
             if (localVersion && localVersion !== data) {
                 // 本地缓存版本号和线上版本号不一致，弹出升级提示框
@@ -50,5 +51,5 @@ export async function checkVersion(){
 export function generateVersionFile (){
     // 生成版本文件到public目录下version文件中
     const version = `${process.env.npm_package_version}.${new Date().getTime()}`;
-    fs.writeFileSync('public/version', version);
+    fs.writeFileSync(`public/${VERSION_FILE_NAME}`, version);
 }

web/vite.config.ts

@@ -3,7 +3,7 @@ import { resolve } from 'path';
 import { defineConfig, loadEnv, ConfigEnv } from 'vite';
 import vueSetupExtend from 'vite-plugin-vue-setup-extend';
 import vueJsx from '@vitejs/plugin-vue-jsx'
-import { generateVersionFile } from "./src/utils/upgrade";
+import { generateVersionFile } from "/@/utils/upgrade";
 
 const pathResolve = (dir: string) => {
 	return resolve(__dirname, '.', dir);