在浏览网站时保持与服务器的永久连接

We are a young start-up launching a unique chat product next week. Our chat is currently based on Jabber (using Openfire as our Jabber server) via BOSH (using Punjab), with jQuery for our client side scripts.

我们是一个年轻的初创公司,下周将推出一款独特的聊天产品。我们的聊天目前基于Jabber(使用Openfire作为我们的Jabber服务器)通过BOSH(使用Punjab),jQuery用于我们的客户端脚本。

Right now our most critical issue with the current setup is with the site navigation, when navigating between pages in our web-sites the BOSH connection is lost until the new page is loaded and the BOSH connection is authenticated. Due to this issue we have to set a very big timeout (around 1 minute) before logging out users who have left our website without signing out.

现在我们当前设置的最关键问题是网站导航,当我们网站中的页面之间导航时,BOSH连接将丢失,直到加载新页面并验证BOSH连接。由于这个问题,我们必须设置一个非常大的超时(大约1分钟),然后退出离开我们网站但没有注销的用户。

We are aware of javascript anchor based navigation solutions, but implementing this would require many changes in our site's markup, CSS and JS scripts and our site's structure is very complicated.

我们知道基于javascript锚点的导航解决方案,但实现这一点需要对我们网站的标记,CSS和JS脚本进行许多更改,并且我们网站的结构非常复杂。

Is there any other solution? I was thinking about frame based navigation, when a page will hold 2 iframes - one is hidden and holds the BOSH connection, and one holds the real page content. the problem with this solution is that it affects the users' feel and the URL in the location bar will always stay the URL of the page that holds the frames.

还有其他解决方案吗?我正在考虑基于帧的导航,当一个页面将容纳2个iframe时 - 一个隐藏并保持BOSH连接,一个保存真实的页面内容。此解决方案的问题在于它会影响用户的感觉,并且位置栏中的URL将始终保留包含框架的页面的URL。

is there any solution for our problem that will not require a complete rewrite of the site's structure/markup?

我们的问题是否有任何解决方案,不需要完全重写网站的结构/标记?

Thanks in advance!

提前致谢!

3 个解决方案

#1

Though this might not be a complete rewrite I'll say it will take some doing. Have the Chat box stay there and ajax in content, i.e. if, like on facebook the bottom has the chat bar, section the rest in an id you ajax you pages into. In other words, take the chat out of your layout, put it separate, and make your links into ajax requests which can be handled via a global link handler and links substituted via a search a replace over all files via sed. (href=" changed to href="javascript:urlhandler( but this will need to account for external links) The other option I can think of is having two iframes on your site. Main and chat. And provide Session cookies for those who navigate from the page, D/C or whatever will happen to them.

虽然这可能不是一个完整的重写,但我会说它需要做一些事情。让聊天框保留在那里并在内容中使用ajax,即,如果像Facebook上的底部有聊天栏那样,请将其余部分放入您自己登录的内容中。换句话说,从你的布局中取出聊天,把它分开,然后链接到ajax请求,这些请求可以通过全局链接处理程序处理,链接通过搜索替换,通过sed替换所有文件。 (href =“更改为href =”javascript:urlhandler(但这需要考虑外部链接)我能想到的另一个选择是在您的网站上有两个iframe。主要和聊天。并为导航的人提供会话cookie从页面,D / C或其他任何事情发生。

#2

Are you using an implementation of your chat on each page? If so, the answer is to tweak caching for your scripts. Make sure all large JS files are external and that the server registers no changes (e.g.: Last Modified). Combine images into sprites. Run your code through one of the many minifiers that exist. Last but not least, invest in a CDN. Amazon CloudFront is simple and cheap: you'll find that it works wonders for improving performance.

您是否在每个页面上使用聊天实现?如果是这样,答案是调整脚本的缓存。确保所有大型JS文件都是外部的,并且服务器不会注册任何更改(例如:Last Modified)。将图像组合成精灵。通过存在的众多缩小器之一运行代码。最后但并非最不重要的是,投资CDN。 Amazon CloudFront简单而便宜:您会发现它可以提高性能。

#3

You can use jquery's history plugin (http://www.mikage.to/jquery/jquery_history.html) to handle back and forward navigation and load pages via ajax like you were talking about.

您可以使用jquery的历史插件(http://www.mikage.to/jquery/jquery_history.html)来处理后退和前进导航,并通过ajax加载页面,就像您正在谈论的那样。

Something like this should work (untested):

这样的东西应该工作(未经测试):

Page1.htm:

<html>
<head><title>Page 1</title></head>
<body>
     <div id="content">
         <a href="/page2.htm">Load Page 2</a>
     </div>
    <div id="chat"></div>
</body>
<script>
    $(function(){
        function loadPage(hash){
            if($.browser.msie) {
         hash = encodeURIComponent(hash);
        }
            $.ajax({
                "url":hash,
                "success":function(response){
                     var newPage = $(response);
                     document.title=newPage.find("title").html();
                     $("#content").html(newPage.find("#content").html());
                 }
            });
            return false;
        }
        $.historyInit(loadPage);
        $("a").live("click",function(){
            $.historyload(this.href);
        });
    });
</script>
</html>

Page2.htm:

<html>
<head><title>Page 2</title></head>
<body>
     <div id="content">
         <a href="/page1.htm">Load Page 1</a>
     </div>
    <div id="chat"></div>
</body>
<script>
    $(function(){
        function loadPage(hash){
            if($.browser.msie) {
         hash = encodeURIComponent(hash);
        }
            $.ajax({
                "url":hash,
                "success":function(response){
                     // this is just an example and not too efficient.
                     var newPage = $(response);
                     document.title=newPage.find("title").html();
                     $("#content").html(newPage.find("#content").html());
                 }
            });
            return false;
        }
        $.historyInit(loadPage);
        $("a").live("click",function(){
            $.historyload(this.href);
        });
    });
</script>
</html>

If you would like to outsource the work to me I'd be glad to help. :o)

如果您想将工作外包给我,我很乐意提供帮助。 :O)

#1

#2

#3