[*] 修复登出，更改本地存储读取逻辑

_deprecated/LanLobby.vue

@@ -203,7 +203,7 @@
 <script setup>
 import { ref } from 'vue'
 import { get, post, deleteReq } from '@/utils/request'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendSuccessDialog } from '@/utils/dialog'
 
 const bodyStyle = {
@@ -286,7 +286,7 @@ const lobbyValue = ref({
   client_download_url: '',
   client_download_type: '',
   client_download_password: '',
-  username: store.getters.get_username
+  username: userData.getters.get_username
 })
 
 const Proxies_Select = ref([])
@@ -315,7 +315,7 @@ function getGameList() {
 function getLobbys(game_name) {
   const rs = get(
     'https://api-v2.locyanfrp.cn/api/v2/lan/public/getListByGameName?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&game_name=' +
       game_name
   )
@@ -328,7 +328,7 @@ function getLobbys(game_name) {
 
 function getPrivateLobby() {
   const rs = get(
-    'https://api-v2.locyanfrp.cn/api/v2/lan/private/list?username=' + store.getters.get_username
+    'https://api-v2.locyanfrp.cn/api/v2/lan/private/list?username=' + userData.getters.get_username
   )
   rs.then((res) => {
     if (res.status === 200) {
@@ -374,7 +374,7 @@ function createLobby() {
 function deleteLobby(id) {
   const rs = deleteReq(
     'https://api-v2.locyanfrp.cn/api/v2/lan/private/deleteReq?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&id=' +
       String(id)
   )
@@ -389,7 +389,7 @@ function deleteLobby(id) {
 function getAddress(proxyId, nodeId) {
   const rs = get(
     'https://api-v2.locyanfrp.cn/api/v2/lan/public/address?username=' +
-      store.getters.get_username +
+      userData.getters.get_username +
       '&proxy_id=' +
       proxyId +
       '&node_id=' +

src/App.vue

@@ -8,7 +8,7 @@
             <loadingbar />
             <ndialog />
             <Notification />
-            <MainNav v-if="store.getters.get_token" />
+            <MainNav v-if="userData.getters.get_token" />
             <GuestNav v-else />
           </n-notification-provider>
         </n-dialog-provider>
@@ -32,7 +32,7 @@ import MainNav from './components/MainNav.vue'
 import GuestNav from './components/GuestNav.vue'
 import Notification from './components/Notification.vue'
 import { computed } from 'vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import hljs from 'highlight.js/lib/core'
 import ini from 'highlight.js/lib/languages/ini'
 import nginx from 'highlight.js/lib/languages/nginx'
@@ -65,25 +65,25 @@ if (inited === false) {
 }
 
 setInterval(async () => {
-  if (store.getters.get_token) {
+  if (userData.getters.get_token) {
     let rs
     try {
-      rs = await api.v2.users.info(store.getters.get_username)
+      rs = await api.v2.users.info(userData.getters.get_username)
     } catch (e) {
       sendWarningMessage('查询用户信息失败: ' + e + '，请重新登录后台！')
       logout()
     }
     if (!rs) return
     if (rs.status === 200) {
       // console.log(rs)
-      store.commit('set_user_email', rs.data.email)
-      store.commit('set_user_inbound', rs.data.inbound)
-      store.commit('set_user_outbound', rs.data.inbound)
-      store.commit('set_user_traffic', rs.data.traffic)
+      userData.commit('set_user_email', rs.data.email)
+      userData.commit('set_user_inbound', rs.data.inbound)
+      userData.commit('set_user_outbound', rs.data.inbound)
+      userData.commit('set_user_traffic', rs.data.traffic)
       // localStorage.setItem('proxies', res.proxies_num)
       // localStorage.setItem('traffic', res.traffic)
       // localStorage.setItem('set_limit', res)
-      // store.set_limit({
+      // userData.set_limit({
       //   inbound: res.inbound,
       //   outbound: res.outbound,
       // })

src/components/MainNav.vue

@@ -106,7 +106,7 @@
 import { h, ref, onMounted } from 'vue'
 import { NGradientText } from 'naive-ui'
 import SideBar from './MainSideBar.vue'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import router from '@/router/index'
 import UserInfo, { changeUserInfoShow } from './UserInfo.vue'
 import { get } from '@/utils/request'
@@ -124,7 +124,7 @@ const hitokoto_content = ref('Loading')
 if (document.body.clientWidth >= 1000) {
   collapsed.value = false
 }
-avatar.value = store.getters.get_avatar
+avatar.value = userData.getters.get_avatar
 
 // 刚进入面板不展示用户信息框
 changeUserInfoShow(false)
@@ -138,7 +138,7 @@ function renderIcon(icon) {
 }
 
 function getStyle() {
-  if (!store.getters.get_token) {
+  if (!userData.getters.get_token) {
     return 'display: none;'
   }
 }

src/components/UserInfo.vue

@@ -1,9 +1,9 @@
 <template>
   <n-drawer v-model:show="show" :width="dialogWidth">
     <n-drawer-content title="个人信息" closable>
-      <n-avatar round :size="80" :src="store.getters.get_avatar" />
+      <n-avatar round :size="80" :src="userData.getters.get_avatar" />
       <br />
-      <n-text style="font-size: 20px">{{ store.getters.get_username }} </n-text>
+      <n-text style="font-size: 20px">{{ userData.getters.get_username }} </n-text>
       <br />
       <n-text style="color: gray"
         >本站使用 Cravatar 公用头像库 API ，可以前往
@@ -91,7 +91,7 @@
 
 <script setup>
 import { logout } from '@/utils/profile'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { sendSuccessMessage } from '@/utils/message'
 import { onMounted, ref } from 'vue'
 import { useDialog } from 'naive-ui'
@@ -117,7 +117,7 @@ const bindQQ = ref({
 })
 
 const tEmail = ref({
-  email: store.getters.get_email,
+  email: userData.getters.get_email,
   msg: '修改',
   isEditDisable1: 'display:none',
   isEditDisable: true,
@@ -141,7 +141,7 @@ const tPassword = ref({
 onMounted(async () => {
   let rs
   try {
-    rs = await api.v2.oauth.qq.check(store.getters.get_username)
+    rs = await api.v2.oauth.qq.check(userData.getters.get_username)
   } catch (e) {
     logger.error(e)
     bindQQ.value.isDisable = true
@@ -173,8 +173,8 @@ async function changeEmail() {
     ldb.start()
     try {
       rs = await api.v1.Account.EditEmail(
-        store.getters.get_username,
-        store.getters.get_token,
+        userData.getters.get_username,
+        userData.getters.get_token,
         tEmail.value.email,
         tEmail.value.verify.code
       )
@@ -214,8 +214,8 @@ async function sendChangeEmailCode() {
   let rs
   try {
     rs = await api.v1.Account.SendEditMail(
-      store.getters.get_username,
-      store.getters.get_token,
+      userData.getters.get_username,
+      userData.getters.get_token,
       tEmail.value.email
     )
   } catch (e) {
@@ -243,7 +243,7 @@ async function doBindQQ() {
   binding.value = true
   let rs
   try {
-    rs = await api.v2.oauth.qq.bind(store.getters.get_username)
+    rs = await api.v2.oauth.qq.bind(userData.getters.get_username)
   } catch (e) {
     logger.error(e)
     message.error('请求失败: ' + e)
@@ -259,7 +259,7 @@ async function unBindQQ() {
   binding.value = true
   let rs
   try {
-    rs = await api.v2.oauth.qq.unbind(store.getters.get_username)
+    rs = await api.v2.oauth.qq.unbind(userData.getters.get_username)
   } catch (e) {
     logger.error(e)
     binding.value = false
@@ -304,7 +304,7 @@ async function changePassword() {
     return
   }
   const data = {
-    username: store.getters.get_username,
+    username: userData.getters.get_username,
     old_password: tPassword.value.oldPaxsword,
     new_password: tPassword.value.newPassword
   }
@@ -331,7 +331,7 @@ async function resetFrpToken() {
   resetFrpTokenLoading.value = true
 
   const data = {
-    username: store.getters.get_username
+    username: userData.getters.get_username
   }
 
   dialog.warning({
@@ -352,7 +352,7 @@ async function resetFrpToken() {
       if (!rs) return
       if (rs.status === 200) {
         resetFrpTokenLoading.value = false
-        store.commit('set_frp_token', rs.data.token)
+        userData.commit('set_frp_token', rs.data.token)
         sendSuccessMessage('重置成功')
       } else {
         resetFrpTokenLoading.value = false
@@ -369,7 +369,7 @@ async function exitAllDevices() {
   exitAllDevicesLoading.value = true
 
   const data = {
-    username: store.getters.get_username
+    username: userData.getters.get_username
   }
 
   dialog.warning({

src/main.js

@@ -8,12 +8,13 @@ import ndialog from './components/Dialog.vue'
 import router from './router/index'
 import axios from 'axios'
 import VueAxios from 'vue-axios'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { printTitle } from '@/utils/title'
 import Clipboard from 'v-clipboard'
+import loadFromLocal from './utils/stores/loadFromLocal'
 
 const app = createApp(App)
-app.use(store)
+app.use(userData)
 app.use(router)
 // app.use(websocket, '', {
 //     connectManually: true,
@@ -32,5 +33,7 @@ app.use(VueAxios, axios)
 app.component('message', message)
 app.component('loadingbar', loadingbar)
 app.component('ndialog', ndialog)
+
+loadFromLocal()
 app.mount('#app')
 printTitle()

src/router/index.js

@@ -1,6 +1,6 @@
 import { createRouter, createWebHistory } from 'vue-router'
 import { finishLoadingBar, startLoadingBar } from '@/utils/loadingbar'
-import store from '@/utils/stores/store'
+import userData from '@/utils/stores/userData'
 import { changeMainSideBarShow } from '../components/MainNav.vue'
 import { changeShowGuestSideBar } from '../components/GuestNav.vue'
 import { setSideBarActiveKey } from '../components/MainSideBar.vue'
@@ -158,26 +158,23 @@ const router = createRouter({
 
 // // 检查本地存储是否存在token，若存在则直接使用
 // if (localStorage.getItem('token')) {
-//   store.commit('set_token', localStorage.getItem('token'))
+//   userData.commit('set_token', localStorage.getItem('token'))
 // }
 
 // 检测到已登录之后自动跳转 /dashboard 的界面
 const _autoRedirectLogined = ['Login', 'Register', 'ResetPassword']
 
 router.beforeEach((to, from, next) => {
+  logger.info(`Routing from ${from.name} to ${to.name}`)
   startLoadingBar()
   if (_autoRedirectLogined.includes(to.name)) {
-    const hasToken = store.getters.get_token != ''
-    logger.info(`Has token: ${hasToken}${hasToken ? ` ${store.getters.get_token}` : ''}`)
+    const hasToken = userData.getters.get_token != ''
+    logger.info(`Has token: ${hasToken}${hasToken ? ` ${userData.getters.get_token}` : ''}`)
     if (hasToken) next({ name: 'Dashboard' })
     else next()
-    return
-  }
-  if (to.name === 'MainPage') {
+  } else if (to.name === 'MainPage') {
     next()
-    return
-  }
-  if (!store.getters.get_token) {
+  } else if (userData.getters.get_token == '') {
     next({ name: 'Login', query: { redirect: location.pathname } })
   } else {
     next()
@@ -214,7 +211,7 @@ router.afterEach((to) => {
       changeShowGuestSideBar(false)
   }
 
-  if (store.getters.get_token) {
+  if (userData.getters.get_token) {
     setSideBarActiveKey(to.name)
   } else {
     setGuestSideBarActiveKey(to.name)

src/twemoji-amazing.css

@@ -1014,7 +1014,7 @@
 .twa-control-knobs {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f39b.svg');
 }
-.twa-convenience-store {
+.twa-convenience-userData {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f3ea.svg');
 }
 .twa-cook {
@@ -1560,7 +1560,7 @@
 .twa-delivery-truck {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f69a.svg');
 }
-.twa-department-store {
+.twa-department-userData {
   background-image: url('https://fastly.jsdelivr.net/gh/twitter/twemoji@master/assets/svg/1f3ec.svg');
 }
 .twa-derelict-house {

src/utils/profile.js

@@ -1,6 +1,6 @@
 import axios from 'axios'
 import { ref } from 'vue'
-import store from './stores/store'
+import userData from './stores/userData'
 import router from '@/router/index'
 import { get } from './request'
 import { sendWarningMessage } from './message'
@@ -50,7 +50,6 @@ export function getProxies(username, token) {
 }
 
 export function logout() {
-  store.commit('delete_token')
-  store.commit('delete_user_info')
+  userData.commit('delete_user_info')
   router.push('/login')
 }

src/utils/request.js

@@ -3,7 +3,7 @@ import axios from 'axios'
 // 序列化
 import QS from 'qs'
 // vuex
-import store from './stores/store'
+import userData from './stores/userData'
 import router from '@/router/index'
 import Base64 from 'qs/lib/utils'
 import { sendErrorMessage } from './message'
@@ -33,7 +33,7 @@ instance.interceptors.request.use(
     // 每次发送请求之前判断vuex中是否存在token
     // 如果存在，则统一在http请求的header都加上token，这样后台根据token判断你的登录情况
     // 即使本地存在token，也有可能token是过期的，所以在响应拦截器中要对返回状态进行判断
-    const token = store.getters.get_token
+    const token = userData.getters.get_token
     // 2024-09-07 Muska_Ami: 修复 Token 泄露问题 只有在指定域名请求时才应该添加 Token
     const url = new URL(config.url)
     logger.info(url.hostname + ', ' + url.pathname + ', ' + tokenDomains.includes(url.hostname))