Question

我要为彗星编程开发一个框架，我不能使用Web套接字或服务器发送事件（因为浏览器支持真的很糟糕）。因此，我需要保持HTTP连接存活，并将分块数据发送回客户端。

然而，当你进入工作时，问题就出现了：

使用XMLHttpRequest是不可能的，因为当xhr.responseText为3时，IE不会为您提供xhr.readyState。
隐藏的iframe无效，因为浏览器会在我将数据发送回客户端时显示加载程序。
我尝试将JavaScript文件发送回客户端，每次都发送函数执行命令，但浏览器在完全加载之前不会执行JavaScript。

但是，当我查看Lightstreamer demo page时，我看到它将一个JavaScript文件一点一点地发送回客户端，并且在每一步中，它都会向该函数发送一个调用，该函数只会被执行（I不能做这部分）。似乎Lightstreamer使用AJAX，因为请求只是出现在Firebug的控制台选项卡中，但它也像IE中的魅力一样。

我尝试使用他们在请求中设置的每个HTTP头字段，但没有结果。我也尝试使用HTTP Post而不是HTTP Get，但仍然没有结果。

我已经阅读了近20篇关于如何实施彗星的文章，但是没有一篇文章可以解决我遇到的问题：

如何让它跨浏览器？
如何在从服务器到达新数据时收到通知（我应该挂钩哪个事件）？
如何让我的页面显示为完全加载到用户（如何实现它，以便浏览器不显示加载活动）？

有人可以帮忙吗？我认为应该有一个非常小的提示或技巧，我不知道在这里将所有概念粘合在一起。有谁知道lightstreamer会做些什么来克服这些问题？

Answer 1

SockJS作者在这里。

如何让它跨浏览器？

这很难，预计会花几个月时间在Opera和IE上获取流媒体传输。

如何在从服务器到达新数据时收到通知（我应该挂钩哪个事件）？

根据特定的浏览器，有各种技术。有关一个好的介绍，请查看Socket.IO和SockJS支持的不同后备协议。

如何让我的页面显示为完全加载到用户（如何实现它，以便浏览器不显示加载活动）？

同样，还有特定于浏览器的技巧。一种是在onload事件后延迟加载AJAX。另一种是从DOM绑定和取消绑定iframe。等等。如果你仍然感兴趣，请阅读SockJS或Socket.io代码。

有人可以帮忙吗？我认为应该有一个非常小的提示或技巧，我不知道在这里将所有概念粘合在一起。有谁知道lightstreamer会做些什么来克服这些问题？

基本上，除非你有充分的理由，否则不要重新发明轮子。使用SockJS，Socket.io，faye或其他几十个已解决此问题的项目。

Answer 2

您想要的方法是streaming。

如何让它跨浏览器？

考虑到大多数浏览器，没有一致的方法。您必须根据浏览器选择正确的传输方式。更糟糕的是，您必须依靠浏览器嗅探来识别正在使用的浏览器，并且功能检测对此没有任何意义。您可以对IE8 +使用XDomainRequest，对于非IE使用XMLHttpRequest，对IE 6+使用Iframe。如果可能的话，避免使用iframe。

如何在从服务器到达新数据时收到通知（我应该挂钩哪个事件）？

根据使用的运输方式而有所不同。例如，XDomainRequest触发progress事件，当除了Opera和IE之外，当块到达时，XMLHttpRequest触发readystatechange事件。

如何让我的页面显示为完全加载到用户（如何实现它，以便浏览器不显示加载活动）？

我不知道iframe的这个问题，但仍然会出现在基于WebKit的浏览器中，例如Chrome和带有XMLHttpRequest的Safari。避免这种情况的唯一方法是在窗口的onload事件之后连接，但是在Safari的情况下，这不起作用。

除上述问题外，还有一些问题需要考虑。

事件驱动的服务器 - 服务器应该能够异步处理。
传输要求 - 服务器对所需传输的行为有所不同。
流格式 - 如果服务器要在单个块中发送大消息或多个消息，则单个块不代表单个数据。它可以是单个数据的片段，也可以是多个数据的串联。要识别什么是数据，应格式化响应。
错误处理 - Iframe传输不提供任何断开连接的证据。
...

最后但并非最不重要，实施流式传输非常令人厌烦，而不像长轮询那样。我建议您使用可靠的框架来执行此操作，例如我创建和管理的socketio，sockjs和jquery socket。

Answer 3

但是浏览器在完全加载之前不会执行JavaScript。

您是否尝试过发回<script>个标签中包含的代码？例如，而不是：

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

试

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

Answer 4

您的最佳选择是在服务器端使用JSONP + Long Pulling。您只需记住在任何时候连接丢失（超时）或您收到响应时重新连接。

jquery中的示例代码：

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

显然，您对服务器的响应必须是javascript代码，它将调用您的全局函数。

或者你可以使用一些jquery JSONP插件。

或者看看这个项目http://www.meteor.com/（真的很酷，但没试过）

Lightstreamer背后的魔力是什么？

4 个答案: