我正在用Angular 4和websocket創建聊天應用程序。對於這一點,我已經按照這個Angular websocket tutorialAngular 4中的WebSocket
這裏是WebsocketService
源代碼:
import { Injectable } from '@angular/core';
import * as Rx from 'rxjs/Rx';
@Injectable()
export class WebsocketService {
constructor() { }
private subject: Rx.Subject<MessageEvent>;
public connect(url): Rx.Subject<MessageEvent> {
if (!this.subject) {
this.subject = this.create(url);
console.log("Successfully connected: " + url);
}
return this.subject;
}
private create(url): Rx.Subject<MessageEvent> {
let ws = new WebSocket(url);
let observable = Rx.Observable.create(
(obs: Rx.Observer<MessageEvent>) => {
ws.onmessage = obs.next.bind(obs);
ws.onerror = obs.error.bind(obs);
ws.onclose = obs.complete.bind(obs);
return ws.close.bind(ws);
})
let observer = {
next: (data: Object) => {
if (ws.readyState === WebSocket.OPEN) {
ws.send(JSON.stringify(data));
}
}
}
return Rx.Subject.create(observer, observable);
}
}
而且這是我的ChatService
:
import { Injectable } from '@angular/core';
import { Observable, Subject } from 'rxjs/Rx';
import { WebsocketService } from './websocket.service';
const CHAT_URL = 'ws://echo.websocket.org/';
export interface Message {
author: string,
message: string
}
@Injectable()
export class ChatService {
public messages: Subject<Message>;
constructor(wsService: WebsocketService) {
this.messages = <Subject<Message>>wsService
.connect(CHAT_URL)
.map((response: MessageEvent): Message => {
let data = JSON.parse(response.data);
return {
author: data.author,
message: data.message
}
});
}
}
它工作正常,但我想檢測連接狀態。我想知道連接是否中斷或服務器是否關閉。
對於這一點,我試圖實現WebsocketService
類內的isServerOn()
功能是這樣的:
isServerOn(): Observable<boolean> {
return Observable.of(!!this.subject);
}
但一直沒有解決問題。有沒有人惹過同樣的問題?
預先感謝您。
什麼是「this.server」?我懷疑它有一種類型,可以通過調用Observable.of來創建一個可以實現所需內容的observable。 –
這是一個錯字,我的意思是'this.subject' – Laiso