feat: 添加 WebSocket 客户端工具

This commit is contained in:
2026-06-23 11:10:34 +08:00
parent e2068ad95e
commit 0d76d7a6de

View File

@@ -0,0 +1,77 @@
import type { WsMessage } from '@/api/modules/game'
/** WebSocket 连接回调 */
export interface RoomSocketCallbacks {
onOpen?: () => void
onClose?: (event: CloseEvent) => void
onError?: (event: Event) => void
onMessage?: (message: WsMessage) => void
}
/** WebSocket 客户端封装 */
export interface RoomSocket {
/** 发送消息 */
send: (type: string, data?: unknown) => void
/** 关闭连接 */
close: () => void
/** 连接状态 */
isOpen: () => boolean
}
/**
* 创建房间 WebSocket 连接
*
* @param roomId 房间 ID
* @param token 用户认证 token
* @param callbacks 事件回调
* @returns RoomSocket 控制对象
*/
export function createRoomSocket(
roomId: string,
token: string,
callbacks: RoomSocketCallbacks
): RoomSocket {
const wsUrl = `${window.location.protocol === 'https:' ? 'wss:' : 'ws:'}//${window.location.host}/ws/room?roomId=${encodeURIComponent(roomId)}&token=${encodeURIComponent(token)}`
const ws = new WebSocket(wsUrl)
ws.onopen = () => {
// eslint-disable-next-line no-console
console.log('[WS] 房间连接已建立, roomId=', roomId)
callbacks.onOpen?.()
}
ws.onclose = (event) => {
// eslint-disable-next-line no-console
console.log('[WS] 房间连接已关闭, roomId=', roomId, 'code=', event.code)
callbacks.onClose?.(event)
}
ws.onerror = (event) => {
console.error('[WS] 房间连接错误, roomId=', roomId, event)
callbacks.onError?.(event)
}
ws.onmessage = (event) => {
try {
const message: WsMessage = JSON.parse(event.data as string)
callbacks.onMessage?.(message)
} catch (e) {
console.error('[WS] 消息解析失败:', e)
}
}
return {
send(type: string, data?: unknown) {
if (ws.readyState === WebSocket.OPEN) {
ws.send(JSON.stringify({ type, data }))
}
},
close() {
ws.close(1000, '用户离开')
},
isOpen() {
return ws.readyState === WebSocket.OPEN
}
}
}