javascript - AngularJS 和 Autobahn.js WAMP 实现

Question

创建使用 Autobahn.js 0.8.1 实现 WAMP v1(WebSocket 应用程序消息传递协议(protocol))的 AngularJS 服务的最佳方法是什么？理想情况下，我希望即使路由发生变化也可以访问 websocket，而无需重新初始化连接。

这是一个内部应用程序，无法与互联网通信，因此 PubNub 不是一个选项。如果可能的话，避免重写高速公路也会很有帮助。

似乎没有可用的 AngularJS WAMP 库，但这将是一个受欢迎的替代方案。

该问题涉及到 Websocket 的初始连接大约需要 150 毫秒。如果我编写一个连接到 websocket 的服务，那么当我在 Controller 中调用 pubsub 套接字时，我必须使用超时函数，这样我就不会在套接字连接之前进行调用。

当前实现:

services.factory('socket', ['$rootScope',
  function($rootScope) {
    var pubsub = new ab.Session(
      'ws://1.1.1.1:8080',
      function(session) {
        console.log('New Session Established');
        return session;
      },
      function(code, reason) {
        console.log('Websocket connection closed. Code: '+code+'; reason: '+reason);
      }
    );
    return {
      pubsub: pubsub
    };
  }]);

controllers.controller('PageCtrl', ['$scope', 'socket', '$timeout',
  function($scope, socket, $timeout) {
    $timeout(function() {
      $scope.data = socket.pubsub.call('somecall', []).then(
        function(res) {
        }
      );
    }, 300);
  }]);

由于 Controller 需要等待服务，这似乎是$q.defer的一个很好的用途。当我尝试实现以下内容时，尽管更改了 ab._Deferred 方法，但它并没有推迟:

services.factory('socket',['$rootScope', '$q',
  function($rootScope, $q) {
    // Change AutoBahn to use Angular Deferred:
    ab._Deferred = $q.defer;

    var service = {};
    service.address = 'ws://box:8080';
    service.name = 'socket';
    service.defer = $q.defer();

    service.connection = new ab.connect(
      // Address:
      service.address,
      // WAMP successful:
      function(session) {
        service.defer.promise.then(function() {
          service.session = session;
          console.log('connected!');
          return service;
        });
        // @todo: make another request now that we're connected
      },
      // WAMP unsuccessful:
      function(code, reason, detail) {
        // @todo: reject $q/defer here?
        //service.defer.reject(error);
      }
    );

    service.getDefer = function() {
      return service.defer;
    };

    service.subscribe = function(name, callback) {
      service.defer.promise.then(function() {
        service.session.subscribe(name, callback);
      });
      service.defer.resolve();
    };

    service.remoteCall = function(remote, msg) {
      service.session.call(remote, msg);
    };
    return service;

  }]);


controllers.controller('AppCtrl', ['$q', '$scope', 'socket') {
  var myDef = $q.defer();
  myDef.promise.then(function() {
    var ws = socket;
    var defer = ws.getDefer();
    defer.resolve();
    console.log('1');
    return ws;
  }).
  then(function(ws) {
    console.log('2');
    ws.remoteCall('somecall', function(res) {
      console.log('Call Successful: ' + res);
    });
    return ws;
  });
  $scope.ws = myDef.resolve();
  ws.remoteCall('anothercall', function(data) {
    console.log(data);
  });
}

我是否仍需要包含 when.js，如本问题所示？ Getting dependencies to load correctly in requirejs (autobahn and whenjs)

有一个非常相似的问题，但没有解决方案: https://stackoverflow.com/questions/17798504/angularjs-and-websocket-application-messaging-protocol

Answer 1

有AngularWAMP我已经尝试过了，效果非常好。请注意，这是针对 AngularJS(不是 Angular2)的。关于无法连接到互联网的问题:您所做的就是在本地局域网上设置一个路由器(使用 Crossbar )，并且您的整个企业都可以访问(而不是互联网)。您的所有客户端/服务器都将连接到您的本地路由器。