fixed bug for: websocket is not auto connected when user not login

web/src/App.vue

@@ -6,7 +6,7 @@
 
 <script setup>
 import {ElConfigProvider} from 'element-plus';
-import {onMounted, ref} from "vue";
+import {onMounted, ref, watch} from "vue";
 import {checkSession, getClientId, getSystemInfo} from "@/store/cache";
 import {isChrome, isMobile} from "@/utils/libs";
 import {showMessageInfo} from "@/utils/dialog";
@@ -34,6 +34,7 @@ window.ResizeObserver = class ResizeObserver extends _ResizeObserver {
   }
 }
 
+const store = useSharedStore()
 onMounted(() => {
   // 获取系统参数
   getSystemInfo().then((res) => {
@@ -47,13 +48,18 @@ onMounted(() => {
   }
 
   checkSession().then(() => {
+    store.setIsLogin(true)
     connect()
   }).catch(()=>{})
 })
 
-const store = useSharedStore()
+watch(() => store.isLogin, (val) => {
-const handler = ref(0)
+  if (val) {
+    connect()
+  }
+})
 
+const handler = ref(0)
 // 初始化 websocket 连接
 const connect = () => {
   let host = process.env.VUE_APP_WS_HOST

web/src/components/LoginDialog.vue

@@ -251,6 +251,7 @@ import Captcha from "@/components/Captcha.vue";
 import ResetPass from "@/components/ResetPass.vue";
 import {setRoute} from "@/store/system";
 import {useRouter} from "vue-router";
+import {useSharedStore} from "@/store/sharedata";
 
 // eslint-disable-next-line no-undef
 const props = defineProps({
@@ -285,6 +286,7 @@ const action = ref("login")
 const enableVerify = ref(false)
 const showResetPass = ref(false)
 const router = useRouter()
+const store = useSharedStore()
 // 是否需要验证码，输入一次密码错之后就要验证码
 const needVerify = ref(false)
 
@@ -354,6 +356,7 @@ const doLogin = (verifyData) => {
   data.value.x = verifyData.x
   httpPost('/api/user/login', data.value).then((res) => {
     setUserToken(res.data.token)
+    store.setIsLogin(true)
     ElMessage.success("登录成功！")
     emits("hide")
     emits('success')

web/src/store/session.js

@@ -16,7 +16,6 @@ export function getSessionId() {
 export function getUserToken() {
     return Storage.get(UserTokenKey) ?? ""
 }
-
 export function setUserToken(token) {
     // 刷新 session 缓存
     Storage.set(UserTokenKey, token)

web/src/store/sharedata.js

@@ -10,6 +10,7 @@ export const useSharedStore = defineStore('shared', {
         messageHandlers:{},
         mobileTheme: Storage.get("mobile_theme", "light"),
         adminTheme: Storage.get("admin_theme", "light"),
+        isLogin: false
     }),
     getters: {},
     actions: {
@@ -64,6 +65,9 @@ export const useSharedStore = defineStore('shared', {
         setAdminTheme(theme) {
             this.adminTheme = theme
             Storage.set("admin_theme", theme)
+        },
+        setIsLogin(value) {
+            this.isLogin = value
         }
     },
 });

web/src/views/ChatPlus.vue

@@ -446,9 +446,8 @@ const initData = () => {
       checkSession().then((user) => {
         loginUser.value = user
         isLogin.value = true
-
         newChat();
-      })
+      }).catch(() => {})
 
     }).catch((e) => {
       ElMessage.error('获取聊天角色失败: ' + e.messages)

web/src/views/Home.vue

@@ -224,6 +224,7 @@ const logout = function () {
   httpGet('/api/user/logout').then(() => {
     removeUserToken()
     store.setShowLoginDialog(true)
+    store.setIsLogin(false)
     loginUser.value = {}
     // 刷新组件
     routerViewKey.value += 1

web/src/views/Index.vue

@@ -31,7 +31,6 @@
             <el-button :color="theme.btnBgColor" :style="{color: theme.btnTextColor}" @click="router.push('/login')" class="shadow" round>登录</el-button>
             <el-button :color="theme.btnBgColor" :style="{color: theme.btnTextColor}" @click="router.push('/register')" class="shadow" round>注册</el-button>
           </span>
-          <el-button :color="theme.btnBgColor" :style="{color: theme.btnTextColor}" @click="router.push('/test')" class="shadow" round>测试</el-button>
         </div>
       </el-menu>
     </div>

web/src/views/Login.vue

@@ -77,6 +77,7 @@ import ResetPass from "@/components/ResetPass.vue";
 import {showMessageError} from "@/utils/dialog";
 import Captcha from "@/components/Captcha.vue";
 import {setRoute} from "@/store/system";
+import {useSharedStore} from "@/store/sharedata";
 
 const router = useRouter();
 const title = ref('Geek-AI');
@@ -145,6 +146,7 @@ const login = function () {
   }
 }
 
+const store = useSharedStore()
 const doLogin = (verifyData) => {
   httpPost('/api/user/login', {
     username: username.value.trim(),
@@ -154,6 +156,7 @@ const doLogin = (verifyData) => {
     x: verifyData.x
   }).then((res) => {
     setUserToken(res.data.token)
+    store.setIsLogin(true)
     needVerify.value = false
     if (isMobile()) {
       router.push('/mobile')

web/src/views/mobile/Profile.vue

@@ -323,6 +323,7 @@ const pay = (product,payWay) => {
 const logout = function () {
   httpGet('/api/user/logout').then(() => {
     removeUserToken();
+    store.setIsLogin(false)
     router.push('/');
   }).catch(() => {
     showFailToast('注销失败！');