私は socket.io を学習しようとしていますが、以前に構築したバックボーン アプリケーションに socket.io を追加することにしました。
したがって、require.js を使用すると、メインの app.js ファイルに次のものが含まれます。
require(
["jquery",
"underscore",
"backbone",
"bootstrap",
"view/postsview",
"model/model",
"collection/collection",
"socketio",
],
function($, _, B,boot, postsView, model, collection, io) {
$(function() {
window.socket = io.connect('http://127.0.0.1');
var postmodel = new model();
var postcollection = new collection();
window.socket.on('newPost', function (data) {
postcollection.create(data);
});
var posts = new postsView({model:postmodel, collection:postcollection});
posts.render();
$(".maincontainer").html(posts.el);
}
});
ご覧のとおり、私のソケットはグローバル変数です。backbone.view のこのソケットに何かを発行したいからです。私は JavaScript を初めて使用しますが、グローバル変数を使用することが常にベスト プラクティスであるとは限らないことを知っています。
私のバックボーン ビューは次のようになります。
var FormView = Backbone.View.extend({
template: _.template(formTemplate),
render: function(){
this.$el.html(this.template());
},
events:{
'click #submit-button' : 'save'
},
save: function(e){
e.preventDefault();
var newname = this.$('input[name=name-input]').val();
var newadress = this.$('input[name=adress-input]').val();
this.collection.create({
name: newname,
adress : newadress,
postedBy: window.userID
});
window.socket.emit('postEvent' , {
name: newname,
adress : newadress,
postedBy: window.userID
});
}
});
そして最後に、これは私の app.js がサーバー側でどのように見えるかです:
io.sockets.on('connection', function (socket) {
socket.emit('news', { hello: 'world' });
socket.on('my other event', function (data) {
console.log(data);
});
socket.on('postEvent', function (data) {
socket.broadcast.emit('newPost', data);
});
});
これは今のところ問題なく動作しますが、これがバックボーンで socket.io を使用する正しい方法であるかどうかはわかりません。まず、ソケット要素をグローバル変数として割り当てるのは好きではありません。ビュー内のソケットに到達する別の方法はありますか? 一般に、バックボーンで socket.io を使用する方法についての提案を受け付けています。