处理偶尔循环登录问题

.env

@@ -0,0 +1 @@
+VITE_APP_VERSION=1.2.20250825-12

.env.development

@@ -0,0 +1,5 @@
+# 开发环境配置
+NODE_ENV=development
+VITE_APP_TITLE=访客系统-开发环境
+VITE_APP_BASE_API=/dev-api
+VITE_APP_API_URL=http://localhost:8195

.env.production

@@ -0,0 +1,5 @@
+# 生产环境配置
+NODE_ENV=production
+VITE_APP_TITLE=访客系统-生产环境
+VITE_APP_BASE_API=/prod-api
+VITE_APP_API_URL=https://visitor.scdswj.cn

.env.test

@@ -0,0 +1,5 @@
+# 测试环境配置
+NODE_ENV=test
+VITE_APP_TITLE=访客系统-测试环境
+VITE_APP_BASE_API=/dev-api
+VITE_APP_API_URL=https://test-api.scdswj.cn

package.json

@@ -3,8 +3,10 @@
   "private": true,
   "version": "0.0.0",
   "scripts": {
-    "dev": "vite",
+    "dev": "vite --mode development",
-    "build": "vite build",
+    "build": "vite build --mode production",
+    "build:dev": "vite build --mode development",
+    "build:test": "vite build --mode test",
     "preview": "vite preview"
   },
   "dependencies": {

src/api/adminRequest.js

@@ -14,17 +14,12 @@ const router = useRouter();
 const store = useStore();
 const loadNoCloseArr = ["/upload/face"];
 // 判断当前的运行环境 process.env.NODE_ENV
-// isDev 为真 开发环境 --- npm run serve
+
-// isDev 为假 非开发环境（测试环境，生产环境）- npm run build
+// 使用环境变量配置API地址
-const isDev = process.env.NODE_ENV === "development";
+const baseURL = import.meta.env.VITE_APP_BASE_API || '/prod-api'
+
 const request = axios.create({
-    // 根据环境 设置不同的baseURL
+    baseURL: baseURL,
-    // 如果配置了单个的反向代理 --- 字符串模式
-    // 如果配置了多个的反向代理 --- 对象模式
-    baseURL: isDev
-        ? "/dev-api"
-        : "/prod-api",
-    // baseURL: isDev ? 'http://192.168.31.118:8195' : 'https://visitor.scdswj.cn/prod-api'
 });
 // 'http://rap2api.taobao.org/app/mock/297766/example/1643070528065'
 

src/api/doorAdmin.js

@@ -28,6 +28,8 @@ export function getUserListByDept( deptId){
       deptId
     },
 		headers:{
+            'Cache-Control': 'no-cache',
+            'Pragma': 'no-cache',
 			'Authorization': localStorage.getItem('token')
 		}
 	})

src/api/index.js

@@ -13,18 +13,12 @@ const route = useRoute();
 const router = useRouter();
 const store = useStore();
 const loadNoCloseArr = ["/upload/face"];
-// 判断当前的运行环境 process.env.NODE_ENV
+
-// isDev 为真 开发环境 --- npm run serve
+// 使用环境变量配置API地址
-// isDev 为假 非开发环境（测试环境，生产环境）- npm run build
+const baseURL = import.meta.env.VITE_APP_BASE_API || '/prod-api'
-const isDev = process.env.NODE_ENV === "development";
+
 const request = axios.create({
-  // 根据环境 设置不同的baseURL      https://visitor.scdswj.cn/prod-api
+    baseURL: baseURL,
-  // 如果配置了单个的反向代理 --- 字符串模式
-  // 如果配置了多个的反向代理 --- 对象模式
-  baseURL: isDev
-    ? "/dev-api"
-    : "/prod-api",
-  // baseURL: isDev ? "http://192.168.31.124:8195" : "http://192.168.31.124:8195",
 });
 // 'http://rap2api.taobao.org/app/mock/297766/example/1643070528065'
 

src/views/home.vue

@@ -2,7 +2,7 @@
   <div class="box">
     <header>
       <h2>门禁人脸信息</h2>
-      <h3><img src="../assets/img/dunpai.png" alt=""> 公司门禁系统人脸上传和查看 </h3>
+      <h3><img src="../assets/img/dunpai.png" alt=""> 公司门禁系统人脸上传和查看 (v{{ appVersion }})</h3>
       <div class="entering-box">
         <img src="../assets/img/shenfenzheng.png" alt="">
         <div class="entering-center">
@@ -26,11 +26,11 @@
         <div class="user-content">
           <div class="user-scroll">
             <div v-for="item in userArr" class="user-list">
-              <div @click="onClickPreviewImg(item.img)" class="img-box">
+              <div @click="onClickUser(item)" class="img-box">
                 <img v-if="item.img" :src="item.img" alt="">
               </div>
               <div class="name">{{ item.name }}</div>
