Уменьшите размер запроса AJAX. Простой чат с системой опроса

^{_{УВЕДОМЛЕНИЕ: Я заменил свою систему опроса на websockets, но Я все еще хочу знать ответ на мои вопросы выше.}}

Я пытаюсь уменьшить запрос AJAX системы сообщений с традиционным опросом, но я не знаю, как ее получить:

$chatbox = $("#chatbox");

setInterval(function(){
    // I send the sha1 of the chatbox html content to verify changes.
    $.post("post.php", {checksum: hex_sha1($chatbox.html())}, function (data, status) {

        switch (status) {
            case "success": 
                // If version of "post.php" checksum is different than mine (there are changes) data isn't empty; I assign data as the new content of the chatbox.
                if(data){ 
                    $chatbox.html(data);      
                    $chatbox.scrollTop($chatbox[0].scrollHeight); 
                } 
            break;

            default: 
                $chatbox.html('Connection error...'); 
            break;                       
        }                       
    });
}, 1000);

Ну, как вы видите, я использую setInterval() с 1000 miliseconds в качестве параметра, и благодаря системе контрольной суммы SHA1 я могу уменьшить размер всего ответа AJAX до 343 B (кроме случаев, когда post.php ", очевидно, возвращает новое сообщение)

Вопросы:

Почему все мои запросы AJAX имеют один и тот же размер (343 B), хотя я меняю SHA1 (20 B) hash MD5 (16 B)?
Моя переменная контрольной суммы (SHA1) занимает 20 B: Где остальные 323 B?
Могу ли я уменьшить размер запроса AJAX? Как?

Примечание:

hex_sha1() представляет собой реализацию алгоритма SHA1 для Javascript: http://pajhome.org.uk/crypt/md5/sha1.html

ПРИМЕЧАНИЕ 2:

К сожалению, я не могу использовать технологию Server-Push Technique, например node.js. Я могу использовать только Javascript (на стороне клиента) и PHP.

Ответ 1

Почему бы не использовать простой JavaScript-запрос AJAX? Возможно, ваши данные AJAX слишком длинны, поэтому он имеет большой размер: и единственное, что вы можете сделать для него, это сделать данные AJAX несколькими данными.

Чего вы хотите? как Facebook AJAX Опрос? Сделайте это так на сервере PHP:

$chat_data = "(this is the chat data variable if there is no chat data it will idle)";
while (!$chat_data) {
     // when there no chat data let idle the request without disconnecting
     // the client from the AJAX request.
     sleep(1);
}
exit(json_encode($chat_data));

На стороне клиента JavaScript:

function repoll () {
     chat_poll = new XMLHttpRequest();
     // the chat_req variable is for sending POST data to the server.
     chat_req = new FormData();
     chat_req.append("do", "chatpoll");
     chat_poll.open("POST", "post.php");
     chat_poll.send(chat_req);
     chat_poll.onload = function () {
     // do something here with the chat data
     // repoll the server
     repoll();
}

repoll();

Выполняя это, вы выполняете опрос, подобный серверу на сервере Facebook.

Для примера websocket на стороне клиента JavaScript:

web_socket = new WebSocket("ws://[thesocket]:[theport]");
web_socket.onmessage = function (w) {
     // do something here. this will fire if messages is received from the websocket.
     // you will get the message from w.data variable.
     alert("Data Received: " + w.data);
}

// to send data to the web socket do this:
web_socket.send("the data you want. I prefer JSON for sending configuration and chat data or XML if you want");

Ответ 2

Здесь я беру на себя ваши вопросы, даже если вам лучше использовать библиотеку, например socket.io, с резервной поддержкой старых браузеров (имитируя веб-сайты через длительный опрос или такой).

Почему все мои запросы AJAX имеют одинаковый размер (343 B), хотя я измените хэш SHA1 (20 B) на MD5 (16 B)?

Большинство HTTP-сообщений между браузером и сервером по умолчанию сжаты с помощью gzip. Основная часть вашего потока запросов/ответов состоит из HTTP-заголовков, в которых 4 байта разницы в выходе вашего алгоритма хэширования могут не сильно повлиять из-за сжатия gzip.

Моя переменная контрольной суммы (SHA1) занимает 20 B: Где остальные 323 B?

См. выше, и чтобы убедиться в этом, вы можете использовать монитор http, tcpdump или инструменты разработчика, чтобы просмотреть необработанные переданные данные.

Могу ли я уменьшить размер запроса AJAX? Как?

WebSocket имеет гораздо меньший размер по сравнению с HTTP-запросами, поэтому использование его кажется лучшим вариантом (и опрос в интервалах почти никогда не является хорошей идеей, даже без WebSocket вам было бы лучше реализовать длительный опрос на вашем сервере).

Ответ 3

Я собрал простую страницу с запросом jQuery $.post. Он создает заголовок запроса в форме:

   POST /post_.js HTTP/1.1

   Host: localhost

   User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:38.0) Gecko/20100101 Firefox/38.0

   Accept: */*

   Accept-Language: it-IT,it;q=0.8,en-US;q=0.5,en;q=0.3

   Accept-Encoding: gzip, deflate

   Content-Type: application/x-www-form-urlencoded; charset=UTF-8

   X-Requested-With: XMLHttpRequest

   Referer: http://localhost/test.html

   Content-Length: 49

   Connection: keep-alive

   Pragma: no-cache

   Cache-Control: no-cache

Вы можете увидеть заголовки ответов и запросов, используя Firebug на Firefox или F12 в Chrome. На мой взгляд, дополнительные байты - это те, кто участвует в запросе Http.