refactor: 优化断线重连逻辑，清理缓存会话并重新获取当前会话信息

shared/api/socket.ts

@@ -91,6 +91,13 @@ export class AppSocket {
     this.socket.io.on('reconnect', cb);
   }
 
+  /**
+   * 断开连接
+   */
+  disconnect() {
+    this.socket.disconnect();
+  }
+
   /**
    * 初始Socket状态管理提示
    */

shared/redux/hooks/useConverseMessage.ts

@@ -81,6 +81,7 @@ export function useConverseMessage(context: ConverseContext) {
   const converse = useAppSelector<ChatConverseState | undefined>(
     (state) => state.chat.converses[converseId]
   );
+  const reconnectNum = useAppSelector((state) => state.global.reconnectNum);
   const hasMoreMessage = converse?.hasMoreMessage ?? true;
   const dispatch = useAppDispatch();
   const messages = converse?.messages ?? [];
@@ -93,7 +94,7 @@ export function useConverseMessage(context: ConverseContext) {
     };
   }, [converseId]);
 
-  // NOTICE: 该hook只会在converseId变化时执行
+  // NOTICE: 该hook只会在converseId变化和重新链接时执行
   const { loading, error } = useAsync(async () => {
     if (!converse) {
       // 如果是一个新会话(或者当前会话列表中没有)
@@ -140,7 +141,7 @@ export function useConverseMessage(context: ConverseContext) {
         );
       }
     }
-  }, [converseId]);
+  }, [converseId, reconnectNum]);
 
   // 加载更多消息
   const [{ loading: isLoadingMore }, handleFetchMoreMessage] =

shared/redux/setup.ts

@@ -38,6 +38,12 @@ export function setupRedux(socket: AppSocket, store: AppStore) {
   socket.onReconnect(() => {
     console.warn('因为断线重连触发重新同步远程数据');
     initial(socket, store);
+    /**
+     * 重置会话列表
+     * 如果当前已经打开了一个会话列表则会让该会话自行更新(由useConverseMessage保障)
+     */
+    store.dispatch(chatActions.clearAllConverses());
+    store.dispatch(globalActions.incReconnectNum());
   });
 
   sharedEvent.on('updateNetworkStatus', (status) => {

shared/redux/slices/chat.ts

@@ -149,6 +149,13 @@ const chatSlice = createSlice({
       state.converses[converseId].hasFetchedHistory = true;
     },
 
+    /**
+     * 清理所有会话信息
+     */
+    clearAllConverses(state) {
+      state.converses = {};
+    },
+
     /**
      * 设置已读消息
      */

shared/redux/slices/global.ts

@@ -5,10 +5,12 @@ export interface GlobalState {
    * 网络状态
    */
   networkStatus: 'initial' | 'connected' | 'reconnecting' | 'disconnected';
+  reconnectNum: number;
 }
 
 const initialState: GlobalState = {
   networkStatus: 'initial',
+  reconnectNum: 0,
 };
 
 const globalSlice = createSlice({
@@ -21,6 +23,9 @@ const globalSlice = createSlice({
     ) {
       state.networkStatus = action.payload;
     },
+    incReconnectNum(state) {
+      state.reconnectNum += 1;
+    },
   },
 });