Skip to content

Instantly share code, notes, and snippets.

@tokunami
Last active May 8, 2019 08:40
  • Star 6 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save tokunami/b8d3f67aa9ec0a86716a to your computer and use it in GitHub Desktop.

socket.io のやりとりの仕組み

socket.emit(eventname, data) イベントの発火(=データの送信)
socket.on(eventname, data) イベントの検知(=データの受信)
  • eventnameはクライアントサイド、サーバーサイドで一緒であれば任意の文字列を指定可能
  • broadcast は socket.broadcast.emit とすることで実行できる
サーバーサイド
var io = require('socket.io').listen(app);

io.sockets.on('connection', function (socket) { // 2
  log('connected');
  socket.on('msg send', function (msg) { // 4
    io.sockets.emit('msg push', msg); // 5
  });
  socket.on('disconnect', function() { // 7
    log('disconnected');
  });
});
クライアントサイド
var socket = io.connect('http://localhost'); // 1

socket.on('connect', function() { // 2
  log('connected');
  socket.emit('msg send', 'data'); // 3
  socket.on('msg push', function (msg) { // 6
  });
});
  1. クライアントが 'http://localhost' にソケット接続を要求
  2. サーバがクライアントとの接続を確立すると、サーバで 'connection' 、クライアントで 'connect' イベントが発生
  3. クライアントが 'msg send' イベントを発火して文字列 'data' を送信
  4. サーバで 'msg send' イベントが発生し、コールバックが実行される
  5. サーバが 'msg push' イベントを発火して受信したメッセージを送ってきた本人とそれ以外のクライアントに送信
  6. クライアントで 'msg push' イベントが発生し、コールバックが実行される
  7. クライアントが切断したら、サーバ側で 'disconnect' イベントが発生
  • 5 の io.sockets.emit(eventname, data) は、socket.emit(eventname, data) (メッセージを送ってきた本人に送り返す)と socket.broadcast.emit(eventname, data) (メッセージを送ってきた本人以外にブロードキャスト)の両方を実行している。
@stoshiya
Copy link

stoshiya commented May 2, 2014

eventnameには予約語がありますので,調べてみましょう.

クライアントサイドとサーバサイドで同じイベント名を使うので,pushやsendといった送受信を表現する言葉は混乱を招きます.送受信するするデータの名称をつかうほうが理解しやすいと思います.

シンタックスハイライトするとソースコードが少し見やすくなります

var socket = io.connect('http://localhost'); // 1

socket.on('connect', function() { // 2
  log('connected');
  socket.emit('msg send', 'data'); // 3
  socket.on('msg push', function (msg) { // 6
  });
});

@tokunami
Copy link
Author

tokunami commented May 7, 2014

予約語

調べてみました。
変数名や関数名として定義できない単語

  • break
  • case
  • catch
  • continue
  • debugger
  • default
  • delete
  • do
  • else
  • false
  • finally
  • for
  • function
  • if
  • in
  • instanceof
  • new
  • null
  • return
  • switch
  • this
  • throw
  • true
  • try
  • typeof
  • var
  • void
  • while
  • with

@stoshiya
Copy link

stoshiya commented May 7, 2014

これはJavaScriptの予約語ですね.https://developer.mozilla.org/ja/docs/Web/JavaScript/Reference/Reserved_Words

socket.ioのイベント名の予約語とは別なので,もう一度調べてみましょう.

@tokunami
Copy link
Author

tokunami commented May 8, 2014

reserved event name (socket.io)

見つけました!

  • message
  • connect
  • disconnect
  • open
  • close
  • error
  • retry
  • reconnect

@stoshiya
Copy link

stoshiya commented May 8, 2014

だいたいokです.サーバは3つで,クライアントには9つくらいあります.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment