Сохраняйте постоянное соединение с сервером при навигации по сайту - PullRequest
Новая
       17

Сохраняйте постоянное соединение с сервером при навигации по сайту

3 голосов
/ 16 ноября 2009

Мы - молодой стартап, запускающий уникальный чат-продукт на следующей неделе. В настоящее время наш чат основан на Jabber (с использованием Openfire в качестве нашего Jabber-сервера) через BOSH (с использованием Punjab), с jQuery для наших скриптов на стороне клиента.

В настоящее время наша самая важная проблема с текущей настройкой связана с навигацией по сайту, при переходе между страницами на наших веб-сайтах соединение BOSH теряется до тех пор, пока не будет загружена новая страница и соединение BOSH не аутентифицировано. Из-за этой проблемы мы должны установить очень большой тайм-аут (около 1 минуты) перед выходом из системы пользователей, которые покинули наш сайт без выхода из системы.

Нам известны навигационные решения на основе привязки javascript, но реализация этого потребовала бы много изменений в разметке нашего сайта, скриптах CSS и JS, а структура нашего сайта очень сложна.

Есть ли другое решение? Я думал о фреймовой навигации, когда страница будет содержать 2 фрейма - один скрыт и содержит BOSH-соединение, а другой содержит реальное содержимое страницы. проблема с этим решением заключается в том, что оно влияет на восприятие пользователя, и URL-адрес в строке адреса всегда будет оставаться URL-адресом страницы, содержащей фреймы.

есть ли решение нашей проблемы, которое не потребует полного переписывания структуры / разметки сайта?

Заранее спасибо!

Ответы [ 3 ]

1 голос
/ 17 ноября 2009

Используете ли вы реализацию своего чата на каждой странице? Если это так, ответ заключается в настройке кэширования для ваших сценариев. Убедитесь, что все большие JS-файлы являются внешними, и что сервер не регистрирует никаких изменений (например, последнее изменение). Объедините изображения в спрайты. Запустите ваш код через один из множества существующих минификаторов. И последнее, но не менее важное: инвестируйте в CDN. Amazon CloudFront прост и дешев: вы обнаружите, что он творит чудеса для повышения производительности.

1 голос
/ 17 ноября 2009

Хотя это может быть и не полное переписывание, я скажу, что это займет некоторое время. Оставьте там окно чата и укажите содержание, т.е. если, как на фейсбуке, в нижней части есть панель чата, разделите остальное в идентификаторе, по которому вы переходите. Другими словами, выньте чат из своего макета, выделите его отдельно и превратите ваши ссылки в запросы ajax, которые можно обрабатывать с помощью глобального обработчика ссылок, а ссылки, заменяемые поиском, заменяют все файлы с помощью sed. (href = "изменено на href =" javascript: urlhandler (но это нужно будет учитывать внешние ссылки) Другой вариант, о котором я могу подумать, это наличие на вашем сайте двух фреймов. Главное и чат. И предоставьте Session cookies для тех, кто перемещается со страницы, D / C или что бы с ними ни случилось.

0 голосов
/ 18 ноября 2009

Вы можете использовать плагин истории jquery (http://www.mikage.to/jquery/jquery_history.html)), чтобы обрабатывать навигацию назад и вперед и загружать страницы через ajax, как вы говорили.

Примерно так должно работать (не проверено):

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>

Если вы хотите передать мне эту работу, я был бы рад помочь. : О)

...