大屏项目初始化

This commit is contained in:
2026-03-01 23:21:08 +08:00
parent 0a95924d34
commit 86c1e58644
2 changed files with 64 additions and 46 deletions

View File

@@ -2,7 +2,6 @@ import axios from 'axios'
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import router from '@/router' import router from '@/router'
// 创建axios实例
const service = axios.create({ const service = axios.create({
baseURL: import.meta.env.PROD ? '' : '/api', baseURL: import.meta.env.PROD ? '' : '/api',
timeout: 10000, timeout: 10000,
@@ -11,62 +10,44 @@ const service = axios.create({
} }
}) })
// 无需token的白名单接口
const WHITE_LIST_PATHS = ['/userLogin', '/register']; const WHITE_LIST_PATHS = ['/userLogin', '/register'];
/** const checkTokenExist = (config) => {
* 检查路径是否在白名单中 if (WHITE_LIST_PATHS.some(path => config.url?.includes(path))) {
* @param {string} url 请求路径 return true;
* @returns {boolean} 是否在白名单
*/
const isInWhiteList = (url) => {
if (!url) return false;
return WHITE_LIST_PATHS.some(path => url.includes(path));
};
/**
* 处理登录失效/无token逻辑
*/
const handleLoginExpired = () => {
// 清除无效token
localStorage.removeItem('token');
if (router.currentRoute.path !== '/login') {
const redirect = encodeURIComponent(router.currentRoute.fullPath);
router.push({
path: '/login',
query: { redirect }
}).catch(err => {
console.warn('路由跳转登录页失败', err);
});
ElMessage.error('登录状态已失效,请重新登录');
}
};
// 请求拦截器
service.interceptors.request.use(
(config) => {
if (isInWhiteList(config.url)) {
return config;
} }
// 非白名单接口检查token
const token = localStorage.getItem('token'); const token = localStorage.getItem('token');
if (!token) { if (!token) {
handleLoginExpired(); handleLoginExpired();
return Promise.reject(new Error('未检测到登录凭证,请先登录')); return false;
} }
config.headers.Authorization = `Bearer ${token}`; config.headers.Authorization = `Bearer ${token}`;
return config; return true;
};
service.interceptors.request.use(
(config) => {
if (!checkTokenExist(config)) {
return Promise.reject(new Error('未检测到登录凭证,请先登录'));
}
return config
}, },
(error) => { (error) => {
console.error('【请求拦截器错误】', error); console.error('【请求拦截器错误】', error);
return Promise.reject(error); return Promise.reject(error)
} }
); )
// 响应拦截器
service.interceptors.response.use( service.interceptors.response.use(
(response) => { (response) => {
const res = response.data; const res = response.data;
if (typeof res === 'string' && res.includes('<html>')) {
handleLoginExpired();
return Promise.reject(new Error('登录状态已失效,请重新登录'));
}
if (res.code !== 200) { if (res.code !== 200) {
ElMessage.error(res.msg || '接口请求失败'); ElMessage.error(res.msg || '接口请求失败');
if (res.code === 401) { if (res.code === 401) {
@@ -77,6 +58,11 @@ service.interceptors.response.use(
return res.data; return res.data;
}, },
(error) => { (error) => {
if (isLoginExpiredError(error)) {
handleLoginExpired();
return Promise.reject(new Error('登录状态已失效,请重新登录'));
}
if (!error.response) { if (!error.response) {
const errMsg = error.message.toLowerCase(); const errMsg = error.message.toLowerCase();
if (errMsg.includes('network error') || errMsg.includes('timeout')) { if (errMsg.includes('network error') || errMsg.includes('timeout')) {
@@ -87,15 +73,47 @@ service.interceptors.response.use(
return Promise.reject(error); return Promise.reject(error);
} }
if (error.response.status === 401) { const responseData = error.response.data;
if (typeof responseData === 'string' && responseData.includes('<html>')) {
handleLoginExpired(); handleLoginExpired();
return Promise.reject(new Error('登录状态已失效,请重新登录')); return Promise.reject(new Error('登录状态已失效,请重新登录'));
} }
// 其他错误提示
ElMessage.error(error.response.data?.msg || error.message || '接口请求失败'); ElMessage.error(error.response.data?.msg || error.message || '接口请求失败');
return Promise.reject(error); return Promise.reject(error);
} }
)
function isLoginExpiredError(error) {
if (error.response && error.response.status === 401) {
return true;
}
const errorMsg = (error.message || '').toLowerCase();
const expiredKeywords = [
'token expired', 'invalid token', '未授权',
'登录失效', '认证失败', '401'
];
const networkKeywords = ['network error', 'timeout', '网络'];
return (
expiredKeywords.some(keyword => errorMsg.includes(keyword)) &&
!networkKeywords.some(keyword => errorMsg.includes(keyword))
); );
}
function handleLoginExpired() {
localStorage.removeItem('token');
if (router.currentRoute.path !== '/login') {
const redirect = encodeURIComponent(router.currentRoute.fullPath);
router.push({
path: '/login',
query: { redirect }
}).catch(err => {
console.warn('路由跳转失败', err);
});
ElMessage.error('登录状态已失效,请重新登录');
}
}
export default service; export default service;

View File

@@ -14,7 +14,7 @@ public class LoginInterceptor implements HandlerInterceptor {
public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception { public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
HttpSession session = request.getSession(false); HttpSession session = request.getSession(false);
if (session == null) { if (session == null) {
response.sendRedirect(request.getContextPath() + "/index.html"); response.sendRedirect("/login");
return false; return false;
} }
return true; return true;