zoukankan      html  css  js  c++  java
  • ng websocket

    ng使用websocket

    1.安装依赖库
    npm install ws --save

    2.安装类型定义文件

    npm install @types/ws --save

    3.编写服务

    import { Injectable } from '@angular/core';
    import {Observable} from "rxjs/Observable";

    @Injectable()
    export class WebSocketService {


    ws:WebSocket;

    constructor() { }

    createObservableSocket(url:string):Observable<any>{
    this.ws=new WebSocket(url);
    return new Observable(
    observer=>{
    this.ws.onmessage=(event)=>observer.next(event.data);
    this.ws.onerror=(event)=>observer.error(event);
    this.ws.onclose=(event)=>observer.complete();
    }
    )
    }

    sendMessage(msg:string){
    this.ws.send(msg);
    }
    }

    4.在控制器中使用

    import { Component, OnInit } from '@angular/core';
    import {Observable} from "rxjs/Observable";
    import 'rxjs/add/operator/debounceTime';
    import 'rxjs/add/operator/throttleTime';
    import 'rxjs/add/observable/fromEvent';
    import 'rxjs/add/operator/retry';
    import {observable} from "rxjs/symbol/observable";
    import {HttpService} from "../service/http.service";
    import {WebSocketService} from "../service/web-socket.service";

    @Component({
    selector: 'app-home',
    templateUrl: './home.component.html',
    styleUrls: ['./home.component.css']
    })
    export class HomeComponent implements OnInit {

    constructor(private httpreq:HttpService,private wsService:WebSocketService) {

    }


    ngOnInit() {
    //this.httpreq._get('',(data)=>console.log(data));
    this.wsService.createObservableSocket('ws://localhost:8080')
    .subscribe(
    data=>console.log(data),
    err=>console.log(err),
    ()=>console.log('it s over')
    )
    }

    sendMessageToServer(msg:string){
    this.wsService.sendMessage(msg);
    }


    }

  • 相关阅读:
    用Live Writers发布Blog
    ScribeFire
    再再上传一个图片
    jQuery页面加载初始化常用的三种方法
    JS 20200101T00:00:00.000000Z 日期格式转换、Sun Jul 04 2021 00:00:00 GMT+0800 (中国标准时间)转20210704 00:00
    vue 组件传值 props $emit $event
    jquery或js如何判断一个层是显示还是隐藏
    js合并俩个数组的三种方法
    uniapp生命周期
    SVN版本冲突
  • 原文地址:https://www.cnblogs.com/norm/p/8023491.html
Copyright © 2011-2022 走看看