超时后无法重新连接到套接字

Question

我在我的 Angular 应用中将此代码作为服务：

import * as io from 'socket.io-client';
import { Observable } from 'rxjs'

export class AppChatService {
    private url = 'http://localhost:3000';
    private socket;    



    constructor() {

        this.socket = io.connect( this.url);

    this.socket.on('connect', function(){
    console.log('connection established');


   });

    this.socket.on('disconnect', function(){
        console.log('reached on disconnect function');
        this.socket.socket.connect();
    }); 



  }



    public disconnectManually(){
        this.socket.disconnect();
        console.log('disconnected manually');
    }


    public sendMessage(message) {
        this.socket.emit('new-message', message);
    }
    public connectToChatroom(roomObject){

        this.socket.emit('create',roomObject);
    }

    public getMessages = () => {
        return Observable.create((observer) => {
            this.socket.on('new-message', (message) => {
                console.log('reached get messages observable app chat service');

                observer.next(message);
            });


        });
    }

}

当我尝试手动断开连接时，“断开连接”功能被成功调用，并且我可以在控制台中看到“已达到断开连接功能”，如预期的那样。但是这个声明： this.socket.socket.connect();

在浏览器中触发此错误：

ERROR TypeError: Cannot read property 'socket' of undefined

我无法理解为什么。任何帮助都将不胜感激。

Answer 1

那是因为您使用了function 关键字，这会改变this 上下文，请改用箭头函数：

this.socket.on('disconnect', () => {
    console.log('reached on disconnect function');
    this.socket.connect();
}); 

您还可以查看 socket.io 中的 Manager 选项，使其自动重新连接