在 Angular 中连接 WebSocket答案

【问题标题】：Connecting a WebSocket in Angular在 Angular 中连接 WebSocket
【发布时间】：2020-03-31 13:53:19
【问题描述】：

我在 Node 中有 WebSocket 连接，它工作正常。现在我想通过 rxjs websocket 在 Angular 中使用它，但我不知道如何解决连接问题。

const WebSocket = require('ws');

const ws = new WebSocket('wss://example.com');


ws.on('open', function open() {
  // on connection, send our authentication request
  ws.send(JSON.stringify({action: 'auth', key: apiKey, secret: apiSecret}));  
});

ws.on('close', function close() {
  console.log('disconnected');
});

ws.on('message', function incoming(data) {
  console.log(data)
  var msg = JSON.parse(data);
  if (msg.type === 'status' && msg.status === 'authenticated') {
    // if we got authentication confirmation, send subscribe event to the server
    ws.send(JSON.stringify({action: 'subscribe', buckets: ['exampleBucket']}));
  }
});

【问题讨论】：

标签： angular websocket rxjs

【解决方案1】：

监听来自服务器的消息

import { webSocket } from "rxjs/webSocket";
const subject = webSocket('wss://example.com');

subject.subscribe(
   msg => console.log('message received: ' + msg), // Called whenever there is a message from the server.
   err => console.log(err), // Called if at any point WebSocket API signals some kind of error.
   () => console.log('complete') // Called when connection is closed (for whatever reason).
 );

向服务器推送消息

import { webSocket } from "rxjs/webSocket";
const subject = webSocket('wss://example.com');

subject.subscribe();
// Note that at least one consumer has to subscribe to the created subject - otherwise "nexted" values will be just buffered and not sent,
// since no connection was established!

subject.next({message: 'some message'});
// This will send a message to the server once a connection is made. Remember value is serialized with JSON.stringify by default!

subject.complete(); // Closes the connection.

subject.error({code: 4000, reason: 'I think our app just broke!'});
// Also closes the connection, but let's the server know that this closing is caused by some error.

【讨论】：