3

将 HTML5 Websockets 集成到 Ember.js 应用程序中的最佳方式通常是什么?

我过去使用过 Pusher.com,并使用了与此类似的设置:http: //blog.pusher.com/backbone-js-now-realtime-with-pusher/

我正在寻找与 Ember.js 等效的东西

多谢你们!

4

2 回答 2

3

我已经使用套接字设置了一个应用程序。我这样做的方式是我的主 App 文件有一个套接字对象,然后从 socket.io 接收消息并将它们放入一个数组中。任何可能对侦听某些套接字消息感兴趣的控制器都绑定到数组并获取传入的新消息。例如,我的 chatController 关心聊天消息,而我的 eventController 关心基于触发的套接字事件显示或隐藏图像。

下面是一些关于我如何设置的咖啡脚本代码。

window.App = Ember.Application.create

  init: ->
    @_super()
    @setSocketIO()

  ##
  # socket - socket.io object for communicating with the server
  socket: null

  ##
  # socketMessages - array used to store any socket.io messages emitted from the server 
  socketMessages: []

  ##
  # setSocketIO - setup socket.io connection and message endpoints
  setSocketIO: ->
    @set 'socket', io.connect()

    ##
    # if the socket errors out, then reconnect it
    App.socket.on "error", (err) ->
      App.socket.socket.reconnect()

    ##
    # receive new messages
    App.socket.on "event-message-receive", (data) =>
      @createSocketMessage 'event-message-receive', data

    ##
    # image url recieved
    App.socket.on "event-image-set-receive", (data) =>
      @createSocketMessage 'event-image-set-receive', data

    ##
    # hide image recieved
    App.socket.on "event-image-hide-receive", () =>
      @createSocketMessage 'event-image-hide-receive'

然后在我的聊天控制器中,我只收听收到的新消息

App.ChatController = Ember.ArrayController.extend

    ##
    # chat messages
    chatMessages: []

    ##
    # socketMessageBinding - bind to the App.socketMessage message queue for receiving new    messages from the server
    socketMessagesBinding: 'App.socketMessages'

    ##
    # socketMessageAdded - called whenever a socket.io message is sent from teh server
    socketMessageAdded: (->
      # get the newest item on the stack
      socketMessage = @socketMessages[@socketMessages.length-1] 

      if socketMessage.type == 'event-message-receive'
        @chatMessages.pushObject socketMessage.data                    
  ).observes('socketMessages.@each')

在我的事件控制器中,我监听图像显示和图像隐藏

App.EventController = Ember.ArrayController.extend

  ##
  # property to show or hide an img on the page
  showImage: false

  ##
  # socketMessageBinding - bind to the App.socketMessage message queue for receiving new    messages from the server
  socketMessagesBinding: 'App.socketMessages'

  ##
  # socketMessageAdded - called whenever a socket.io message is sent from teh server
  socketMessageAdded: (->
    # get the newest item on the stack
    socketMessage = @socketMessages[@socketMessages.length-1] 

     if socketMessage.type == 'event-image-set-receive'     
       @set 'showImage', true
     else if socketMessage.type == 'event-image-hide-receive'
       @set 'showImage', false                   
  ).observes('socketMessages.@each')
于 2013-04-17T00:36:26.700 回答
0

你可以在 GitHub 上查看8 个月前的以下内容,但目前还没有WebSocketsAdapter,尽管我很想看到一个。在大多数情况下,人们似乎在WebSocketAdapter为自己的场景制作 ad-hoc。

我想一旦 EmberJS 发布 1.0 版,你就会开始看到更多的第三方插件。由于 EmberJS,特别是 EmberJS 的 DS (DataStore) 变化如此之快,WebSocketAdapter除非您完全致力于使其保持最新,因为 EmberJS/DS 从一天到下一个。

于 2013-01-30T17:06:41.323 回答