From fd5437292a2fa31b94f7a933dd16af643118ba37 Mon Sep 17 00:00:00 2001 From: xion Date: Sat, 22 Mar 2025 14:34:17 +0800 Subject: [PATCH] fix: fix onopen --- demo/src/test2.ts | 3 +- package.json | 3 +- src/ws.ts | 73 +++++++++++++++++++++++++++++++++++++++++++---- 3 files changed, 71 insertions(+), 8 deletions(-) diff --git a/demo/src/test2.ts b/demo/src/test2.ts index b1bc2fa..b3c016c 100644 --- a/demo/src/test2.ts +++ b/demo/src/test2.ts @@ -1,4 +1,5 @@ -import { QueryClient } from '@abearxiong/query'; +// @ts-ignore +import { QueryClient } from '@kevisual/query'; const query = new QueryClient({ url: '/api/router', io: true }); diff --git a/package.json b/package.json index 4bca3b5..ef7b27e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@kevisual/query", - "version": "0.0.14", + "version": "0.0.15-alpha.1", "main": "dist/index.js", "module": "dist/index.js", "types": "dist/index.d.ts", @@ -9,6 +9,7 @@ "scripts": { "build": "npm run clean && rollup -c", "build:app": "npm run build && rsync dist/* ../deploy/dist", + "dev:lib": "rollup -c -w", "clean": "rm -rf dist" }, "files": [ diff --git a/src/ws.ts b/src/ws.ts index cf340dc..fbc9f3a 100644 --- a/src/ws.ts +++ b/src/ws.ts @@ -47,31 +47,42 @@ export class QueryWs { */ async connect(opts?: { timeout?: number }) { const store = this.store; + const that = this; const connected = store.getState().connected; if (connected) { return Promise.resolve(true); } return new Promise((resolve, reject) => { - const ws = this.ws || new WebSocket(this.url); - const timeout = opts?.timeout || 5 * 60 * 1000; // 默认 2 分钟 + const ws = that.ws || new WebSocket(that.url); + const timeout = opts?.timeout || 5 * 60 * 1000; // 默认 5 分钟 let timer = setTimeout(() => { + const isOpen = ws.readyState === WebSocket.OPEN; + if (isOpen) { + console.log('WebSocket 连接成功 in timer'); + resolve(true); + return; + } console.error('WebSocket 连接超时'); reject('timeout'); }, timeout); - ws.onopen = () => { + ws.onopen = (ev) => { store.getState().setConnected(true); store.getState().setStatus('connected'); resolve(true); clearTimeout(timer); }; - ws.onclose = () => { + ws.onclose = (ev) => { store.getState().setConnected(false); store.getState().setStatus('disconnected'); this.ws = null; }; }); } - + /** + * ws.onopen 必须用这个去获取,否者会丢失链接信息 + * @param callback + * @returns + */ listenConnect(callback: () => void) { const store = this.store; const { connected } = store.getState(); @@ -96,10 +107,41 @@ export class QueryWs { ); return cancel; } + listenClose(callback: () => void) { + const store = this.store; + const { status } = store.getState(); + if (status === 'disconnected') { + callback(); + } + const subscriptionOne = (selector: (state: QueryWsStore) => QueryWsStore['status'], listener: QueryWsStoreListener) => { + const unsubscribe = store.subscribe((newState: any, oldState: any) => { + if (selector(newState) !== selector(oldState)) { + listener(newState, oldState); + unsubscribe(); + } + }); + return unsubscribe; + }; + const cancel = subscriptionOne( + (state) => state.status, + (newState, oldState) => { + if (newState.status === 'disconnected') { + callback(); + } + }, + ); + return cancel; + } onMessage( fn: (data: U, event: MessageEvent) => void, opts?: { + /** + * 是否将数据转换为 JSON + */ isJson?: boolean; + /** + * 选择器 + */ selector?: (data: T) => U; }, ) { @@ -136,7 +178,26 @@ export class QueryWs { store.getState().setConnected(false); store.getState().setStatus('disconnected'); } - send(data: T, opts?: { isJson?: boolean; wrapper?: (data: T) => U }) { + /** + * 发送消息 + * + * @param data + * @param opts + * @returns + */ + send( + data: T, + opts?: { + /** + * 是否将数据转换为 JSON + */ + isJson?: boolean; + /** + * 包装数据 + */ + wrapper?: (data: T) => U; + }, + ) { const ws = this.ws; const isJson = opts?.isJson ?? true; const wrapper = opts?.wrapper;