-              <div @click="onClickUser(item)" v-if="item.img" class="button">查看</div>
+              <div @click="onClickUser(item)" v-if="item.img" class="button active-button">查看</div>
               <div @click="onClickUser(item)" v-else class="button active-button">上传</div>
             </div>
 
@@ -45,8 +45,6 @@
 
 </template>
 <script setup>
-import {rulesPhone, compareTime, timeDiff, formatDate} from '@/com'
-// getShop, getKind
 import {syncDeptUsers} from '@/api/user'
 import {reactive, ref} from 'vue'
 import {Toast, ImagePreview, Skeleton} from 'vant';
@@ -56,6 +54,9 @@ import Facemodel from '@/components/face-model.vue'
 import {uploadApi} from '@/api/upload'
 import {useRouter} from 'vue-router';
 
+// 获取环境变量中的版本号
+const appVersion = import.meta.env.VITE_APP_VERSION || '1.0.0';
+console.log('Available environment variables:', import.meta.env); // 调试信息，查看所有可用的环境变量
 
 const router = useRouter()
 const deptArr = ref([])  // 部门数据
@@ -72,13 +73,9 @@ const isLoading = ref(false)
 localStorage.setItem('redirect', '/home')
 token.value = localStorage.getItem('token')
 
-// setTimeout( ()=>{
-//   form.face = 'https://img0.baidu.com/it/u=3229206321,1418550973&fm=253&fmt=auto&app=138&f=JPEG?w=800&h=500'
-// }, 2000)
-
 // method
 // 点击预栏图片
