diff --git a/frontend/src/layout/components/Topbar.vue b/frontend/src/layout/components/Topbar.vue
index 29ce410ffb..1888c83b07 100644
--- a/frontend/src/layout/components/Topbar.vue
+++ b/frontend/src/layout/components/Topbar.vue
@@ -239,6 +239,9 @@ export default {
   },
 
   mounted() {
+    window.addEventListener('beforeunload', (e) => this.beforeunloadHandler(e))
+    window.addEventListener('unload', (e) => this.unloadHandler(e))
+
     this.initCurrentRoutes()
     bus.$on('set-top-menu-info', this.setTopMenuInfo)
     bus.$on('set-top-menu-active-info', this.setTopMenuActiveInfo)
@@ -251,6 +254,9 @@ export default {
     })
   },
   beforeDestroy() {
+    window.removeEventListener('beforeunload', (e) => this.beforeunloadHandler(e))
+    window.removeEventListener('unload', (e) => this.unloadHandler(e))
+
     bus.$off('set-top-menu-info', this.setTopMenuInfo)
     bus.$off('set-top-menu-active-info', this.setTopMenuActiveInfo)
     bus.$off('set-top-text-info', this.setTopTextInfo)
@@ -269,6 +275,16 @@ export default {
     })
   },
   methods: {
+    beforeunloadHandler() {
+      this.beforeUnload_time = new Date().getTime()
+    },
+    unloadHandler(e) {
+      this.gap_time = new Date().getTime() - this.beforeUnload_time
+      if (this.gap_time <= 5) {
+        this.logout().then(res => {})
+      }
+    },
+
     // 通过当前路径找到二级菜单对应项，存到store，用来渲染左侧菜单
     initCurrentRoutes() {
       const {
diff --git a/frontend/src/utils/index.js b/frontend/src/utils/index.js
index e99a454d1a..5fb32758df 100644
--- a/frontend/src/utils/index.js
+++ b/frontend/src/utils/index.js
@@ -1,10 +1,10 @@
 import Cookies from 'js-cookie'
 import i18n from '@/lang'
 import { $error, $confirm } from '@/utils/message'
-import {seizeLogin} from '@/api/user'
+import { seizeLogin } from '@/api/user'
 import router from '@/router'
-import store from "@/store";
-import { Loading } from 'element-ui';
+import store from '@/store'
+import { Loading } from 'element-ui'
 export function timeSection(date, type, labelFormat = 'yyyy-MM-dd') {
   if (!date) {
     return null
@@ -367,7 +367,7 @@ export const showMultiLoginMsg = () => {
     const content = infos.map(info => buildMultiLoginErrorItem(info)).join('</br>')
     let msgContent = '<strong>' + i18n.t('multi_login_lang.title') + '</strong>'
     msgContent += content + '<p>' + i18n.t('multi_login_lang.label') + '</p>'
-    $error(msgContent, 10000, true);
+    $error(msgContent, 10000, true)
   }
   const multiLoginError2 = Cookies.get('MultiLoginError2')
   if (multiLoginError2) {
@@ -378,11 +378,11 @@ export const showMultiLoginMsg = () => {
     msgContent += content + '<p>' + i18n.t('multi_login_lang.confirm') + '</p>'
     $confirm(msgContent, () => seize(infos[0]), {
       dangerouslyUseHTMLString: true
-    });
+    })
   }
 }
 const seize = model => {
-  let loadingInstance = Loading.service({});
+  const loadingInstance = Loading.service({})
   const token = model.token
   const param = {
     token
@@ -391,7 +391,7 @@ const seize = model => {
     const resultToken = res.data.token
     store.dispatch('user/refreshToken', resultToken)
     router.push('/')
-    loadingInstance.close();
+    loadingInstance.close()
   })
 }
 const buildMultiLoginErrorItem = (info) => {
diff --git a/frontend/vue.config.js b/frontend/vue.config.js
index 6f079d4649..a7a3746a14 100644
--- a/frontend/vue.config.js
+++ b/frontend/vue.config.js
@@ -30,8 +30,7 @@ module.exports = {
     overlay: {
       warnings: false,
       errors: true
-    },
-    before: require('./mock/mock-server.js')
+    }
   },
 
   pages: {