0
votes

1.here is my websocket.service.ts file

import { Injectable } from '@angular/core';
import { Observable, } from 'rxjs';
import  {io} from 'socket.io-client';
  
@Injectable({
  providedIn: 'root'
})
export class WebsocketService {

  socket: any;
  readonly uri: string = "ws://localhost:3000";
    
  constructor() {
    this.socket = io(this.uri);
   }
    
  listen(eventName: string, data:any){
    return new Observable((subscriber) => {
      this.socket.on(eventName, (data) => {
        subscriber.next(data)
      })
    })
  }
    
  emit(eventName: string , data: any){
    this.socket.emit(eventName,data);
  }
}
  1. here is my app.components.ts file
import { Component, OnInit } from '@angular/core';
import { WebsocketService } from './websocket.service';
    
@Component({
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
})
export class AppComponent implements OnInit {
  title = 'socket-io-example';
    
  constructor( private websockerservice: WebsocketService){
  }
    
  ngOnInit(){
    // here we want to listen to an event from socket.io server
    this.websockerservice.listen('test event','data').subscribe((data) =>{
      console.log(data);
    })
  }
}
  1. here is my node.js, socket-io.server.js file
var server = require('http').Server(app); //here i got refernce error: app is not defined
                                        ~~~
var io = require('socket.io')(server);
    
io.on('connection', function(socket){
    console.log("A user cconnected");
    
    socket.emit('test event', 'here is some data');
});
    
server.listen(3000, () => {
    console.log("server.io server is listing to port 3000")
});
1

1 Answers

0
votes

You must define app first. With express you can do the following:

const express = require('express');
var app = express();