angular-websocket 该如何使用?

  • 使用tornado(4,3,0,0)作为后台。

...
import tornado.web
import tornado.websocket
import tornado.ioloop
import logging
import tornado.escape
import hashlib
...
class Websocket_countHandler(tornado.websocket.WebSocketHandler):
    #防止403服务器错误,解决跨域问题
    def check_origin(self, origin):
        return True
    #waiters对象用来标识共有多少位用户登录
    waiters=set()
    #登陆事件
    def open(self):
        Websocket_countHandler.waiters.add(self)
        print '登陆'
    #登出事件
    def on_close(self):
        Websocket_countHandler.waiters.remove(self)
        print '登出'
    #发送事件
    def on_message(self, message):
        logging.info("got message %r",message)
        Websocket_countHandler.send_updates(message)
        # parsed=tornado.escape.json_decode(message)
        # self.username=parsed["username"]
        # chat={
        #     "id":str(uuid.uuid4()),
        #     "body":parsed["body"],
        #     "type":"message",
        # }
        # Websocket_countHandler.send_updates(chat)
    @classmethod
    def send_updates(cls,chat):
        logging.info("sending message to %d waiters",len(cls.waiters))
        for waiter in cls.waiters:
            try:
                waiter.write_message(chat)
            except:
                logging.error("Error sending message",exc_info=True)
def make_app():
    return tornado.web.Application(
        handlers=[
            (r"/", MainHandler),
            (r"/test/(.*)", TestHandler),
             # (r"/websocket_count/(.*)/(.*)",Websocket_countHandler),
            (r"/websocket_count", Websocket_countHandler),

        ],
        # template_path=os.path.join(os.path.dirname(__file__), "templates"),
        static_path=os.path.join(os.path.dirname(__file__), "static"),
    )


def main():
    app = make_app()
    app.listen(8080, address="0.0.0.0")
    print '服务器正在运行,端口8080'
    tornado.ioloop.IOLoop.current().start()


if __name__ == '__main__':
    main()

通过websocket在线调试工具blue-zero websocket在线调试工作正常,发送任意字符则所有客户端都能收到

问题来了

利用angular-websocket 官网地址

var myApp = angular.module("myApp", ['ui.router', 'ngResource', 'datatables', 'datatables.bootstrap', 'angular-md5', 'ngStorage', 'angularUtils.directives.dirPagination','ngWebSocket']);

myApp.factory('MyData',function ($websocket) {
   var dataStream=$websocket('ws://127.0.0.1:8080/websocket_count');
   var collection=[];
   dataStream.onMessage(function (message) {
       collection.push(JSON.parse(message.data));
   });
   var methods={
       collection:collection,
       get:function () {
           dataStream.send(JSON.stringify({action:'get'}));
       }

   };
   return methods;

//websocket控制器
myApp.controller('websocket_controller',function ($scope,$rootScope,$sessionStorage,MyData) {
   $scope.MyData=MyData;
});
});

我该如何在前端连接?如何写open close on_message 等方法?

阅读 5k
1 个回答

$websocket(url)这就代表连接上了,之后对于onOpen onClose onMessage 等方法都写到factory中,send和close通过返回的ws实例进行调用就好了。

注意它还有 onOpenCallbacks onMessageCallbacks 等等几个回调方法,对于处理消息的逻辑可以写到这些回调方法中。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进