Weitere ähnliche Inhalte
Ähnlich wie 第4回鹿児島node.jsの会資料_内村 (20)
Mehr von Koichi Uchimura (11)
第4回鹿児島node.jsの会資料_内村
- 16. app.jsの通信部分
次に通信部分です。
io.sockets.on('connection', function(socket) {
// 繋がったよ~
"on"は「受信したとき」の意味
console.log("connection");
// メッセージを受けたときの処理
socket.on('msg', function(data) {
クライアントが投げた「msg」データを
console.log(data);
受信したとき
// つながっているクライアント全員に送信
io.sockets.emit('msg', { value: data });
});
"emit"は「送信する」の意味。この場
// クライアントが切断したときの処理
合「自分も含めた全員に送信。
socket.on('disconnect', function(){
console.log("disconnect");
自分以外の全員に送るには
});
「socket.broadcast.emit(...)」
});
- 17. 次にクライアント側
var socket = io.connect('http://localhost:3000');
// こっちもつながったよ~
socket.on('connect', function(msg) {
ここには接続先のアドレスを記述。
console.log("connect");
});
// フォームを送信したときに
$('form').submit(function() {
//msgとして入力ボックス(ID:send)の値を送信
socket.emit('msg', $('#send').val());
こちらの"emit"も同様に送信の意味。
//入力ボックスの中身を空にする
msgとしてテキストボックス内の値を
$('#send').val('');
サーバに送信している。
return false;
});
- 18. クライアント側の受信部
socket.on('msg', function(data) {
// divの中に後付けする
サーバからmsgが返ってきたら、<div>
$('div').prepend(data.value + '<br>');
の中に値を挿入していく。
});
// 切断する
$('#disconn').click(function(){
socket.disconnect();
ここのdata.valueは、app.jsで記述した
io.sockets.emit('msg', { value: data });
に対応しています。