Поддержка HTML 5 Networking Events

    Недавно я написал статью про технологию HTML 5  DOM Storage, поддержка которой появилась в  Internet Explorer 8. В этой статье я хотел бы рассмотреть еще одну часть HTML 5, поддержка которой появилась в IE8. Такой технологией является расширение событий браузера под общим названием Networking Events. В этой статье я постараюсь рассмотреть три таких события: onhashchange, ononline, onoffline.

    Описанные ниже события определены в черновике HTML 5 A vocabulary and associated APIs for HTML and XHTML. Мне не удалось найти описания реализаций этих событий в других браузерах. Поэтому, можно считать, что Internet Explorer 8 – это первый и пока единственный браузер который поддерживает новые события HTML 5.

    onhashchange


    Событие window.onhashchange призвано значительно упростить жизнь разработчику ajax-приложений или приложений с богатым клиентским функционалом. Браузер вызывает событие window.onhashchange когда меняется hash-часть URL. Скажем такое событие вызовется, когда пользователь перейдет с адреса example.domain/test.aspx#page1 на example.domain/test.aspx#page2. Другим способом вызвать это событие является установка нового значения для location.hash.

    Пример использования:
    <script type="text/javascript">

    function HashChangeHandler() {

    alert('Новый hash = ' + location.hash);

    }

    </script>



    <body onhashchange="HashChangeHandler();">

    <a href="#link1">Первая ссылка</a>

    <a href="#link2">Вторая ссылка</a>


    </body>


    * This source code was highlighted with Source Code Highlighter.

    ononline и onoffline


    Данные события вызываются браузером в том случае, когда браузер определяет, что соединение с интернет пропало или, наоборот, возобновилось. Эти свойства полезны для клиентского кода, позволяя отреагировать на ситуации когда во время работы пользователя с важными данными у него пропадает соединение с интернет, что пользователь может даже не заметить. В таких случаях приложение может поставить пользователя в известность, произвести какие-то операции по сохранению своего состояния или заблокировать ряд функций.

    Пример использования:
    function inoffline(e) {
      if (!e) e = window.event;
      ...
      alert('Внимание! Соединение с интернет потеряно.');
    }

    window.onload = function() {
      document.body.onoffline = inoffline;
    }


    * This source code was highlighted with Source Code Highlighter.


    Дополнительная информация



    Progg it
    Share post
    AdBlock has stolen the banner, but banners are not teeth — they will be back

    More
    Ads

    Comments 67

      –2
      Интересно как они собираются определять потерю или наличие сигнала. К примеру, если сидишь через wi-fi роутер, то компьютер понятия иметь не будет, что роутер отрубился от интернета. Разве что браузер будет периодически отправлять пакет на майкрософтовские серваки и проверять вернулся ли он обратно, но я был бы не в восторге, если бы мой браузер передавал им какие-либо данные без моего ведома.
        +3
        ваша операционная система не определяет, что она имеет или нет подключение к интернет? моя определяет и генерирует системные сообщения, любая программа может использовать эти сообщения, в том числе и браузер.
          +2
          У меня системное сообщение высвечивается только в случае нарушения связи между роутером и компьютером, а не роутером и интернетом. Ведь роутер может и вовсе не быть подключенным к интернету, а использоваться только для создания локальной сети.
            0
            речь идет именно об интернет, в системах семейства windows наличие подключения к интернет контролируется и в случае изменения состояния windows генерирует сообщения (afaik через WinInet API)
              0
              К сожалению, у меня такие сообщения не высвечиваются, буду рад если ткнете носом где их можно включить.
                +1
                это системные сообщения win32 API, вам они не видны
                посмотреть состояние подключения в win7 к интернет можно в

                Control Panel\Network and Internet\Network and Sharing Center

                или нажав на инконку сети, там будет написано «Internet access»

                vista и XP насколько я помню рисуют для инконки сетевого соединения шарик, в случае когда определено подключение к интернет
                  0
                  Спасибо за небольшой ликбез, теперь все понятно.
                    0
                    добро пожаловать на Хабр :)
                    +2
                    Как компьютер может определить подключён к интернет или нет при использовании подключения через маршрутизатор, без всяких ppp и прочих vpn? Никак, если не будет посылать пинги на ресурсы — а это тоже сомнительный способ. Даже открытие vpn не значит что есть соединение с интернет. Так что эти события полезны, но полагаться на их достоверность нельзя.
                      0
                      А как хр/виста/7 определяет? Видимо пингует сервак майкрософта. До сих пор ни разу не видел, чтоб ОС с этим ошибалась, так что думаю полагаться можно.
                        0
                        Почему только пинг или что-то более навороченное? Если бы пришлось делать такую индикацию, то сделал бы проще: если на сетевуху пришел пакет с IP, который не попадает в диапазоны локальных IP, то значит что-то пришло из и-нета и доступ к и-нету есть. Отключение тоже не особо сложно: если за определенное время (скажем минут 5) у нас через карточку не проходили пакеты с внешних IP, то сеть у нас только локальная. При этом неважно, какой протокол использовали, самое главное — факт прохождения пакета. И самим слать ничего и никуда не нужно.
                          0
                          А если у нас корпоративная сеть с выходом в интернет через IIS — это подключённый к интернету компьютер или нет? Физически — нет, пинги не ходят, адреса все из приватной сети. Логически — да, компьютер в интернете, AJAX работает. Что лампочка делает в этом случае?
                        –1
                        в семерке достаточно навести курсор на мониторчик в трее
                  +1
                  может быть, имеется в виде переход браузера в режим offline?
                  в меню вроде был такой пункт, под рукой нет IE, чтобы проверить
                    +2
                    она же неправильно определяет :)
                    у меня Виста определяет что она соединена с интернетом только при первом обращении к интернету. До этого в сетевом подключении горит только соединение от компьютера до локальной сети. Потом, когда на роутере пропадает интернет (а он временами пропадает, т.к. такой уж у нас провайдер) в контрольной панели что-то изменяется очень далеко несразу (может быть, когда не приходит ответ от DNS, только тогда?). В общем, способ-то у нее какой-то есть, но у в мысли тредстартера есть большая доля смысла.
                      0
                      если правильно определяет хотя бы 80% типовых конфигураций связности с Интернетом, то уже полностью юзабельно ;)

                      У меня, к примеру, правильно пашет и напрямую, и через роутер.
                        0
                        А, ну если так, то да.
                        Хотя меня раздражают индикаторы, которые показывают фиг знает что. На них нельзя полностью положиться.

                        А по теме топика, ну блин, когда уж в браузерах реализуют нормальный server callback! Чтобы сервер сам мог просить браузер что-нибудь выполнить.
                    +1
                    но я был бы не в восторге, если бы мой браузер передавал им какие-либо данные без моего ведома.

                    Что за ересь? Какие там данные, там будет пару байт, не больше ping.
                      +1
                      Я прекрасно это понимаю.
                        –1
                        вот ты бы писал определение, есть подключение к интернету или нет, как бы ты это делал?

                        мне приходят на ум следующие вещи:

                        1. Пинг до сайта. Но что будет если а) сайт не пингуется б) запрещен ICMP (по умолчанию в Outpost?)
                        2. Ответ до DNS. Что будет если а) сайта нет в DNS, вообще легальная ситуация б) DNS не отвечает, но интернет между тем есть (можно зайти по ip куда хочешь).
                        3. Пинг до сервера MS, http-запрос (или соединение на стандартный порт на крайний случай). А если серверы MS забанены? И исключены из DNS. У меня вот забанен Windows Update (точно) и всё остальное (весьма вероятно).
                          –1
                          Как минимум, Windows 7 по умолчанию синхронизирует время через Internet.

                          Уже есть вариант понять.
                            0
                            Синхронизация идет через протокол NTP (123й порт по UDP). Если на фаерволе/роутере запрещено все кроме HTTP (то есть всё кроме веб-сайтов), то время синхронизироваться не будет. Учитывая что в организациях обычно оставляют не только «все кроме HTTP», но также и фильтруют сами сайты которые можно открыть, ситуация очень даже вероятная.
                            0
                            2. Ответ до DNS. Что будет если а) сайта нет в DNS, вообще легальная ситуация б) DNS не отвечает, но интернет между тем есть (можно зайти по ip куда хочешь).


                            А кому нужен такой интернет?:)
                              0
                              Ну, например, выделенному веб-серверу =)

                              Или пользователю, у провайдера которого в очередной раз упал DNS, но типовые адреса все еще лежат в кэше.
                                0
                                Ну или вот еще, обратный пример про DNS.
                                У нас на работе стоит внутренний DNS, только для нашего офиса. Все имена которые он знает — разруливает сам, которые не знает — отправляет на DNS провайдера.
                                В такой ситуации Windows _всегда_ получает ответ от DNS, да еще и от DNS выданной по VPN, и всегда считает что интернет есть — вне зависимости от того, работает ли DNS провайдера или нет, то есть есть ли интернет по-настоящему или нет.
                          +1
                          Круто. Зачем реализовывать возможности еще не принятого так стандарт html5, если до сих пор куча багов с поддержкой DOM-модели от w3c ?!
                            0
                            если вопрос ко мне, то мне будет проще ответить, если вы укажите те самые баги с поддержкой DOM-модели от w3c
                              +5
                              Допустим, отсутствие стандартного метода addEventListener(), до сих пор используется attachEvent()
                                –2
                                Нет, все-таки не понимаю некоторых людей… За что минусы в карму? Это мой второй(первый на два комента выше) комент на хабре (да, да, я из «июльской лотереи », хотя хабр читаю уже около года), а карма уже в минусах :(
                                  0
                                  Поводом к войне послужили следующие обстоятельства. Всеми разделяется убеждение, что вареные яйца при употреблении их в пищу испокон веков разбивались с тупого конца; но дед нынешнего императора, будучи ребенком, порезал себе палец за завтраком, разбивая яйцо означенным древним способом. Тогда император, отец ребенка, обнародовал указ, предписывающий всем его подданным под страхом строгого наказания разбивать яйца с острого конца. Этот закон до такой степени озлобил население, что, по словам наших летописей, был причиной шести восстаний, во время которых один император потерял жизнь, а другой — корону
                                  Джонатан Свифт. ПУТЕШЕСТВИЯ ГУЛЛИВЕРА
                                  0
                                  кстати, да… DOM Level 2…
                                +5
                                IE поддерживает _новые_ стандарты. Про старые речи не шло :)
                                • UFO just landed and posted this here
                                    –2
                                    Почему зарубили? Отдельные элементы CSS3 IE8 тоже поддерживает.
                                    • UFO just landed and posted this here
                                        +1
                                        неправда ) пару новых CSS3-селекторов поддерживает, судя по докладам Могилёвского :)
                                      –2
                                      IE поддерживает следуюoие css3-свойства:

                                      ruby-align
                                      ruby-overhang
                                      ruby-position
                                      ruby-span
                                      text-align-last
                                      text-justify
                                      text-overflow
                                      word-break
                                      word-wrap
                                      writing-mode
                                      overflow-x
                                      overflow-y
                                      box-sizing

                                      немного, но все же они есть
                                      • UFO just landed and posted this here
                                          –2
                                          было, не спорю, но ведь «не зарубили»
                                          вообще, тут небольшая подмена понятий. это не в IE7 стали появляться элементы CSS3, а в стандарт CSS3 стали включать полезные свойства которые есть в IE. Поскольку некоторые из них в IE с дремучих времен. например @font-face
                                          • UFO just landed and posted this here
                                              +2
                                              Интереснее был фокус с нормальной боксовой моделью от MS, которую похерили, а потом снова ввели в качестве дополнительной. Что мешало это сделать раньше?
                                      0
                                      Я вижу, что автор в курсе дела HTML 5. Тож есть вопрос. Будет ли возможность определить активна в данный момент вкладка или нет?
                                        0
                                        про html 5 знаю немного, только то что рассылают в рассылке группы разработчиков
                                        про табы не слышал, не уверен что такое можно засунуть в стандарт, все же браузер может не иметь табов
                                          +1
                                          document.onFocus()?
                                          Или я опять глупость сморозил?
                                          0
                                          Ура! Теперь и у пользователей IE появится поддержка истории в ajax приложениях и сайтах.
                                          Как бы я был признателен MS если бы они еще принудительно обновили все IE до 8 версии, но мечты-мечты.
                                            0
                                            ну поддержка истории всегда как-то была, у меня gmail нормально работал и работает да и все остальные web-приложения тоже
                                              0
                                              эта поддержка на совести разработчиков, на хабре были статьи на эту тему
                                                0
                                                Да, я знаю про то, что и в ИЕ можно сделать поддержку истории, но уж больно извратскими методами. В работе с JS и HTML я придерживаюсь одного принципа: все используемые технологии должны быть кросбраузерными и никаких хаков с определением версий браузера, одно исключение это pngfix и то не для всех проектов. Этот принцип позволяет относится к вебу, как к десктопному программированию, что бережет уйму нервов. Рекомендую.

                                                То что ИЕ некорректно возвращает document.location.href я думаю это именно проблема(баг) ИЕ. В отличии от того, что ему можно простить, например, отсутствии canvas или поддержки png-24, как отсутствие функционала, то в этом случае location.href это действительно баг.

                                                В работе разработчик должен использовать технологии поддерживаемые большинством браузеров, но если речь идет о багах и о том, что пользователь пользуется ПО с багами, то это проблема пользователя. Да и проблема эта не критичная, а, по сути, незаметная большинством пользователей.

                                                Такт что, я считаю, что отсутствие поддержки истории в ajax приложениях для ИЕ это позволительно разработчику. Но с новой версией ИЕ эта проблема уходит в прошлое.
                                              +1
                                              IE снова будет поддерживать свою версию HTML и JS?
                                              Или они после принятия стандарта HTML5 будут поддерживать принятый стандарт?
                                                +1
                                                Не понял какие тут претензии к IE, они внедряют одну из технологий HTML5, ну да, это ещё не стандарт, но ведь все браузеры внедряют что-то из HTML5, это делается для того, чтобы обкатывать эти решения. Именно так стандарт и рождается.
                                                  0
                                                  Суть вопроса в том, что будет если стандарт будет отличаться от того как это реализовано в ІЕ?
                                                  Сделает MS правки в коде своего браузера или IE будет со своим альтернативным вариантом HTML5?

                                                    +3
                                                    Что если теги AUDIO, VIDEO и CANVAS в стандарте HTML5 будут отличаться от того, что реализовано в «Опере», «FF», «Сафари» и «Хроме»? Будут эти браузеры править свой код.

                                                    Ответ на этот вопрос неизвестен. Но это ещё не говорит о том, что Microsoft плохой, а все остальные в белом.

                                                    Довольно много функций из HTML5 (помимо перечисленных сейчас в нашем диалоге) уже реализованы в браузерах. Что будет, если в стандарте что-то изменится не знает никто, возможно, не знают даже производители браузеров.
                                                      –1
                                                      Лично я за Оперу, FF, Сафари, Chrome — не переживаю, думаю они примут во внимание изменения стандарта, как себя поведет MS — не знаю.
                                                      Я не говорю что MS это зло, я просто очень не хочу повторения истории с IE6.
                                                      Да и MS подает надежды: IE8 близок к принятыми стандартами.
                                                        +1
                                                        Так, а что за история с IE6, подскажите.
                                                          +1
                                                          Я об кросбраузерной разработке web-страниц.
                                                            0
                                                            Я не понимаю о чём вы. Объясните.
                                                              +1
                                                              Реализуете кросбраузерний интерфейс для сложного веб сервиса.

                                                              Когда вы будете встречать странное поведение IE (особенно 6-го) в то же время как в Опере, FF, сафари, хроме все работает прекрасно — Вы поймете.
                                                                +1
                                                                Я понимаю все эти проблемы. Я не понимаю вашей путаницы. IE6 вышел много лет назад, другие браузеры за это время обновлялись, IE6 не менялся. Обвинять браузер, вышедший много лет назад в том, что он не поддерживает какие-то новые вещи — странно.
                                                                  +1
                                                                  IE6: Август 27 2001г.
                                                                  HTML 4.01 Specification: 24 Декабрь 1999.

                                                                  И проблем у IE6 с HTML4 было много.
                                                                    +4
                                                                    Вы не правы в том, что рассматриваете IE6 с позиции настоящего времени.

                                                                    У остальных браузеров той поры проблем с HTML4 было больше, чем у IE. Тогда, в те годы, это был прогрессивный браузер.
                                                                      +4
                                                                      Хорошо я соглашусь с Вами — я не прав.
                                                                  0
                                                                  Ну не знаю, там сложный веб сервис, но JS на базе любого фреймворка получается кроссбраузерным :)

                                                                  P.s. Сломался вчера чайник, купил новый. Подставка с питанием подходит от старого к новому, от новому к старому, вот что значит стандарт :)
                                                                    0
                                                                    Вот именно — я вел разговор к тому что плохой стандарт лучше чем без него вообще. Потому что для решения какой-то проблемы можно будет легко найти решения проблемы, и наоборот для решения проблемы без стандарта превращается в головную боль %( Я просто год работал над такой системой — я точно знаю как єто :)

                                                                    Вот с чайником Вам повезло, а у мобилок зарядки все разные — я например за то чтоб была одна зарядка для всех.
                                                                      0
                                                                      Кстати с мобилами больная тема, вот моторола же переехала на miniUSB, и чё остальные ждут непонятно =(
                                                                        0
                                                                        Думаю жадничают — ведь китайцам или кому-то другому будет проще делать зарядки =)
                                                                  • UFO just landed and posted this here

                                                Only users with full accounts can post comments. Log in, please.