AngularJS：在服务中重新连接 WebSocket

Posted 2023-02-16

【中文标题】AngularJS：在服务中重新连接 WebSocket

【英文标题】：AngularJS: Reconnect WebSocket inside a service

【发布时间】：2015-09-09 09:50:56

【问题描述】：

我在我的 AngularJS 应用程序中使用网络套接字。 当用户注销时，客户端将关闭 Web 套接字连接。 当用户重新登录时，我需要重新连接网络套接字。 Web 套接字包含在服务中（代码简化了一点）：

angular.module('myApp').factory("SubscriptionFactory", function () 
    var Service = ;
    var ws = new WebSocket("ws://127.0.0.1:8000");

    /* WS methods (onopen, onmessage ect) left out for simplicity */

    Service.reestablishConnection = function() 
        // Reestablishing connection
        ws = new WebSocket("ws://127.0.0.1:8000");
    
    return Service;

问题是网络套接字的新实例不起作用。 根据this question，Web 套接字在重新创建时需要将其处理程序重新附加到对象。 但是 AngularJS 服务是单例的（根据this question 应该保持单例）。 如何在 AngularJS 单例服务中重新创建 Web 套接字实例？

【参考方案1】：

我自己找到了解决方案。其实很简单：

angular.module('myApp').factory("SubscriptionFactory", function () 
    var Service = ;
    var ws;

    Service.onMessage = function(message)  /* some code */;
    Service.onClose = function()  /* some code */ ;
    Service.onOpen = function()  /* some code */;
    Service.onError = function(error)  /* some code */;

    Service.connect = function() 
        // (Re)connect
        ws = new WebSocket("ws://127.0.0.1:8000");
        // Reattaching handlers to object
        ws.onmessage = Service.onMessage;
        ws.onclose = Service.onClose;
        ws.onopen = Service.onOpen;
        ws.onerror = Service.onError;
    
    return Service;

这里发生的事情很简单：我创建了一个新的 Web Socket 对象并手动将 Web Sockets 处理程序附加到我的 AngularJS 服务。