Node's Pretty Magical

    ngx-socketio2
    TypeScript icon, indicating that this package has built-in type declarations

    2.0.1 • Public • Published

    ngx-socketio2

    A better Socket.IO module for Angular.

    npm version Node.js CI License Angular CodeFactor

    Features

    • The ability to type event objects.
    • More complete API.
    • Support chain call.
    • Responsive event listener.

    Prerequisites

    Install

    npm i ngx-socketio2

    Usage

    Import and configure the SocketioModule:

    import { SocketioModule } from 'ngx-socketio2';
    
    @NgModule({
      // ...
      imports: [
        // ...
        SocketioModule.forRoot({
          url: 'http://localhost:4200',
          options: {
            // Socket.IO client options
          }
        })
      ]
    })
    export class YourModule { }

    Getting Socketio Service via DI:

    import { Injectable } from '@angular/core';
    import { Socket } from 'ngx-socketio2';
    import { tap } from 'rxjs/operators';
    
    @Injectable()
    export class YourService {
      constructor(private socket: Socket) {}
    
      send(msg: string) {
        this.socket.emit('message', msg);
      }
    
      sendMultiple(msg1: string, msg2: string) {
        // Chain call.
        this.socket.emit('message', msg1).emit('message', msg2);
      }
    
      receive() {
        return this.socket.on<string>('message').pipe(
          tap((args: string) => {
            // Do something...
          })
        );
      }
    }

    Using multiple sockets with different endpoints

    In this case, we no longer need the SocketioModule. Instead, use a new service that extends from the Socketio service and passes the configuration by calling super(config).

    import { Injectable } from '@angular/core';
    import { Socket } from 'ngx-socketio2';
    
    @Injectable()
    export class Socket1Service extends Socket {
      constructor() {
        super({ url: 'http://localhost:4200' })
      }
    }
    
    @Injectable()
    export class Socket2Service extends Socket {
      constructor() {
        super({ url: 'http://localhost:6200' })
      }
    }
    @NgModule({
      // ...
      providers: [
        // ...
        Socket1Service,
        Socket2Service
      ]
    })
    export class YourModule { }

    API

    Class API Description
    SocketioModule .forRoot({ url[, options] }) https://socket.io/docs/v4/client-api/#iourl
    Socket .id https://socket.io/docs/v4/client-api/#socketid
    .connected https://socket.io/docs/v4/client-api/#socketconnected
    .disconnected https://socket.io/docs/v4/client-api/#socketdisconnected
    .io https://socket.io/docs/v4/client-api/#socketio
    .auth https://socket.io/docs/v4/client-options/#auth
    .connect() https://socket.io/docs/v4/client-api/#socketconnect
    .disconnect() https://socket.io/docs/v4/client-api/#socketdisconnect
    .send([...args][, ack]) https://socket.io/docs/v4/client-api/#socketsendargs
    .emit(eventName[, ...args][, ack]) https://socket.io/docs/v4/client-api/#socketemiteventname-args
    .on(eventName) https://socket.io/docs/v4/client-api/#socketoneventname-callback
    .once(eventName) Similar to .on(eventName), but only responds once.
    .compress(compress) https://socket.io/docs/v4/client-api/#socketcompressvalue

    Install

    npm i ngx-socketio2

    DownloadsWeekly Downloads

    165

    Version

    2.0.1

    License

    MIT

    Unpacked Size

    111 kB

    Total Files

    22

    Last publish

    Collaborators

    • hyperlife1119