From e444715299dd1315dfa5f88b75b64244b682d826 Mon Sep 17 00:00:00 2001 From: aaron <> Date: Sun, 9 Mar 2025 11:00:17 +0800 Subject: [PATCH] upate --- Dockerfile | 9 +++++++++ nginx.conf | 17 +++++++++++++++-- src/main.js | 4 ++++ src/utils/config.js | 10 ++++++++++ src/utils/request.js | 21 +++++++++++++++++++++ webpack.config.js | 21 ++++++++++++++++++--- 6 files changed, 77 insertions(+), 5 deletions(-) diff --git a/Dockerfile b/Dockerfile index c5782cc..34baa65 100644 --- a/Dockerfile +++ b/Dockerfile @@ -8,8 +8,13 @@ RUN sed -i 's/dl-cdn.alpinelinux.org/mirrors.aliyun.com/g' /etc/apk/repositories ARG NODE_ENV=production ENV NODE_ENV=${NODE_ENV} +# 添加构建时间戳，用于破除缓存 +ARG BUILD_TIMESTAMP=$(date +%s) +ENV BUILD_TIMESTAMP=${BUILD_TIMESTAMP} + # 输出构建环境信息 RUN echo "Building for environment: ${NODE_ENV}" +RUN echo "Build timestamp: ${BUILD_TIMESTAMP}" # 安装 yarn RUN apk add --no-cache yarn @@ -32,6 +37,7 @@ COPY . . # 创建或更新环境文件 RUN echo "NODE_ENV=${NODE_ENV}" > .env && \ + echo "BUILD_TIMESTAMP=${BUILD_TIMESTAMP}" >> .env && \ if [ "$NODE_ENV" = "production" ]; then \ echo "VUE_APP_API_URL=https://api.beefast.co" >> .env; \ elif [ "$NODE_ENV" = "testing" ]; then \ @@ -65,6 +71,9 @@ COPY --from=build-stage /app/dist /usr/share/nginx/html # 复制Nginx配置文件 COPY nginx.conf /etc/nginx/conf.d/default.conf +# 添加构建信息文件，用于验证部署 +RUN echo "Build completed at: $(date)" > /usr/share/nginx/html/build-info.txt + # 暴露80端口 EXPOSE 80 diff --git a/nginx.conf b/nginx.conf index cae77b2..05c9331 100644 --- a/nginx.conf +++ b/nginx.conf @@ -9,6 +9,11 @@ server { gzip_types text/plain text/css text/javascript application/json application/javascript application/x-javascript application/xml; gzip_vary on; + # 禁用缓存，解决前端缓存问题 + add_header Cache-Control "no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0"; + add_header Pragma "no-cache"; + add_header Expires "0"; + location / { root /usr/share/nginx/html; index index.html index.htm; @@ -16,11 +21,19 @@ server { try_files $uri $uri/ /index.html; } - # 缓存静态资源 - location ~* \.(jpg|jpeg|png|gif|ico|css|js)$ { + # 缓存静态资源，但排除 JavaScript 文件 + location ~* \.(jpg|jpeg|png|gif|ico|css)$ { root /usr/share/nginx/html; expires 1d; } + + # JavaScript 文件不缓存 + location ~* \.js$ { + root /usr/share/nginx/html; + add_header Cache-Control "no-store, no-cache, must-revalidate, proxy-revalidate, max-age=0"; + add_header Pragma "no-cache"; + add_header Expires "0"; + } # 错误页面 error_page 500 502 503 504 /50x.html; diff --git a/src/main.js b/src/main.js index 76d6423..a86ffe9 100644 --- a/src/main.js +++ b/src/main.js @@ -9,6 +9,10 @@ import debug from './utils/debug'; // 输出环境信息 console.log('当前运行环境:', process.env.NODE_ENV); console.log('API基础URL:', process.env.VUE_APP_API_URL); +console.log('构建时间戳:', process.env.BUILD_TIMESTAMP); + +// 添加构建时间戳到全局对象，用于破除缓存 +window.APP_VERSION = process.env.BUILD_TIMESTAMP; const app = createApp(App); diff --git a/src/utils/config.js b/src/utils/config.js index f2dd5b4..b2e501c 100644 --- a/src/utils/config.js +++ b/src/utils/config.js @@ -14,15 +14,25 @@ if (ENV === 'testing') { // 使用环境变量中的 API URL（如果存在） const API_BASE_URL = process.env.VUE_APP_API_URL || apiUrl; +// 构建时间戳，用于破除缓存 +const BUILD_TIMESTAMP = process.env.BUILD_TIMESTAMP || new Date().getTime(); + console.log('配置文件中的环境:', ENV); console.log('配置文件中的API URL:', API_BASE_URL); +console.log('配置文件中的构建时间戳:', BUILD_TIMESTAMP); // 当前环境的 API 基础地址 const BASE_URL = API_BASE_URL; export default { BASE_URL, + BUILD_TIMESTAMP, API: { LOGIN: '/api/user/password-login' + }, + // 添加时间戳参数到 URL，用于破除缓存 + addTimestamp: (url) => { + const separator = url.includes('?') ? '&' : '?'; + return `${url}${separator}_t=${BUILD_TIMESTAMP}`; } }; \ No newline at end of file diff --git a/src/utils/request.js b/src/utils/request.js index 1be5675..90681c9 100644 --- a/src/utils/request.js +++ b/src/utils/request.js @@ -18,6 +18,23 @@ service.interceptors.request.use( if (token) { config.headers['Authorization'] = `Bearer ${token}`; } + + // 添加时间戳参数到 URL，破除缓存 + const timestamp = new Date().getTime(); + if (config.method === 'get') { + config.params = { ...config.params, _t: timestamp }; + } + + // 输出请求信息，便于调试 + console.log('请求URL:', config.url); + console.log('请求方法:', config.method); + console.log('请求头:', config.headers); + if (config.method === 'get') { + console.log('请求参数:', config.params); + } else { + console.log('请求数据:', config.data); + } + return config; }, error => { @@ -29,6 +46,10 @@ service.interceptors.request.use( // 响应拦截器 service.interceptors.response.use( response => { + // 输出响应信息，便于调试 + console.log('响应状态:', response.status); + console.log('响应数据:', response.data); + const res = response.data; // 如果返回的状态码不是 200，则判断为错误 diff --git a/webpack.config.js b/webpack.config.js index b4f0609..84ca1b5 100644 --- a/webpack.config.js +++ b/webpack.config.js @@ -58,6 +58,9 @@ module.exports = (env, argv) => { envKeys['process.env.VUE_APP_API_URL'] = JSON.stringify('http://localhost:8000'); } + // 添加构建时间戳，用于破除缓存 + envKeys['process.env.BUILD_TIMESTAMP'] = JSON.stringify(new Date().getTime()); + console.log('注入的环境变量:', envKeys); return { @@ -65,7 +68,9 @@ module.exports = (env, argv) => { entry: './src/main.js', output: { path: path.resolve(__dirname, 'dist'), - filename: 'bundle.js', + // 添加内容哈希，确保文件内容变化时文件名也变化 + filename: 'js/[name].[contenthash:8].js', + chunkFilename: 'js/[name].[contenthash:8].js', publicPath: '/' }, module: { @@ -85,14 +90,24 @@ module.exports = (env, argv) => { }, { test: /\.(png|jpg|gif|svg)$/, - type: 'asset/resource' + type: 'asset/resource', + generator: { + filename: 'img/[name].[hash:8][ext]' + } } ] }, plugins: [ new VueLoaderPlugin(), new HtmlWebpackPlugin({ - template: './public/index.html' + template: './public/index.html', + // 添加构建时间戳作为查询参数，确保 HTML 文件不被缓存 + filename: 'index.html', + minify: { + removeComments: true, + collapseWhitespace: true, + removeAttributeQuotes: false + } }), new webpack.DefinePlugin(envKeys) ],