環境
- vagrant centOS6
- nodejs v0.12.8
- socket.IO v1.3.7
- express v4.13.3
- nodemon v1.8.1
nodejsでsocket.IOを使っているのですが、socket.IO公式のチュートリアルに書いてあるサンプルをjavascriptだけで書き直したいと思ったのですが、うまくいかないので教えてください。
app.js
1// app.js 2// javascript特にフロント側の質問の為、変更以外割愛 3// クライアントからformデータ受け取り 4socket.on('chat message', function(msg){ 5 console.log(msg); 6 io.emit('chat message', msg); 7});
index
1// HTML 2<ul id="messages"></ul> 3<form id="sendFrm" action=""> 4<input id="sendInp" type="text" autocomplete="off" /><button id="sendBtn">Send</button> 5</form>
script
1// script 2document.addEventListener('DOMContentLoaded', function (event) { 3 var addElem = document.querySelector('#messages'); 4 var sendFrm = document.querySelector('#sendFrm'); 5 var sendBtn = document.querySelector('#sendBtn'); 6 var sendInp = document.getElementById('sendInp'); 7 sendBtn.addEventListener('click', sendMessage, false) 8}); 9var socket = io(); 10function sendMessage(){ 11 socket.emit('chat message', sendInp.value); 12 sendInp.value = ""; 13 return false; 14}); 15socket.on('chat message', function(msg){ 16 var ele = document.createElement('li'); 17 var str = document.createTextNode(msg); 18 ele.appendChild(str); 19 addElem.appendChild(ele); 20});
実行結果ですが、
addEventListenerしているfunctionの中でsocket.emitしていますが、ターミナルではサーバがクライアントから受け取ったメッセージをconsole表示しています。
にもかかわらず、クライアント側でappendChildしてくれません。
サーバ側とクライアント側でイベント名も間違っていないのに、クライアントがサーバから受け取ったメッセージを表示してくれません。
正しいコードを教えて下さい。よろしくお願いたします。
回答1件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。