WebSocketSubjectConfig

WebSocketSubjectConfig 是一個(gè)普通的對(duì)象，它使我們能夠 webSocket 可配置。

interface WebSocketSubjectConfig<T> {
      url: string
      protocol?: string | Array<string>
      resultSelector?: (e: MessageEvent) => T
      serializer?: (value: T) => WebSocketMessage
      deserializer?: (e: MessageEvent) => T
      openObserver?: NextObserver<Event>
      closeObserver?: NextObserver<CloseEvent>
      closingObserver?: NextObserver<void>
      WebSocketCtor?: {...}
      binaryType?: 'blob' | 'arraybuffer'
    }

描述

提供靈活性 webSocket

它定義了一組屬性以提供特定的自定義行為 套接字生命周期的時(shí)刻。 連接打開后，我們可以 使用 openObserver中，當(dāng)連接關(guān)閉 closeObserver，如果我們 有興趣的監(jiān)聽數(shù)據(jù)從正在添加服務(wù)器： deserializer， 這使我們可以在傳遞數(shù)據(jù)之前自定義數(shù)據(jù)的反序列化策略 到套接字客戶端。 默認(rèn)情況下 deserializer將應(yīng)用于 JSON.parse每條消息 從服務(wù)器。

例

deserializer ，此屬性的默認(rèn)值為， JSON.parse但由于只有兩個(gè)選項(xiàng) 對(duì)于傳入數(shù)據(jù)，可以是文本或二進(jìn)制數(shù)據(jù)。 我們可以應(yīng)用自定義反序列化策略 或只是簡(jiǎn)單地跳過默認(rèn)行為。

import { webSocket } from 'rxjs/webSocket';


const wsSubject = webSocket({
    url: 'ws://localhost:8081',
//Apply any transformation of your choice.
    deserializer: ({data}) => data
});


wsSubject.subscribe(console.log);


// Let's suppose we have this on the Server: ws.send("This is a msg from the server")
//output
//
// This is a msg from the server

序列化程序 允許我們使用自定義序列化策略，但對(duì)于傳出消息

import { webSocket } from 'rxjs/webSocket';


const wsSubject = webSocket({
    url: 'ws://localhost:8081',
//Apply any transformation of your choice.
    serializer: msg => JSON.stringify({channel: "webDevelopment", msg: msg})
});


wsSubject.subscribe(() => subject.next("msg to the server"));


// Let's suppose we have this on the Server: ws.send("This is a msg from the server")
//output
//
// {"channel":"webDevelopment","msg":"msg to the server"}

closeObserver 當(dāng)出現(xiàn)錯(cuò)誤時(shí)， 允許我們?cè)O(shè)置自定義錯(cuò)誤。

import { webSocket } from 'rxjs/webSocket';


const wsSubject = webSocket({
    url: 'ws://localhost:8081',
    closeObserver: {
        next(closeEvent) {
            const customError = { code: 6666, reason: "Custom evil reason" }
            console.log(`code: ${customError.code}, reason: ${customError.reason}`);
        }
    }
});


//output
// code: 6666, reason: Custom evil reason

openObserver ，假設(shè)我們需要先執(zhí)行某種 init 任務(wù)，然后再將消息發(fā)送/接收到 webSocket 或發(fā)送連接成功的通知，這是在 openObserver 適用于。

import { webSocket } from 'rxjs/webSocket';


const wsSubject = webSocket({
    url: 'ws://localhost:8081',
    openObserver: {
        next: () => {
            console.log('connetion ok');
        }
    },
});


//output
// connetion ok`

物產(chǎn)