feat: 添加 WebSocket 客户端工具
This commit is contained in:
77
src/common/websocket/roomSocket.ts
Normal file
77
src/common/websocket/roomSocket.ts
Normal 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
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
Reference in New Issue
Block a user