在Backbone.js的应用程序中使用的WebSockets没有Socket.io(Using w

我是新来的骨干，我试图建立一个主干应用程序，图表和地图数据的实时性。我实现了一个如下的WebSocket 这个示例代码。问题是，我想用一个更广泛的数据集比示例代码，如果我理解的代码，它只是创造一个模型 - 点的单一阵列。我想要的模型的集合，其中每个模型具有纬度，经度和数量（只是一个数值）。

如何实现的WebSocket这样，当我的后台发送一些JSON，我的应用程序创建一个具有这些属性的新模式？我读过关于这一点，我需要重写Backbone.sync和实现事件聚合博客，但唯一的例子，我已经看到了这个使用socket.io的。 Socket.io是不是因为语言/框架我使用的是后端的一个选项。此外，最终我会切换出后端还没有被socket.io支持另一种语言，所以我想找到实现对前端WebSocket的一个更一般的方式，不涉及就像一个图书馆socket.io。

Answer 1:

我已经找到了解决我自己的问题的作品。同样，我是新来的骨干，所以我不知道这是最好的办法 - 有兴趣的反馈这个解决方案是否遵循最佳实践。该代码是基于这个例子中由Andrew Cholakian。我一直当你运行该代码是有帮助的一些打印语句。

该代码假定后端以的形式发送JSON数据{data: "{"lat": latitude, "long": longitude, "amt": amount}"}

// this function opens the websocket and will trigger add_point when
// a new message is received
Stream = function () {
    _.extend(this, Backbone.Events);
    var self = this;

    self.socket = new WebSocket("ws://" + document.domain + ":5000/websocket");
    console.log("Using a standard websocket");

    self.socket.onopen = function(e) {
        self.trigger('open', e);
        console.log('socket opened');
    };

    self.socket.onerror = function(e) {
        self.trigger('error', e);
    };

    self.socket.onmessage = function(e) {
        self.trigger('message', e);
        self.trigger('data', e.data);
        self.trigger('add_point', JSON.parse(e.data));
    };

    self.socket.onclose = function(e) {
        self.trigger('close', e);
        console.log('socket closed');
    };
};  

DataPoint = Backbone.Model.extend({
    defaults: {
        lat: null,
        long: null,
        amt: null
        }
});

DataSet = Backbone.Collection.extend({
    model: DataPoint,
    initialize: function(options) {
        this.stream = options.stream;
        var self = this;
        this.stream.on("add_point", function(pt) {
            self.add( new DataPoint({
                lat: pt.lat,
                long: pt.long,
                amt: pt.amt
            }));
            console.log('updated collection');
            console.log(self.models);
        });
    }
});

MapView = Backbone.View.extend({
    initialize: function(options) {
        this.dataSet = options.dataSet;
    }
});

$(function() {
    var stream = new Stream();
    var dataSet = new DataSet({ stream: stream });
    var mapView = new MapView({ dataSet: dataSet });
});