Lightstreamerの背後にある魔法は何ですか？

Question

私は彗星プログラミングのフレームワークを開発しようとしており、Web SocketsやServer-Sent Eventsを使用することはできません（ブラウザのサポートが本当に嫌なので）。だから、私はHTTP接続を生かしておき、チャンクされたデータをクライアントに送り返す必要があります。あなたが仕事に入るしかし

は、問題は自分自身を示しています。

1. のXMLHttpRequestを使用することによりxhr.readyStateは3
2. Aである一方、IEはあなたxhr.responseTextを与えないという事実のために、可能ではありませんiframeは、クライアントにデータを送り返しているときにブラウザにローダーが表示されるため、便利ではありません。
3. クライアントにJavaScriptファイルを送り返して、毎回機能実行コマンドを送信しようとしましたが、ブラウザが完全に読み込まれるまでJavaScriptを実行しません。

実行しかし、私はLightstreamer demo pageを見たとき、私はそれにはJavaScriptが戻って少しして、各ステップにおけるしづつクライアントにファイルを送信していることがわかり、それは関数の呼び出しを送信し、その機能は単純になります（私ができますこの部分をしないでください）。 LightstreamerはFirebugのコンソールタブにリクエストが表示されるだけなので、AJAXを使用しているようですが、IEの魅力のように機能します。

リクエストで設定したすべてのHTTPヘッダーフィールドを使用しようとしましたが、結果はありません。私はまた、HTTP Getの代わりにHTTP Postを使用しようとしましたが、結果はまだありません。

私は彗星の実装方法のほとんどを超える20件の記事を読んで、どれもof'em私が持っている問題を解決するために表示されました：

1. それクロスブラウザにする方法は？
2. サーバーから新しいデータが到着したときに通知を受け取る方法（どのイベントを使用する必要がありますか）
3. 私のページが完全にユーザーに表示されるようにするにはどうすればいいですか（ブラウザの読み込みアクティビティは表示されません）

誰でもお手伝いできますか？私は、すべての概念を結びつけるためにここでは分かっていないヒントやトリックはほとんどないはずだと思います。これらの問題を克服するためにライトトリマが何をするのか誰にでも分かりますか？

Answer 1

ブラウザはJavaScriptが完全にロードされるまでJavaScriptを実行しません。

<script>タグでラップされたコードを送り返しましたか？たとえば、代わりの：

<script type="text/javascript"> 
f(...data1...); 
f(...data2...); 

あなたのケースでは最良のオプションは、サーバー側で引っ張るJSONP +ロングを使用することです

<script type="text/javascript">f(...data1...);</script> 
<script type="text/javascript">f(...data2...);</script> 

Answer 2

を試してみてください。接続の切断（タイムアウト）が発生した場合はいつでも再接続するか、応答を受け取ることを忘れないでください。 jqueryの中

例コード：

function myJSONP(){ 
    $.getScript(url, { 
     success: function(){ 
      myJSONP(); //re-connect 
     }, 
     failure: function(){ 
      myJSONP(); //re-connect 
     } 
    }) 
} 

はもちろん、サーバからのご回答は、あなたのグローバル関数の上で呼び出すJavaScriptコードにする必要があります。

また、jquery JSONPプラグインを使用することもできます。

それとも、このプロジェクトhttp://www.meteor.com/の表情取る（本当にクールなのが、それをしようとしなかった）

Answer 3

あなたが望む方法がstreamingです。

それはクロスブラウザにするには？

ほとんどのブラウザを考慮すると、一貫した方法はありません。あなたは、ブラウザに応じて適切な輸送手段を選択する必要があります。さらに悪いことに、ブラウザが使用されているかどうかを認識するためにブラウザを傍受しなければならず、機能の検出では何も得られません。 IE8 +ではXDomainRequest、IE以外の場合はXMLHttpRequest、IE 6+の場合はIframeを使用できます。可能であればiframeの転送を避けてください。

サーバーから新しいデータが到着したときに通知を受け取る方法（どのようなイベントを入力する必要がありますか）

これは、使用されるトランスポートに応じて変化します。たとえば、XDomainRequestはprogressイベントを発生させ、XMLHttpRequestは、OperaとIE以外のチャンクが到着したときにreadystatechangeイベントを発生させます。

私のページを完全にユーザーに表示されるようにするにはどうすればいいですか（ブラウザでの読み込みアクティビティが表示されないようにする方法）

私はこの問題をiframeで知りませんが、ChromeやSafariやXMLHttpRequestなどのWebKitベースのブラウザでも引き続き発生します。これを避ける唯一の方法は、ウィンドウのonloadイベントの後に接続することですが、Safariの場合はこれが機能しません。

上記の質問以外にもいくつかの点を考慮する必要があります。

1. イベント駆動型サーバー - サーバーは非同期に処理できる必要があります。
2. 転送要件 - サーバーは、必要な転送のために動作が異なります。
3. ストリーム形式 - サーバーが単一のチャンクに大きなメッセージまたは複数のメッセージを送信するために起こっている場合は、単一のチャンクは、単一のデータを意味するものではありません。それは、単一のデータのフラグメントまたは複数のデータの連結である可能性があります。データが何であるかを認識するためには、応答をフォーマットする必要があります。
4. エラー処理 - iframeトランスポートは切断の兆候を提供しません。ストリーミングを実現するために、少なくとも最後にではなく、
5. ...

は、それが長いポーリングとは異なり見た目よりかなり面倒です。私はあなたがそのようなsocketio、sockjsとjquery socketとして、私が作成して管理していることを行うための固体フレームワークを使用することを推奨します。

幸運。

Answer 4

SockJS著者はこちら。

• クロスブラウザの作成方法は？

これは、オペラやIE上でのストリーミングトランスポートを得ることに数ヶ月を過ごすことを期待して、難しいです。新しいデータがサーバーから到着されたときに通知を受ける方法

• （私は何にイベントをフックする必要がありますか）？

特定のブラウザによってはさまざまな方法があります。良いイントロについては、Socket.IOとSockJSでサポートされている異なるフォールバックプロトコルを見てください。私のページを作成する方法

• （そのブラウザが搭載活性を示さないので、それを実装する方法）ユーザへのロードされたとして、完全に表示されますか？

また、ブラウザ固有の欺瞞があります。 1つは、onloadイベント後にAJAXのロードを遅延させることです。他の方法は、DOMからiframeをバインドおよびアンバインドすることです。等。興味があると感じたら、SockJSまたはSocket.ioコードを読んでください。

誰でも助けてください。私は、すべての概念を結びつけるためにここでは分かっていないヒントやトリックはほとんどないはずだと思います。これらの問題を克服するためにライトトリマが何をするのか誰にでも分かりますか？

基本的には、非常に強い理由がない限り、ホイールを改造しないでください。 SockJS、Socket.io、faye、またはこの問題を既に解決している数十のプロジェクトを使用してください。