JavaScript Data Push в основном посвящен онлайн -сервису WebApps. Нам не нужно активно толкать данные с сервера в локальную область каждый раз, как сервер, чтобы отправить запросы AJAX.
ИСТОРИЯ ДАННЫХ ДИСПОЛЕКОВОЙ ЭВОЛЮЦИЯ:
1. Протокол HTTP прост в опросе, сохранении ссылки или отправке запросов на бэкэнд непрерывно через переднюю часть
2. После обновления H5 WebSocket значительно улучшает удобство продвижения данных как в направлениях, так и в однонаправленных направлениях.
3. SSE (событие сервера): новый способ для серверов нажимать данные
COMET: Technology Server Push на основе HTTP Long Connection
Этот урок вводит Comet: технология Push Server, основанную на HTTP Long Connects, которая является архитектурой веб -приложений. Сервер будет активно доставлять данные в клиентскую программу асинхронно (Dead Loop Ajax запроса) без явных запросов клиента. Архитектура COMET очень подходит для веб-приложений, управляемых событиями, а также для приложений, которые требуют сильных интерактивных и возможностей в реальном времени, таких как анализ рынка торговли акциями, чаты и веб-версии.
1. Давайте сначала рассмотрим самый простой пример данных AJAX запроса JSON:
index.html
<meta charset = "utf-8"> <script type = "text/javascript" src = "http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script> <script type = "text/javascript"> $. Успех: function (data) {console.log (data);data.php
<? PHP Header ('Content-Type: Application/json; charset = utf-8'); $ res = array ('успех' => 'ok', 'text' => 'Я текст теста'); echo json_encode ($ res);?>Таким образом, фронт-конце может получить внутренние данные и выводить их. Давайте имитируем бэкэнд непрерывно подталкивать данные к фронте:
Одним из способов является постоянная отправка запросов Ajax в цикле переднего конца
2. Ajax на переднем конце
index.html
<meta charset = "utf-8"> <script type = "text/javascript" src = "http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"> </script> <script type = "text/javascript"> function conn () {$. "JSON", успех: функция (data) {console.log (data); </script>data.php
<? Header Php ('Content-Type: Application/json; charset = UTF-8'); Header ("Cache-Control: max-age = 0"); // Установить без кеша сна (1); $ res = array ('успех' => 'ok', 'text' => 'Я текст теста'); echo json_encode ($ res);?>Тем не менее, такой опрос подключения делает сетевые отходы запроса очень очевидными. Мы также можем пропустить цикл сервера бэкэнд через эту вещь, см. Следующий пример
3. Native Ajax, сервер разжигает его время от времени (Backend Lop, используйте ob_flush () и flush (), чтобы выплюнуть данные)
data.php
<? PHP // Header ('Content-Type: Application/json; charset = UTF-8'); Header ("Cache-Control: max-age = 0"); // Установить кэш $ i = 0; while ($ i <9) {$ i ++; // $ res = array ('успех' => 'ok', 'text' => 'Я текст теста'); // echo json_encode ($ res); сон (1); $ radom = rand (1 999); Echo $ RADOM; Echo '<br/>'; ob_flush (); // выходной кэш, должен использоваться с flush (); // Кэш плевок в браузер}?>Frontend JS (Native JS реализует AJAX и выходы при изменении состояния) Ссылка: //www.vevb.com/article/82085.htm
var getxmlhttprequest = function () {if (window.xmlhttprequest) {// mainstream браузеры предоставляют xmlhttprequest объект возвращать новый xmlhttprequest (); } else if (window.activexobject) {// Нижняя версия IE Browser не предоставляет xmlhttprequest объект //, поэтому вы должны использовать конкретную реализацию IE Browser ActivexObject return new ActiveXobject ("microsoft.xmlhtprequest"); }}; var xhr = getxmlhttprequest (); xhr.onreadystatechange = function () {console.log (xhr.readystate); if (xhr.readystate === 3 && xhr.status === 200) {// выполнить операцию после успешного сбора // Данные находятся в xhr.responsetextext.log (xhr.responsetext); }}; xhr.open ("get", "data.php", true); xhr.send ("");Выше приведено в этой статье, я надеюсь, что для всех будет полезно изучить программирование JavaScript.