javascript - 我如何通过 Angular 向套接字服务器发送数据和获取数据

Question

目前我正在尝试通过 Angular 客户端发送和获取数据到套接字服务器以及从套接字服务器到 Angular 我需要获取数据我能够推送数据但我需要知道如何将数据推送到api在套接字服务器中是否存在并从 api 获取数据到套接字服务器并将其发送给客户端

下面是我的

用于从 Angular 客户端向套接字服务器发送数据

• 组件代码

  构造函数(公共(public)套接字服务:SocketioService){

     }
  
    ngOnInit(){
       this.socketService.setupSocketConnection();
     }
   // For sending post request
     sendMsg(){
       this.socketService.sendData(this.title);
     }
      // For getting the request
     getMsg(){
  
      this.socketService.getMsg().subscribe(res => {
        console.log(res);
      })
  

Angular 服务代码

import * as io from 'socket.io-client';

import { Observable } from 'rxjs';

socket;
  constructor() {

  }
  setupSocketConnection() {
    this.socket = io(environment.SOCKET_ENDPOINT);


  }
  // for posting data
  sendData(values){
    console.log(values);
    this.socket.emit('my message', values);
  }
   //for getting data
  getMsg(){
   return Observable.create((observer) => {
    this.socket.on('grabMsg', (message) => {
        observer.next(message);
    });
});
  }

节点服务器代码

const app = require('express')();
const http = require('http').createServer(app);
const io = require('socket.io')(http);
app.get('/', (req, res) => {
  res.send('<h1>Hey Socket.io</h1>');
});
io.on('connection', (socket) => {
  console.log('a user connected');
  socket.on('disconnect', () => {
    console.log('user disconnected');
  });
  socket.on('my message', (msg) => {
      //here i want to consume api like 
      // localhost:3000(post) {"title":"ss"}

    console.log('message: ' + msg);
  });
  socket.on('grabMsg', () => {
        //here i want to consume api like 
      // localhost:3000(get)
      let ms = 'max'
      io.emit(ms);
  });
});
http.listen(3001, () => {
  console.log('listening on *:3001');
});

所以在这里我如何在套接字服务器中发送和发布数据 简而言之，我会将数据从 Angular 客户端发送到套接字服务器，然后再发送到某个 api

Answer 1

//server-side
socket.on('grabMsg', () => {
  let ms = 'max'
  io.emit(ms);
});

//client-side
this.socket.on('grabMsg', (message) => {
    observer.next(message);
});

在上面的代码中，你在客户端和服务器端都使用了 socket.on，根据你的要求使用一个作为 emit as 一个作为 on。

在下面的代码中，你只发射并且有第一个参数用于发射(任何文本包含在旁引号中)，如下面的代码

socket.on('grabMsg', () => {
  let ms = 'max'
  io.emit("thatText",ms);
});

相同的文本(thatText)也应该在客户端，比如

this.socket.on('thatText', (message) => {
   console.log(message)
});