「node.jsでTwitter Streaming APIを利用する方法」の続きです。
Streaming APIを使ってサーバで受信したつぶやきをブラウザにプッシュするには、Socket.IOを使うのが簡単です。
準備
必要なパッケージをインストールします。
npm install socket.io express ntwitter
サーバ側
Streaming APIで取得したツイートの情報を、次のようなJavaScriptコード(server.jsとします)でクライアントにプッシュします。consumer_key
とconsumer_secret
、access_token_key
、access_token_secret
の部分は適切なもので埋めます。
var express = require('express') , app = express() , server = require('http').createServer(app) , io = require('socket.io').listen(server); //port: Heroku || AppFog || 3000 var port = process.env.PORT || process.env.VMC_APP_PORT || 3000; server.listen(port); app.use(express.static(__dirname + '/public')); var twitter = require('ntwitter'); var tw = new twitter({ consumer_key: '', consumer_secret: '', access_token_key: '', access_token_secret: '' }); tw.stream('statuses/sample', function(stream) { stream.on('data', function (data) { io.sockets.emit('message', { 'text': data.text }); }); });
つぶやきを受信すると、「io.sockets.emit()
」を呼び出し、つぶやきの本文を全クライアントにブロードキャストします(「io.sockets.volatile.emit()
」ではよくないようです)。この例では、「io.sockets.emit()
」の引数は単なる文字列でもいいのですが、他の情報もブロードキャストしたい場合を考慮して、上のようなオブジェクトにしています。
クライアント側
次のようなHTMLファイルpublic/index.html
を作ります。サーバからプッシュされたツイートの情報をページに追記しています(最大100個まで)。
<!DOCTYPE html> <head> <meta charset="UTF-8" /> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script> <script src="/socket.io/socket.io.js"></script> <title>statuses/sample</title> </head> <body> <script> $(document).ready(function() { var socket = io.connect(); socket.on('message', function(data) { $('<p>' + data.text + '</p>').prependTo('body'); $('p:eq(100)').remove(); }); }); </script> </body> </html>
実行
「node server.js
」として実行し、ウェブブラウザから「http://localhost:3000/
」にアクセスすると、大量のツイートが流れていく様子が見られるでしょう。