考えられる node.js/backbone.js/socket.io のスコープの問題で、頭を抱えることはできません。
(抜粋) server.js
var app = express();
var server = http.createServer(app);
io = io.listen(server);
(抜粋) index.html
<script type="text/javascript" src="/socket.io/socket.io.js"></script>
<script>
var socket = io.connect(window.location.origin);
</script>
(抜粋) js/views/map.js
(function() { // self invoking anonymous function so we are able to
// create the private variable "map" that can be shared here
var map;
var webSocket = window.socket;
window.MapView = Backbone.View.extend({
initialize: function() {
this.render();
webSocket.on("marker dropped", this.propNewMarker);
},
events: {
"click .dropmarker" : "dropMarker"
},
dropMarker: function(event) {
console.log("This fires!!!");
webSocket.emit('marker dropped', { my: 'data' });
},
propNewMarker: function() {
console.log("someone dropped a marker (im in map.js)");
},
(抜粋) MapView.html
<a href="#" class="btn btn-primary dropmarker">Drop marker</a>
私が目指している行動
MapView.html の「dropmarker」ボタンをクリックすると、dropMarker で webSocket.emit アクションが開始されます。(問題なくconsole.logを起動します)
テスト済み
追加すると
io.sockets.emit('marker dropped', { 'message': 'ello wurldz' });
server.js に挿入すると、map.js のpropNewMarker関数が正しく起動されます。
暫定的な結論
ボタンクリックのレベルでスコープの問題に苦しんでいるようです。そこで Websocket イベントを発生させることができません。
何かご意見は ?または、これをデバッグする前に、コードでより多くの洞察を提供する必要がありますか? (できるだけきれいに保つように努めました)