diff --git a/src/config/axios.js b/src/config/axios.js index 42d54f2..e2cdb28 100644 --- a/src/config/axios.js +++ b/src/config/axios.js @@ -3,50 +3,47 @@ import router from '@/router/router' import store from '@/store/store'; import NProgress from 'nprogress' import 'nprogress/nprogress.css' -import {getTokenCookies, getUserCookies} from '@/util/auth' -import {showError} from '@/util/util' +import {failMessage} from '@/util/util' +import {getStore} from "@/util/store"; +import {getTokenCookies} from '@/util/auth' -//返回其他状态码 -axios.defaults.validateStatus = function (status) { - return status >= 200 && status <= 500; // 默认的 -}; -//跨域请求，允许保存cookie -axios.defaults.withCredentials = true; - -//NProgress Configuration NProgress.configure({ showSpinner: false }); +//跨域请求，允许保存cookie +axios.defaults.withCredentials = true; + +//返回其他状态码 +axios.defaults.validateStatus = function (status) { + return status >= 200 && status <= 500; +}; + //HTTP Request拦截 axios.interceptors.request.use(config => { NProgress.start(); config.headers['Content-Type'] = 'application/json'; - config.headers['Auth-User'] = getUserCookies(); - config.headers['Auth-Token'] = getTokenCookies(); + config.headers['Auth-User'] = getStore({name: 'user'}) || ''; + config.headers['Auth-Token'] = getTokenCookies() || ''; return config; }, error => { + console.error('Request interceptors:', error); return Promise.reject(error) }); //HTTP Response拦截 axios.interceptors.response.use(res => { NProgress.done(); - const ok = res.data.ok || false; - const status = res.data.code || 200; - const message = res.data.message || '未知错误'; - //如果是401则跳转到登录页面 - if (status === 401) store.dispatch('FedLogOut').then(() => router.push({path: '/login'})); - // 如果请求为 !ok 默认统一处理 + const ok = res.data.ok || false, status = res.data.code || 200, message = res.data.message || '数据请求失败!'; + if (status === 401) store.dispatch('ClearToken').then(() => router.push({path: '/login'})); if (!ok) { - showError(message); + failMessage(message); return Promise.reject(new Error(message)); } return res.data; }, error => { - NProgress.done(); - showError('未知错误'); - return Promise.reject(new Error(error)); + console.error('Response interceptors:', error); + return Promise.reject(error); }); export default axios diff --git a/src/main.js b/src/main.js index 55900c6..8d0aeb6 100644 --- a/src/main.js +++ b/src/main.js @@ -14,4 +14,4 @@ new Vue({ router, store, render: h => h(App) -}).$mount('#app') +}).$mount('#app'); diff --git a/src/plugins/element/element.js b/src/plugins/element/element.js index ae0a0de..b4b5d74 100644 --- a/src/plugins/element/element.js +++ b/src/plugins/element/element.js @@ -17,3 +17,15 @@ Vue.use(GeminiScrollbar); Vue.component('base-card', baseCard); Vue.component('title-card', titleCard); + +console.log( + '.__ __ .___ ________\n' + + '|__| _____/ |_ __| _/____ \\_____ \\\n' + + '| |/ _ \\ __\\ / __ |/ ___\\ _(__ <\n' + + '| ( <_> ) | / /_/ \\ \\___ / \\\n' + + '|__|\\____/|__| \\____ |\\___ >______ /\n' + + ' \\/ \\/ \\/\n' + + ' https://gitee.com/pnoker/iot-dc3\n' + + ' https://github.com/pnoker/iot-dc3\n' + + ' DC3 IOT Platform V3.0 Pnoker Authors' +); diff --git a/src/router/router.js b/src/router/router.js index 7a3b3fc..3df642d 100644 --- a/src/router/router.js +++ b/src/router/router.js @@ -3,9 +3,10 @@ import VueRouter from 'vue-router' import CommonRouter from './common/index' import ViewsRouter from './views/index' import NProgress from "nprogress"; -import {getTokenCookies, getUserCookies} from "@/util/auth"; -import store from "@/store/store"; import {checkTokenValid} from "@/api/user"; +import store from "@/store/store"; +import {getStore} from '@/util/store' +import {getTokenCookies} from "@/util/auth"; Vue.use(VueRouter); @@ -32,10 +33,10 @@ router.beforeEach((to, from, next) => { if (meta.title) { document.title = to.meta.title } - if (meta.isAuth !== true) { + if (meta.isAuth !== true || from.name === 'login') { next(); } else { - const token = getTokenCookies(), user = getUserCookies(); + const token = getTokenCookies(), user = getStore({name: 'user'}); if ('' === token || undefined === token || '' === user || undefined === user) { next({path: '/login'}); return; diff --git a/src/store/modules/user.js b/src/store/modules/user.js index 6fdfbce..389b721 100644 --- a/src/store/modules/user.js +++ b/src/store/modules/user.js @@ -1,22 +1,23 @@ import md5 from 'js-md5'; import {getStore, removeStore, setStore} from '@/util/store' -import {removeTokenCookies, removeUserCookies, setTokenCookies, setUserCookies} from '@/util/auth' +import {getTokenCookies, removeTokenCookies, setTokenCookies} from '@/util/auth' import {cancelToken, generateSalt, generateToken} from '@/api/user' const user = { state: { - user: getStore({name: 'user'}) || [], - token: getStore({name: 'token'}) || '', + user: getStore({name: 'user'}) || '', + token: getTokenCookies() || '', }, actions: { - GenerateSalt(_, name) { + GenerateSalt({commit}, name) { return new Promise((resolve, reject) => { generateSalt(name).then(res => { + commit('SET_USER', name); resolve(res.data); }).catch(error => { reject(error); }) - }) + }); }, GenerateToken({commit}, form) { let user = { @@ -26,46 +27,41 @@ const user = { return new Promise((resolve, reject) => { generateToken(user).then(res => { const data = res.data; - commit('SET_USER', user.name); commit('SET_TOKEN', data); resolve(); }).catch(error => { reject(error); }); - }) + }); }, - ClearToken({commit}, name) { + ClearToken({commit}) { return new Promise((resolve, reject) => { - cancelToken(name).then((res) => { - commit('REMOVE_TOKEN'); + cancelToken(getStore({name: 'user'})).then((res) => { commit('REMOVE_USER'); + commit('REMOVE_TOKEN'); resolve(res); }).catch(error => { reject(error); }); - }) + }); } }, mutations: { SET_USER: (state, user) => { - setUserCookies(user); state.user = user; - setStore({name: 'user', content: state.user, type: 'session'}) + setStore({name: 'user', content: state.user}); }, REMOVE_USER: (state) => { - removeUserCookies(); state.user = ''; - removeStore({name: 'user', type: 'session'}); + removeStore({name: 'user'}); }, SET_TOKEN: (state, token) => { - setTokenCookies(token); state.token = token; - setStore({name: 'token', content: state.token, type: 'session'}) + setTokenCookies(token); }, REMOVE_TOKEN: (state) => { - removeTokenCookies(); state.token = ''; - removeStore({name: 'token', type: 'session'}); + removeTokenCookies(); } } }; diff --git a/src/util/auth.js b/src/util/auth.js index ba04a7b..88daabc 100644 --- a/src/util/auth.js +++ b/src/util/auth.js @@ -1,29 +1,18 @@ import Cookies from 'js-cookie' +import website from "@/config/website"; -const UserKey = 'x-access-user'; -const TokenKey = 'x-access-token'; +const keyName = website.key + '-'; +const TokenKey = keyName + 'auth-token'; -// 120分钟，120 * 60 * 1000 -const inFifteenMinutes = new Date(new Date().getTime() + 120 * 60 * 1000); - -export function getUserCookies() { - return Cookies.get(UserKey); -} - -export function setUserCookies(user) { - return Cookies.set(UserKey, user, {expires: inFifteenMinutes}); -} - -export function removeUserCookies() { - return Cookies.remove(UserKey); -} +// 360分钟，360 * 60 * 1000 +const expiration = new Date(new Date().getTime() + 360 * 60 * 1000); export function getTokenCookies() { return Cookies.get(TokenKey); } export function setTokenCookies(token) { - return Cookies.set(TokenKey, token, {expires: inFifteenMinutes}); + return Cookies.set(TokenKey, token, {expires: expiration}); } export function removeTokenCookies() { diff --git a/src/util/store.js b/src/util/store.js index 544eeb2..b710690 100644 --- a/src/util/store.js +++ b/src/util/store.js @@ -34,8 +34,7 @@ export const getStore = (params = {}) => { debug } = params; name = keyName + name; - let obj = {}, - content; + let obj = {}, content; obj = window.sessionStorage.getItem(name); if (isNull(obj)) obj = window.localStorage.getItem(name); if (isNull(obj)) return; diff --git a/src/util/util.js b/src/util/util.js index 8aefbde..932e996 100644 --- a/src/util/util.js +++ b/src/util/util.js @@ -1,5 +1,7 @@ import {isNull} from './validate' -import {Message} from 'element-ui' +import {Message, Notification} from 'element-ui' + +let failNotify = true, failNotifyText = ''; /** * 表单序列化 @@ -251,38 +253,6 @@ export const randomLenNum = (len, date) => { return random; }; -/** - * 成功操作 - * - * @param message - */ -export const successMessage = (message) => { - if (message === '' || message == null) { - message = '操作成功!'; - } - Message({ - center: true, - type: 'success', - message: message - }); -}; - -/** - * 失败操作 - * - * @param message - */ -export const failMessage = (message) => { - if (message === '' || message == null) { - message = '操作失败!'; - } - Message({ - center: true, - type: 'error', - message: message - }); -}; - /** * 打开全屏/关闭全屏 */ @@ -377,11 +347,47 @@ export const openWindow = (url, title, w, h) => { } }; -export const showError = (message) => { +/** + * 成功操作 + * + * @param message + */ +export const successMessage = (message) => { + if (message === '' || message == null) { + message = '操作成功!'; + } Message({ center: true, - type: 'error', + type: 'success', showClose: true, message: message }); }; + +/** + * 失败操作 + * + * @param message + */ +export const failMessage = (message) => { + let show = true; + if (message === '' || message == null) { + message = '操作失败!'; + } + if (failNotify && failNotifyText === message) { + show = false; + } + if (show) { + failNotify = true; + failNotifyText = message; + Notification.error({ + title: '错误', + dangerouslyUseHTMLString: true, + message: `

${message}

详情: 请查看浏览器 控制台 输出。

`, + onClose: () => { + failNotify = false; + failNotifyText = ''; + } + }); + } +}; diff --git a/src/views/layout/Layout.vue b/src/views/layout/Layout.vue index 0606e1e..e028f71 100644 --- a/src/views/layout/Layout.vue +++ b/src/views/layout/Layout.vue @@ -71,8 +71,7 @@ }, handleCommand(command) { if (command === 'logout') { - let name = this.$store.getters.user; - this.$store.dispatch('ClearToken', name).then((res) => { + this.$store.dispatch('ClearToken').then((res) => { if (res.ok) { this.$router.push('/login'); } diff --git a/src/views/login/Login.vue b/src/views/login/Login.vue index 13cdc84..3d67aad 100644 --- a/src/views/login/Login.vue +++ b/src/views/login/Login.vue @@ -12,7 +12,7 @@

Demo Application

-

基于 DC3 接口开发的 demo 应用，仅供演示使用
使用 Vue，ElementUi，Avue 开发

+

基于 DC3 接口开发的 demo 应用，仅供演示和测试用途!