-const onClickPreviewImg = (img) => {
+const onClickPreviewImg1 = (img) => {
   dd.previewImage({
     urls: [img
     ],
@@ -136,22 +133,8 @@ const onClickSave = (file) => {
   } else if (!form.face && !file) {
     Toast.fail('请先上传照片！');
   }
-  // if(file){ // 文件是否上传了
-  //   let formData = new FormData()
-  //   formData.append('face', file)
-  //   formData.append('userId', form.userId)
-  //   formData.append('name', form.name)
-  //   Toast.loading({ duration: 0, forbidClick: true, message: '保存中', });
-  //   uploadApi(formData).then(res =>{
-  //     Toast.success(res.msg);
-  //     form.img = res.data
-
-  //   })
-  // }else{
-  //   Toast.fail('请先上传照片！');
-  // }
-
 }
+
 // 点击用户上传照片或查看
 const onClickUser = (item) => {
   console.log(item)
@@ -160,8 +143,11 @@ const onClickUser = (item) => {
   form.userId = item.userId
   form.name = item.name
 }
+
 const login = () => {
   Toast.loading({duration: 0, forbidClick: true, message: '登录中',});
+  if (dd.env && dd.env.platform !== 'notInDingTalk') {  // ['ios', 'android', 'wechat', 'dingding', 'notInDingTalk']
+    // 确保钉钉JSAPI准备就绪
     dd.getAuthCode({
       corpId: 'ding03f8e88dde9b426835c2f4657eb6378f',
       success: (res) => {
@@ -174,10 +160,66 @@ const login = () => {
           Toast.clear()
           Toast.success('登录成功')
           deptList()
+        }).catch(err => {
+          Toast.clear()  // 添加这行，确保清除加载提示
+          Toast.fail('登录失败，请重试');
+          console.error('登录失败:', err);
         })
+      },
+      fail: (err) => {
+        Toast.clear()
+        Toast.fail('登录失败('+err+')，请稍后重试！');
       }
     });
+  } else {
+    Toast.clear()
+    Toast.fail('登录失败，目前系统只支持在钉钉环境中使用！');
+  }
 }
+
+// 检查URL中是否有OAuth回调参数
+const checkOAuthCallback = () => {
+  const urlParams = new URLSearchParams(window.location.search);
+  const code = urlParams.get('code');
+  const state = urlParams.get('state');
+
+  if (code && state) {
+    // 验证state参数
+    const savedState = localStorage.getItem('oauth_state');
+    if (state === savedState) {
+      // 清除state
+      localStorage.removeItem('oauth_state');
+
+      // 清理URL参数
+      window.history.replaceState({}, document.title, window.location.pathname);
+
+      // 使用授权码换取用户信息
+      processOAuthCode(code);
+      return true;
+    }
+  }
+  return false;
+}
+
+// 处理OAuth授权码
+const processOAuthCode = (code) => {
+  Toast.loading({duration: 0, forbidClick: true, message: '处理登录信息...',});
+
+  localStorage.removeItem('token');
+  localStorage.removeItem('user');
+
+  getToken(code).then(res => {
+    localStorage.setItem('user', res.data)
+    localStorage.setItem('token', res.data.authorization)
+    Toast.clear()
+    Toast.success('登录成功')
+    deptList()
+  }).catch(err => {
+    Toast.fail('登录失败，请重试');
+    console.error('登录失败:', err);
+  });
+}
+
 // 获取部门用户
 const userList = () => {
   isLoading.value = false
@@ -480,6 +522,7 @@ if (token.value) {
             text-align: center;
             line-height: .6667rem /* 50/75 */
           ;
+            margin-left: 0.1rem;
           }
 
           .active-button {

update.version.js

@@ -0,0 +1,60 @@
+const fs = require('fs');
+const path = require('path');
+
+function changeVersion() {
+    // 直接读取.env文件中的版本号
+    const envPath = path.join(__dirname, '.env');
+    let version = '1.0.0'; // 默认版本号
+
+    if (fs.existsSync(envPath)) {
+        const fileContent = fs.readFileSync(envPath, 'utf-8');
+        const versionMatch = fileContent.match(/VITE_APP_VERSION\s*=\s*([^\r\n]+)/);
+        if (versionMatch && versionMatch[1]) {
+            version = versionMatch[1].trim();
+        }
+    }
+
+    let newVersion;
+    if (version) {
+        // 将版本号按点号分割
+        const parts = version.split('.');
+        const lastPart = parts[parts.length - 1];
+
+        // 查找最后一部分中的数字
+        const numberMatch = lastPart.match(/(\d+)([^\d]*)$/);
+        if (numberMatch) {
+            // 递增数字部分
+            const number = parseInt(numberMatch[1]) + 1;
+            const suffix = numberMatch[2] || ''; // 非数字后缀
+
+            // 替换最后一部分中的数字
+            parts[parts.length - 1] = lastPart.replace(/(\d+)([^\d]*)$/, number + suffix);
+        } else {
+            // 如果最后一部分没有数字，则添加.1
+            parts.push('1');
+        }
+
+        newVersion = parts.join('.');
+    } else {
+        // 如果没有找到版本号，使用默认值
+        newVersion = '1.0.1';
+    }
+
+    // 修改版本号
+    if (fs.existsSync(envPath)) {
+        const file = fs.readFileSync(envPath, 'utf-8');
+
+        // 使用正则表达式更可靠地替换版本号
+        const versionRegex = /VITE_APP_VERSION\s*=\s*.*/;
+        const newVersionLine = `VITE_APP_VERSION=${newVersion}`;
+
+        const result = file.replace(versionRegex, newVersionLine);
+
+        // 同步写文件
+        fs.writeFileSync(envPath, result, 'utf-8');
+    }
+
+    return newVersion;
+}
+
+module.exports = changeVersion;

vite.config.js

@@ -1,11 +1,28 @@
-import { defineConfig } from "vite";
+import {defineConfig, loadEnv} from "vite";
 import vue from "@vitejs/plugin-vue";
-import { resolve } from "path";
+import {resolve} from "path";
+import changeVersion from "./update.version.js";
 
-import styleImport, { VantResolve } from "vite-plugin-style-import";
+import styleImport, {VantResolve} from "vite-plugin-style-import";
 
 // https://vitejs.dev/config/
-export default defineConfig({
+export default defineConfig(({mode}) => {
+    // 更新版本号
+    const appVersion = changeVersion();
+
+    // 根据不同的环境加载不同的配置
+    const isDev = mode === 'development'
+    const isTest = mode === 'test'
+    const isProd = mode === 'production'
+
+    // 加载环境变量
+    const env = loadEnv(mode, process.cwd(), '');
+    const apiUrl = env.VITE_APP_API_URL || 'http://localhost:8080';
+
+    return {
+        define: {
+            __APP_VERSION__: JSON.stringify(appVersion)
+        },
         plugins: [
             vue(),
             styleImport({
@@ -25,9 +42,15 @@ export default defineConfig({
             hmr: false, // 关闭热更新
             open: true, // 设置服务启动时是否自动打开浏览器
             cors: true, // 允许跨域
+            // 添加自定义头部
+            headers: {
+                'Cache-Control': 'no-cache, no-store, must-revalidate',
+                'Pragma': 'no-cache',
+                'Expires': '0'
+            },
             proxy: {
                 '/dev-api': {
-        target: 'http://localhost:8195',//代理的地址
+                    target: apiUrl,//代理的地址
                     changeOrigin: true,
                     // 路径重写 pathRewrite无效使用rewrite
                     // pathRewrite: { '/api': '' // 用'/api'代替target里面的地址 },
@@ -46,7 +69,13 @@ export default defineConfig({
                 scss: {
                     charset: false,
                     additionalData: '@import "./src/assets/style/index.scss";',
+                }
+            }
         },
-    },
+        // 根据不同环境设置构建选项
-  },
+        build: {
+            outDir: isProd ? 'dist' : isTest ? 'dist-test' : isDev ? 'dist-dev' :'dist-dev'
+        }
+    }
 });
+