Здравствуйте, коллеги!
Есть страница, которая содержит картинку и текст, которые забирает с моего (встроенного в прогу) HTTP-сервера. Картинка отдается по одному и тому же URL, но может быть разная, в зависимости от состояния проги может быть разная. Также есть некоторый текст, который бы хотелось обновлять аналогично.
Ореративность обновления: хотелось бы 2-4 секунды максимум от изменения данных на серваке до обновления в браузере.
Что нашел.
1) можно вставить META refresh — но это грузить сеть и сервак, и в браузере мерцает, и если проскроллил вниз, то при обновлении страница опять с начала отображается.
2) Скрипт, который грузит данные в элемент с id=card. Скрипт использует JQuery.
Никак не могу допереть, как написать такой скрипт, который бы проверял нужность перезагрузки и только в этом случае перезагружал данные?
Может кто-нибудь по шагам, на пальцах объяснить, как это сделать?
Желательно с использованием JQuery (ну или чистого JavaScript), так как я ее вроде слегка освоил, не хотелось бы еще что-то дергать.
Желательна кросс-браузерность.
Специфика — сервер не держит постоянные (keep-alive) соединения, только Connection: close.
PS. Я в вебе практически 0, не пинайте Просто понадобилось в прогу добавить что-то типа функционала презентаций, которые могут просматривать одновременно с кучи компов без установки какого-либо доп. софта.
Здравствуйте, Marty, Вы писали:
M> Здравствуйте, коллеги! M> Есть страница, которая содержит картинку и текст, которые забирает с моего (встроенного в прогу) HTTP-сервера. Картинка отдается по одному и тому же URL, но может быть разная, в зависимости от состояния проги может быть разная. Также есть некоторый текст, который бы хотелось обновлять аналогично. M>Ореративность обновления: хотелось бы 2-4 секунды максимум от изменения данных на серваке до обновления в браузере.
Здравствуйте, GarryIV, Вы писали:
M>> Здравствуйте, коллеги! M>> Есть страница, которая содержит картинку и текст, которые забирает с моего (встроенного в прогу) HTTP-сервера. Картинка отдается по одному и тому же URL, но может быть разная, в зависимости от состояния проги может быть разная. Также есть некоторый текст, который бы хотелось обновлять аналогично. M>>Ореративность обновления: хотелось бы 2-4 секунды максимум от изменения данных на серваке до обновления в браузере.
GIV>* 14.25 If-Modified-Since GIV>* Comet
Я читал и про Comet и про If-Modified-Since, но я полный ноль в программировании на клиентской стороне (в браузере), теоретически я подкован, и на сервере я могу реализовать все что потребуется без проблем, моя проблема в том, что я как раз и не знаю, что надо сделать на клиентской стороне. О comet'е — я специально отметил, что используемая мной реализация http-сервера не поддерживает постоянное соединение. Надо еще добавить, что в моем веб-сервере при получении запроса и после его разбора и валидации вызывается пользовательский (мой) обработчик, который формирует заголовки и содержимое, после выхода из этого обработчика формируется ответ сервера и соединение закрывается, и тут я ничего сделать не могу. Как я понял, Comet держит постоянное соединение и по мере надобности пропихивает в него данные. Я подобное реализовать к сожалению не могу.
Я был бы благодарен за более подробное объяснение, что мне следует сделать на клиентской стороне, но судя по всему, вы не читали мое изначальное сообщение дальше процитированного вами. Тем не менее, спасибо за отклик.
Здравствуйте, Marty, Вы писали:
M>Получилось тоже самое.
M>Никак не могу допереть, как написать такой скрипт, который бы проверял нужность перезагрузки и только в этом случае перезагружал данные?
Здравствуйте, Marty, Вы писали:
M>>> Здравствуйте, коллеги! M>>> Есть страница, которая содержит картинку и текст, которые забирает с моего (встроенного в прогу) HTTP-сервера. Картинка отдается по одному и тому же URL, но может быть разная, в зависимости от состояния проги может быть разная. Также есть некоторый текст, который бы хотелось обновлять аналогично. M>>>Ореративность обновления: хотелось бы 2-4 секунды максимум от изменения данных на серваке до обновления в браузере.
GIV>>* 14.25 If-Modified-Since GIV>>* Comet
M> Я читал и про Comet и про If-Modified-Since, но я полный ноль в программировании на клиентской стороне (в браузере), теоретически я подкован, и на сервере я могу реализовать все что потребуется без проблем, моя проблема в том, что я как раз и не знаю, что надо сделать на клиентской стороне.
Извини, читал по диагонали. Ну без комета так без комета.
Давай тогда что не умеешь. Установить заголовок запроса? Посмотреть статус и заголовки ответа?
WBR, Igor Evgrafov
Re[2]: Как сделать обновление страницы при изменении ее на с
Здравствуйте, Lloyd, Вы писали:
L>Здравствуйте, Marty, Вы писали:
M>>Получилось тоже самое.
M>>Никак не могу допереть, как написать такой скрипт, который бы проверял нужность перезагрузки и только в этом случае перезагружал данные?
L>Как-то так:
Спасибо за пример Буду премного благодарен, если вы прокомментируете каждую строку, что она делает (ну или должна делать), что отсылает на сервер и как сервер должен реагировать (по последнему — http-сервер мой, а не какой-то из общеиспользуемых, в которых уже какая-то логика "зашита", и мне надо понять, что отвечать на такие запросы)
Здравствуйте, GarryIV, Вы писали:
GIV>Извини, читал по диагонали. Ну без комета так без комета.
GIV>Давай тогда что не умеешь. Установить заголовок запроса? Посмотреть статус и заголовки ответа?
На сервере — умею практически все. На клиенте — вообще ничего ;( третий день всего пошел как я изучаю клиентское программирование
Из перечисленного вами — шаги по отдельности я расковыряю, если пнут куда надо (ну и направление вы уже дали), а как решить задачу в комплексе, без глубокого погружения в технологии жаваскрипт и тп не представляю.
В любом случае, спасибо за указание направления для поиска
Здравствуйте, Marty, Вы писали:
L>>Как-то так:
M>Спасибо за пример Буду премного благодарен, если вы прокомментируете каждую строку, что она делает (ну или должна делать), что отсылает на сервер и как сервер должен реагировать (по последнему — http-сервер мой, а не какой-то из общеиспользуемых, в которых уже какая-то логика "зашита", и мне надо понять, что отвечать на такие запросы)
Поставьте апач и посмотрите FireBug-ом, что он отсылает/получает и делайте так же. Будет гораздо продуктивнее.
Re[4]: Как сделать обновление страницы при изменении ее на с
Здравствуйте, Lloyd, Вы писали:
L>Поставьте апач и посмотрите FireBug-ом, что он отсылает/получает и делайте так же. Будет гораздо продуктивнее.
Спасибо что дали пример для копания. .ajax это из JQuery или еще что-то? А вообще, если не трудно, все же расскажите вкратце, что будет происходить, и мне проще, и, может, еще кому поможет.
Re: Как сделать обновление страницы при изменении ее на серв
От:
Аноним
Дата:
12.08.10 03:21
Оценка:
Здравствуйте, Marty, Вы писали:
M>Получилось тоже самое.
M>Никак не могу допереть, как написать такой скрипт, который бы проверял нужность перезагрузки и только в этом случае перезагружал данные?
Примерный алгоритм:
1. клиент во время инициализации, запрашивает данные, сервер отправляет данные и текущую версию.
2. клиент сохраняет и то и другое
3. клиент по таймауту отправляет на сервер версию через ajax запрос.
4. сервер, если версии не совпадают на сервере и клиенте, возвращает true, иначе false
5. если сервер вернул true, клиент делает запрос на получение данных
6. начинается все с 1 пункта.
Недостаток — версия хранится целиком для данных, если изменилась часть данных, то придется обновить всю страницу.
Есть несколько вариантов решения этой проблемы, но, вам достаточно предыдущего алгоритма.
Re[5]: Как сделать обновление страницы при изменении ее на с
Здравствуйте, Marty, Вы писали:
L>>Поставьте апач и посмотрите FireBug-ом, что он отсылает/получает и делайте так же. Будет гораздо продуктивнее.
M>Спасибо что дали пример для копания. .ajax это из JQuery или еще что-то?
Да, из jQuery.
M>А вообще, если не трудно, все же расскажите вкратце, что будет происходить, и мне проще, и, может, еще кому поможет.
FireBug в помощь.
Re[6]: Как сделать обновление страницы при изменении ее на с
От:
Аноним
Дата:
12.08.10 07:06
Оценка:
Здравствуйте, Lloyd, Вы писали:
M>>А вообще, если не трудно, все же расскажите вкратце, что будет происходить, и мне проще, и, может, еще кому поможет.
L>FireBug в помощь.
Лучше поставить Chrome, там великолепный встроенный отладчик. После FireBug некоторая адаптация идет, но когда привыкаешь, FireBug — нервно курит в сторонке
Re[2]: Как сделать обновление страницы при изменении ее на с
If-Modified-Since: Fri, 13 Aug 2010 09:21:22 GMT; lenght: 1840
Выделенное IE добавляет, остальные браузеры не добавляют. Для использования этого механизма надо еще добавлять заголовок Last-Modified, тогда он быдет перенесен в If-Modified-Since, иначе будет использоваться (по-видимому) дата загрузки документа.
На сервере проверяем этот заголовок (я тупо сравниваю с тем, что отсылалось в Last-Modified, но вообще правильнее распарсить строку и сравнить время), и если ничего не изменилось, то отсылаю только код ответа 304 Not Modified (вообще, можно отсылать любой код, приведенный java-скрипт перезагрузит страницу только если код == 200 Ok).
Осталась проблема — я подгружаю по таймеру html, он проверяется регулярно и при изменении перегружается, но в этом html есть <img>, и хотя я что-только не перепробовал с заголовками кеширования и вышеперечисленными, все равно картинка берется из кеша браузера. В принципе, как вариант, можно грузить сразу картинку, только я не пойму, как ее в текущую страничку затолкать.
Здравствуйте, Marty, Вы писали:
M>Осталась проблема — я подгружаю по таймеру html, он проверяется регулярно и при изменении перегружается, но в этом html есть <img>, и хотя я что-только не перепробовал с заголовками кеширования и вышеперечисленными, все равно картинка берется из кеша браузера. В принципе, как вариант, можно грузить сразу картинку, только я не пойму, как ее в текущую страничку затолкать.
Проблему решил пока обходом = к имени картинки добавляю ?hash=code, где code это посчитаный для данного файла crc16. Работает как часы.
Здравствуйте, Marty, Вы писали:
M> Я читал и про Comet и про If-Modified-Since, но я полный ноль в программировании на клиентской стороне (в браузере), теоретически я подкован, и на сервере я могу реализовать все что потребуется без проблем, моя проблема в том, что я как раз и не знаю, что надо сделать на клиентской стороне.
На клиенте ничего специального делать не надо. Надо, чтобы сервер отдавал корректные заголовки, и корректно обрабатывал заголовки, переданные ему.
1. Передавайте Last-Modified и ETag (в вашем случае ETag всегда будет тем же самым)
2. Трактуйте запрос с If-Modified-Since как проверку "изменилось или нет". Если не изменилось, то отдавайте 304. Если изменилось — отдавайте новую картинку с 200 Ok и новым Last-Modified.
3. Может потребоваться время на отладку работы — поставьте себе http://fiddlertool.com и смотрите, какие запросы ходят.
Уйдемте отсюда, Румата! У вас слишком богатые погреба.