JavaScriptからStreaming APIを利用するためのライブラリです。
切断時の再接続処理や、各ブラウザ対応のクロスドメイン通信の面倒を見てくれます。
以下のファイルで構成されています。(mxhr.jsは必須ではありません)
切断時の再接続処理や、各ブラウザ対応のクロスドメイン通信の面倒を見てくれます。
以下のファイルで構成されています。(mxhr.jsは必須ではありません)
json.js
以下の関数を提供します。
json2.jsと同じものですが、トップレベルにJSONオブジェクトを生成しません。
- LDReader.JSON.parse
- LDReader.JSON.stringify
json2.jsと同じものですが、トップレベルにJSONオブジェクトを生成しません。
mxhr.js
以下のクラスを提供します。
- MXHR
streaming.js
いずれかの方法でクロスドメインでストリームを受信します。
- XMLHttpRequest Level2 + MXHR (Firefox3.5、Safari4、Google Chrome)
- IFRAME + MXHR + window.postMessage (Opera、Firefox3.5未満、Safari4未満、mxhr.jsがロードされていない場合)
- IFRAME + window.postMessage (IE8)
- IFRAME + window.name + reciever.html (IE5.5, IE6, IE7)
サンプル
流れてくるJSONデータを確認する
json_viewer.html
<html>
<head>
<script type="text/javascript" charset="UTF-8" src="http://reader.livedoor.com/js/mxhr.js"></script>
<script type="text/javascript" charset="UTF-8" src="http://reader.livedoor.com/js/json.js"></script>
<script type="text/javascript" charset="UTF-8" src="http://reader.livedoor.com/js/streaming.js"></script>
</head>
<body>
<textarea id="result" style="width:100%;height:500px"></textarea>
</body>
<script type="text/javascript">
var count = 0;
var reciever = location.href.replace("json_viewer.html", "reciever.html");
var stream = new LDReader.Streaming({
reciever: reciever
});
var stop_stream = stream.watch_item({q:"livedoor", since: 1}, function(json){
var result = document.getElementById("result");
result.value = count++ + " : " + LDReader.JSON.stringify(json);
});
</script>
</html>
reciever.html<script type="text/javascript">parent.parent.LDReader.Streaming.NameReciever(window.name)</script>
クロスドメイン参照について
- IE6,IE7に対応させるためには、呼び出し元のドメインにrecieverとなるHTMLファイルを設置する必要があります。
- サンプルは古いブラウザでは快適に動作しない場合があります。
リファレンス
インスタンスの生成
var stream = new LDReader.Streaming(option); option host: デフォルトはstream.reader.livedoor.comです。 reciever: 古いブラウザに対応するためのreciever.htmlのパスを指定します。呼び出し元と同一ドメインに置かれている必要があります。
- *.stream.reader.livedoor.comは全て同じレスポンスを返します。
- 同時接続数制限回避のために 1.stream.reader.livedoor.comなど、別ドメインを指定することが出来ます。
ストリームの受信
stream.watch_item(params, callback); stream.watch_feed(params, callback);
- paramsはqueryとして渡されるパラメータをハッシュで。
- callbackはJSONレスポンスを受け取る関数を指定します。
受信の停止
var cancel = stream.watch_item(params, callback); cancel();
- watch_*はそのストリームの受信を停止するためのfunctionオブジェクトを返します。
注意・制限事項
- 一つの接続ごとにインスタンスを生成してください。
- 一つのインスタンスで複数の接続はサポートされていません。
- 記事を次々と表示していくような使い方の場合、放っておくとブラウザが重くなったりメモリを大量に消費したりします。各自工夫してください。


最新コメント