Javascript 角形网袋厂

Javascript 角形网袋厂,javascript,html,angularjs,websocket,Javascript,Html,Angularjs,Websocket,我有一个websocket服务,当页面被加载时,它的效果非常好。但是,如果连接丢失,并且服务正在尝试重新连接,我将收到一个错误:uncaughtreferenceerror:未定义服务。一旦我手动刷新页面,服务将再次工作。如何在不刷新页面的情况下重新连接?应用程序必须在没有任何用户参与的情况下重新建立连接。这是我的第一个angular应用程序,因此我仍在学习该框架。多谢各位 angular.module('proApp').factory('webSocketService', ['$q

我有一个websocket服务,当页面被加载时,它的效果非常好。但是,如果连接丢失,并且服务正在尝试重新连接,我将收到一个错误:uncaughtreferenceerror:未定义服务。一旦我手动刷新页面,服务将再次工作。如何在不刷新页面的情况下重新连接?应用程序必须在没有任何用户参与的情况下重新建立连接。这是我的第一个angular应用程序,因此我仍在学习该框架。多谢各位

angular.module('proApp').factory('webSocketService',
    ['$q', '$rootScope', function($q, $rootScope) {

            var timeout = 2000;
            var clearTimer = -1;
            var port = '8081';
            var server = '127.0.0.1';
            var socket;
            var host;
            var Service = {};

            function getSocketState() {
                return (socket != null) ? socket.readyState : 0;
            }

            function onMessage(e) {
                //console.log(e.data);
                Service.message = JSON.parse(e.data);

                $rootScope.$apply(function() {
                    Service.send();
                });
            }
            //allows data to be used in controller
            Service.send = function() {
                $rootScope.$broadcast('broadcast');
            };
            function onError() {
                clearInterval(clearTimer);
                socket.onclose = function() {
                };
                clearTimer = setInterval("Service.getData()", timeout);
            }

            function onClose() {
                clearInterval(clearTimer);
                clearTimer = setInterval("Service.getData()", timeout);

            }

            function onOpen() {
                clearInterval(clearTimer);
                console.log("open" + getSocketState());
            }

            Service.getData = function() {

                if ("WebSocket" in window) {
                    if (getSocketState() === 1) {
                        socket.onopen = onOpen;
                        clearInterval(clearTimer);
                        console.log(getSocketState());
                    } else {
                        try {
                            host = "ws://" + server + ":" + port + '';
                            socket = new WebSocket(host);
                            socket.onopen = onOpen;
                            socket.onmessage = function(e) {
                                onMessage(e);
                            };
                            socket.onerror = onError;
                            socket.onclose = onClose;
                        } catch (exeption) {
                            console.log(exeption);
                        }
                    }
                }
            };
            // Public API here
            return Service;

        }]);

您必须将setInterval的用法更改为:

clearTimer = setInterval(function () {
  Service.getData();
}, timeout);
或者仅仅是这样:

clearTimer = setInterval(Service.getData, timeout);

这是我使用的代码,它可以:

如果连接丢失,请重新连接。 断开连接时对项目进行排队,并在重新连接时发送。 使用listen方法进行常规订阅。 在删除订阅后,使用承诺为事件Listence一次。非常适合使用correlationId进行请求/响应 $rootScope.websocketAvailable指示连接何时可用。 $rootScope.queuedMessages指示何时有待发送的挂起消息。 这仍然是一个正在开发的项目的一部分,但我想你可以得到这个想法:

.service('$connection', ["$q", "$timeout", "websocketUrl", "$rootScope", function ($q, $timeout, websocketUrl, $rootScope) {
    var connection = function () {

        var me = {};
        var listeners = [];
        var oneListeners = [];

        me.isConnected = false;

        oneListeners.removeOne = function (listener) {
            var index = oneListeners.indexOf(listener);
            if(index!=-1)
                oneListeners.splice(index, 1);
        };

        var correlationId = 0;
        me.nextCorrelationId = function () {
            return correlationId++;
        };

        $rootScope.queuedMessages = [];

        me.listen = function (predicate, handler) {
            listeners.push({ p: predicate, h: handler });
        };

        me.listenOnce = function (predicate, timeout) {
            var deferred = $q.defer();
            deferred.done = false;
            var listener = { d: deferred, p: predicate };
            oneListeners.push(listener);
            if (timeout) {
                $timeout(function () {
                    if (!deferred.done)
                        deferred.reject('timeout');
                    oneListeners.removeOne(listener);
                }, timeout);
            }
            var promise = deferred.promise;
            promise.then(function (data) {
                deferred.done = true;
            });
            return promise;
        };

        var onopen = function () {
            console.log('onopen');
            $rootScope.websocketAvailable = true;
            me.isConnected = true;
            $rootScope.$$phase || $rootScope.$apply();
            if ($rootScope.queuedMessages) {
                for (var i = 0; i < $rootScope.queuedMessages.length; i++) {
                    ws.send(JSON.stringify($rootScope.queuedMessages[i]));
                }
                $rootScope.queuedMessages = null;
                $rootScope.$$phase || $rootScope.$apply();
            }
        };

        var onclose = function () {
            console.log('onclose');
            me.isConnected = false;
            $rootScope.websocketAvailable = false;
            $rootScope.$$phase || $rootScope.$apply();
            $rootScope.queuedMessages = $rootScope.queuedMessages || [];

            setTimeout(function () {
                ws = connect();
            }, 5000);
        };

        var onmessage = function (msg) {
            console.log('onmessage');
            var obj = JSON.parse(msg.data);
            for (var i = 0; i < listeners.length; i++) {
                var listener = listeners[i];
                if (listener.p(obj))
                    listener.h(obj);
            }
            var remove = [];
            for (var i = 0; i < oneListeners.length; i++) {
                var listener = oneListeners[i];
                if (listener.p(obj)) {
                    var o = obj;
                    listener.d.resolve(o);
                    remove.push(listener);
                }
            }
            for (var i = 0; i < remove.length; i++) {
                oneListeners.removeOne(remove[i]);
            }
        };

        var onerror = function () {
            console.log('onerror');
        };

        me.send = function (obj) {

            if ($rootScope.queuedMessages)
                $rootScope.queuedMessages.push(obj);
            else
                ws.send(JSON.stringify(obj));
        }

        var setHandlers = function (w) {
            w.onopen = onopen;
            w.onclose = onclose;
            w.onmessage = onmessage;
            w.onerror = onerror;
        };

        var connect = function () {
            console.log('connecting...');
            var w = new WebSocket(websocketUrl);
            setHandlers(w);
            return w;
        }

        var ws = connect();

        return me;
    };
    return connection();
}])

非常感谢。我用的是第二个版本,效果很好@如果答案有帮助,请接受。