hzd/visitor
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

处理偶尔循环登录问题

Browse Source
This commit is contained in:
lzyyj
2025-08-25 15:17:03 +08:00
parent 81dc87c388
commit e4ec2f1c69
11 changed files with 246 additions and 105 deletions
Download Patch File Download Diff File Expand all files Collapse all files
.env
+1
View File
@@ -0,0 +1 @@
VITE_APP_VERSION=1.2.20250825-12
.env.development
+5
View File
@@ -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
+5
View File
@@ -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
+5
View File
@@ -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
+4 -2
View File
@@ -3,8 +3,10 @@
"private": true,
"version": "0.0.0",
"scripts": {
"dev": "vite",
"build": "vite build",
"dev": "vite --mode development",
"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
+5 -10
View File
@@ -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
const isDev = process.env.NODE_ENV === "development";
// 使用环境变量配置API地址
const baseURL = import.meta.env.VITE_APP_BASE_API || '/prod-api'
const request = axios.create({
// 根据环境 设置不同的baseURL
// 如果配置了单个的反向代理 --- 字符串模式
// 如果配置了多个的反向代理 --- 对象模式
baseURL: isDev
? "/dev-api"
: "/prod-api",
// baseURL: isDev ? 'http://192.168.31.118:8195' : 'https://visitor.scdswj.cn/prod-api'
baseURL: baseURL,
});
// 'http://rap2api.taobao.org/app/mock/297766/example/1643070528065'
src/api/doorAdmin.js
+2
View File
@@ -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
+5 -11
View File
@@ -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
// isDev 为假 非开发环境（测试环境，生产环境）- npm run build
const isDev = process.env.NODE_ENV === "development";
// 使用环境变量配置API地址
const baseURL = import.meta.env.VITE_APP_BASE_API || '/prod-api'
const request = axios.create({
// 根据环境 设置不同的baseURL https://visitor.scdswj.cn/prod-api
// 如果配置了单个的反向代理 --- 字符串模式
// 如果配置了多个的反向代理 --- 对象模式
baseURL: isDev
? "/dev-api"
: "/prod-api",
// baseURL: isDev ? "http://192.168.31.124:8195" : "http://192.168.31.124:8195",
baseURL: baseURL,
});
// 'http://rap2api.taobao.org/app/mock/297766/example/1643070528065'
src/views/home.vue
+80 -37
View File
@@ -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,24 +143,83 @@ const onClickUser = (item) => {
form.userId = item.userId
form.name = item.name
}
const login = () => {
Toast.loading({duration: 0, forbidClick: true, message: '登录中',});
dd.getAuthCode({
corpId: 'ding03f8e88dde9b426835c2f4657eb6378f',
success: (res) => {
const {code} = res;
localStorage.removeItem('token');
localStorage.removeItem('user');
getToken(code).then(res => {
localStorage.setItem('user', res.data)
localStorage.setItem('token', res.data.authorization)
if (dd.env && dd.env.platform !== 'notInDingTalk') { // ['ios', 'android', 'wechat', 'dingding', 'notInDingTalk']
// 确保钉钉JSAPI准备就绪
dd.getAuthCode({
corpId: 'ding03f8e88dde9b426835c2f4657eb6378f',
success: (res) => {
const {code} = res;
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.clear() // 添加这行，确保清除加载提示
Toast.fail('登录失败，请重试');
console.error('登录失败:', err);
})
},
fail: (err) => {
Toast.clear()
Toast.success('登录成功')
deptList()
})
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
+60
View File
@@ -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
+74 -45
View File
@@ -1,52 +1,81 @@
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({
plugins: [
vue(),
styleImport({
resolves: [VantResolve()],
libs: [
{
libraryName: "vant",
esModule: true,
resolveStyle: (name) => `../es/${name}/style`, //https://blog.csdn.net/yunchong_zhao/article/details/123552423
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)
},
],
}),
],
server: {
host: "0.0.0.0", //设置地址：http://localhost
port: 4000, // 设置服务启动端口号
hmr: false, // 关闭热更新
open: true, // 设置服务启动时是否自动打开浏览器
cors: true, // 允许跨域
proxy: {
'/dev-api': {
target: 'http://localhost:8195',//代理的地址
changeOrigin: true,
// 路径重写 pathRewrite无效使用rewrite
// pathRewrite: { '/api': '' // 用'/api'代替target里面的地址 },
rewrite: path => path.replace(/^\/dev-api/, '')
}
plugins: [
vue(),
styleImport({
resolves: [VantResolve()],
libs: [
{
libraryName: "vant",
esModule: true,
resolveStyle: (name) => `../es/${name}/style`, //https://blog.csdn.net/yunchong_zhao/article/details/123552423
},
],
}),
],
server: {
host: "0.0.0.0", //设置地址：http://localhost
port: 4000, // 设置服务启动端口号
hmr: false, // 关闭热更新
open: true, // 设置服务启动时是否自动打开浏览器
cors: true, // 允许跨域
// 添加自定义头部
headers: {
'Cache-Control': 'no-cache, no-store, must-revalidate',
'Pragma': 'no-cache',
'Expires': '0'
},
proxy: {
'/dev-api': {
target: apiUrl,//代理的地址
changeOrigin: true,
// 路径重写 pathRewrite无效使用rewrite
// pathRewrite: { '/api': '' // 用'/api'代替target里面的地址 },
rewrite: path => path.replace(/^\/dev-api/, '')
}
}
},
resolve: {
alias: {
"@": resolve(__dirname, "src"),
},
},
css: {
// css预处理器
preprocessorOptions: {
scss: {
charset: false,
additionalData: '@import "./src/assets/style/index.scss";',
}
}
},
// 根据不同环境设置构建选项
build: {
outDir: isProd ? 'dist' : isTest ? 'dist-test' : isDev ? 'dist-dev' :'dist-dev'
}
}
},
resolve: {
alias: {
"@": resolve(__dirname, "src"),
},
},
css: {
// css预处理器
preprocessorOptions: {
scss: {
charset: false,
additionalData: '@import "./src/assets/style/index.scss";',
},
},
},
});