RootRouter Монитор v3

Релиз RootRouter монитор v3: слияние тестов доступности и скорости в единый асинхронный конвейер

Бесплатный инструмент онлайн-проверки доступности сайтов и популярных сервисов. Узнайте, работают ли нужные ресурсы прямо сейчас: Discord, Reddit, Pinterest, LinkedIn, Threads, Mastodon, Tumblr, Snapchat, TikTok, Likee, XING, Flickr, Blogger, Medium, Substack, WeChat, Line, KakaoTalk, Element, Gmail, Outlook, Yahoo Mail, Proton Mail, Tutanota, GMX Mail, Zoho Mail, Mail.com, Fastmail, iCloud Mail, AOL Mail, Facebook, Instagram, X (Twitter), Telegram, WhatsApp, Viber, Signal, Yandex Mail, Mail.ru, Outlook.com, Hushmail, YouTube, Vimeo, Dailymotion, SoundCloud, Bandcamp, Mixcloud, Rumble, DTube, SoundClick, Deezer, Tidal, Pandora, Spotify, Apple Music и другие ресурсы.

В рам­ках модер­ни­за­ции диа­гно­сти­че­ско­го инстру­мен­та­рия про­ек­та RootRouter завер­ше­на рабо­та над вер­си­ей v3. Исход­ная зада­ча заклю­ча­лась в глу­бо­ком рефак­то­рин­ге, опти­ми­за­ции архи­тек­ту­ры под тре­бо­ва­ния поис­ко­вых систем (в част­но­сти, Яндекс) и устра­не­нии вза­им­но­го вли­я­ния кон­ку­рент­ных сете­вых пото­ков при одно­вре­мен­ном заме­ре про­пуск­ной спо­соб­но­сти и про­вер­ке доступ­но­сти хостов.

Инстру­мент пред­на­зна­чен для ком­плекс­ной оцен­ки каче­ства интер­нет-под­клю­че­ния. Он поз­во­ля­ет выявить, на каком имен­но уровне про­ис­хо­дит дегра­да­ция сер­ви­са: на физическом/транспортном (низ­кая ско­рость, высо­кий джит­тер) или на при­клад­ном (сете­вые бло­ки­ров­ки кон­крет­ных URL).

Виджет пол­но­стью авто­но­мен, рас­про­стра­ня­ет­ся бес­плат­но и может быть инте­гри­ро­ван на любой сто­рон­ний ресурс.

Код для встраивания (iframe):

<iframe src="https://rootrouter.ru/online/?rkn3_embed=1" width="100%" height="900" style="border:0;max-width:100%;" loading="lazy" sandbox="allow-scripts allow-same-origin allow-popups allow-popups-to-escape-sandbox allow-forms" allow="clipboard-write" title="RootRouter — тест доступности сайтов"></iframe>
<p style="font:12px/1.4 sans-serif;margin:6px 0 0;">Тест предоставлен сайтом <a href="https://rootrouter.ru/" target="_blank" rel="noopener">RootRouter</a></p>

Пол­ная веб-вер­сия мони­то­ра доступ­на по пря­мой ссыл­ке: https://​rootrouter​.ru/​o​n​line/

Как будет выгля­деть встра­и­ва­е­мый через <iframe> RootRouter monitor – тест доступ­но­сти сай­тов на вашем сай­те? Вот так 👍


Архитектурные изменения и рефакторинг (Часть 1)

Исто­ри­че­ски кодо­вая база про­ек­та раз­ви­ва­лась сти­хий­но, из-за чего логи­ка чеке­ра ({rkn_checker_v2}) и видже­та ско­ро­сти ({rr_speedtest}) была частич­но завя­за­на на кон­фи­гу­ра­цию дочер­ней темы WordPress (AstraPro) и акку­му­ли­ро­ва­лась в functions.php. Это услож­ня­ло мас­шта­би­ро­ва­ние и созда­ва­ло избы­точ­ную нагруз­ку на рен­де­ринг страниц.

В v3 весь код пол­но­стью изо­ли­ро­ван в рам­ках еди­но­го пла­ги­на со стро­гой модуль­ной структурой:

  • rootrouter-monitor.php – еди­ная точ­ка вхо­да. Выпол­ня­ет реги­стра­цию ново­го уни­фи­ци­ро­ван­но­го шорт­ко­да {rootrouter_monitor}, ини­ци­а­ли­за­цию кон­стант и цен­тра­ли­зо­ван­ное под­клю­че­ние ассе­тов через wp_enqueue_script и wp_enqueue_style.
  • includes/services.php – выне­сен­ный мас­сив дан­ных, содер­жа­щий кон­фи­гу­ра­цию и пра­ви­ла про­вер­ки для 105 целе­вых сер­ви­сов (вклю­чая YouTube, Instagram, Telegram).
  • includes/speedtest-config.php – кон­фи­гу­ра­ция пула CDN-источ­ни­ков (CacheFly, Cloudflare) для заме­ров про­пуск­ной способности.
  • includes/rest-api.php – сер­вер­ный слой. Обес­пе­чи­ва­ет рабо­ту REST-энд­по­ин­тов внут­ри про­стран­ства имен rootrouter/v1 (/config, /ping, /upload) и обра­бот­ку CORS-заголовков.
  • templates/render-template.php – раз­мет­ка интер­фей­са, реа­ли­зу­ю­щая кон­цеп­цию SSR (Server-Side Rendering). Кар­точ­ки ресур­сов и струк­ту­ра FAQ фор­ми­ру­ют­ся на сто­роне сер­ве­ра для кор­рект­ной индек­са­ции поис­ко­вы­ми роботами.
  • assets/style.css и assets/main.js – объ­еди­нен­ные таб­ли­цы сти­лей и фрон­тенд-логи­ка. Устра­не­но дуб­ли­ро­ва­ние хел­пе­ров (escapeHtml, copyToClipboard, меха­низ­мов рабо­ты с хранилищем).

Оптимизация сетевых потоков и устранение гонок (Race Conditions)

Основ­ная тех­ни­че­ская про­бле­ма преды­ду­щих вер­сий заклю­ча­лась в том, что парал­лель­ный запуск про­вер­ки доступ­но­сти 105 хостов и мно­го­по­точ­но­го теста ско­ро­сти при­во­дил к ути­ли­за­ции сете­во­го кана­ла пользователя.

  1. Лож­ные тай­мау­ты (False Negatives): Замер ско­ро­сти (скачивание/отдача) заби­вал про­пуск­ную спо­соб­ность («пол­ку») кана­ла. В этот же момент JS-чекер пытал­ся выпол­нять fetch или script_probe запро­сы к про­ве­ря­е­мым сай­там. Из-за нехват­ки поло­сы паке­ты чеке­ра упи­ра­лись в тай­маут, и доступ­ные ресур­сы оши­боч­но мар­ки­ро­ва­лись как «Не доступно».
  2. Дегра­да­ция мет­рик задерж­ки: Одно­вре­мен­ный залп HTTP-запро­сов к сотне доме­нов раз­ду­вал пока­за­те­ли Ping и Jitter в тесте ско­ро­сти, делая резуль­та­ты заме­ра нерелевантными.

Решение: Асинхронный последовательный конвейер

В v3 внед­ре­на жест­кая после­до­ва­тель­ность выпол­не­ния (сери­а­ли­за­ция процессов):

[Загрузка страницы] ➔ [Автозапуск: Тест Скорости] ➔ [Триггер окончания] ➔ [Автозапуск: Тест Доступности]

На вре­мя выпол­не­ния любо­го из эта­пов обе управ­ля­ю­щие кноп­ки про­грамм­но бло­ки­ру­ют­ся функ­ци­я­ми управ­ле­ния состо­я­ни­ем DOM (refreshButtons() и onAvailabilityDone()). Руч­ной пере­за­пуск поз­во­ля­ет ини­ци­и­ро­вать каж­дый тест изо­ли­ро­ван­но, предот­вра­щая нало­же­ние потоков.

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


Решение проблемы детерминации IP-адреса во фреймах и при split-tunneling

В вер­сии 1.6 теста доступ­но­сти наблю­дал­ся баг: при актив­ном туннель-под­клю­че­нии тест доступ­но­сти мог отоб­ра­жать реаль­ный IP-адрес про­вай­де­ра, в то вре­мя как тест ско­ро­сти v 1.04 фик­си­ро­вал IP-адрес туннель-сервера.

Причина расхождения

Тест ско­ро­сти опре­де­лял адрес клас­си­че­ским сер­вер­ным мето­дом (PHP-обра­бот­чик счи­ты­вал заго­лов­ки сете­во­го паке­та, при­шед­ше­го на rootrouter.ru). Тест доступ­но­сти отправ­лял кли­ент­ские асин­хрон­ные запро­сы из бра­у­зе­ра к 7 сто­рон­ним пуб­лич­ным API (ipify, my​-ip​.io и др.).

При исполь­зо­ва­нии split-tunnel марш­ру­ти­за­ции на роу­те­ре (когда доме­ны зоны .ru идут напря­мую через физи­че­ско­го про­вай­де­ра, а забло­ки­ро­ван­ные ресур­сы пере­на­прав­ля­ют­ся в туннель-тун­нель), запро­сы к rootrouter.ru и к меж­ду­на­род­ным IP-API шли по раз­ным марш­ру­там. Чекер не ломал­ся – он фик­си­ро­вал реаль­ную утеч­ку марш­ру­тов (DNS/IP leak) на сто­роне кли­ен­та, но это пута­ло конеч­но­го пользователя.

Допол­ни­тель­но во встра­и­ва­е­мых <iframe> без фла­га allow-same-origin бра­у­зер при­сва­и­вал фрей­му пустой origin (null). Это пол­но­стью бло­ки­ро­ва­ло сете­вые запро­сы к локаль­но­му API и вызы­ва­ло кри­ти­че­скую ошиб­ку All ping attempts failed.

Реализованное решение

  1. Цен­тра­ли­зо­ван­ный сер­вер­ный IP: Кли­ент­ский пул из 7 сто­рон­них API пол­но­стью уда­лен из JS. IP-адрес теперь опре­де­ля­ет­ся стро­го один раз на сер­ве­ре RootRouter функ­ци­ей rkn3_get_client_ip() (с вали­да­ци­ей заго­лов­ков CF-Connecting-IP, X-Forwarded-For, REMOTE_ADDR). Дан­ные жест­ко вши­ва­ют­ся в HTML при SSR-рен­де­ре и отда­ют­ся в JSON-отве­те энд­по­ин­та /config.
  2. CORS и Sandbox-поли­ти­ка: В гене­ра­тор Embed-кода iframe при­ну­ди­тель­но добав­лен флаг allow-same-origin. Для защи­ты на слу­чай сто­рон­них жест­ких поли­тик CSP (Content Security Policy) на сай­тах-встрой­щи­ках, все REST-марш­ру­ты пла­ги­на (/config, /ping, /upload) теперь отда­ют wildcard-заго­лов­ки Access-Control-Allow-Origin: *. Если бра­у­зер роди­тель­ско­го сай­та всё же бло­ки­ру­ет сете­вой тра­фик фрей­ма, в JS преду­смот­рен пере­хват исклю­че­ния (fallback), выво­дя­щий уве­дом­ле­ние о необ­хо­ди­мо­сти прой­ти тест на первоисточнике.

Математика вердиктов и обработка политик безопасности браузеров

Инте­граль­ный пока­за­тель доступ­но­сти сети теперь рас­счи­ты­ва­ет­ся исклю­чи­тель­но на осно­ве детер­ми­ни­ро­ван­ных исхо­дов. Ста­ту­сы «Не опре­де­ле­но» (тай­маут отве­та хоста) и «Скры­то защи­той» не ухуд­ша­ют ито­го­вую оцен­ку подключения.

Фор­му­ла рас­че­та индек­са доступности:
Индекс = Доступ­но / (Доступ­но + Не доступно)

Обработка CORS и Cross-Origin политик в современных браузерах

Бра­у­зе­ры на движ­ках WebKit и Gecko (Safari, Firefox, а так­же любые бра­у­зе­ры на базе iOS и встро­ен­ные WebView-кли­ен­ты мес­сен­дже­ров, таких как Telegram) при­ме­ня­ют стро­гие эври­сти­ки защи­ты от меж­сай­то­во­го отсле­жи­ва­ния. При попыт­ке заде­ба­жить ста­тус сете­во­го соке­та сто­рон­не­го ресур­са (напри­мер, через гене­ра­цию ошиб­ки загруз­ки картинки/скрипта на чужом домене), эти бра­у­зе­ры при­ну­ди­тель­но скры­ва­ют дета­ли сете­вой ошиб­ки в целях безопасности.

Фрон­тенд-скрипт main.js теперь вали­ди­ру­ет navigator.userAgent через функ­цию detectBrowser(). Если обна­ру­жи­ва­ет­ся WebKit/Gecko сре­да, интер­фейс кор­рект­но под­став­ля­ет ста­тус «Скры­то защи­той» вме­сто лож­но­го «Забло­ки­ро­ва­но», а вер­дикт допол­ня­ет­ся тех­ни­че­ским пояс­не­ни­ем. Для Chromium-систем, где дан­ные огра­ни­че­ния в теку­щей реа­ли­за­ции отсут­ству­ют, диа­гно­сти­ка выпол­ня­ет­ся в стан­дарт­ном режиме.


SEO-оптимизация под требования поисковых систем (Яндекс)

Для про­дви­же­ния стра­ни­цы /online/ (или /rrm/), лишен­ной клас­си­че­ских лон­гри­дов, семан­ти­че­ское поле было инте­гри­ро­ва­но непо­сред­ствен­но в раз­мет­ку интерфейса:

  1. Дина­ми­че­ские ста­ти­че­ские атри­бу­ты: Для всех 105 кар­то­чек сер­ви­сов гене­ра­ция тегов изоб­ра­же­ний пере­ве­де­на на жест­кий формат: 
    • alt="Проверить доступность [Название Сервиса] онлайн"
    • title="Тест работы [Название Сервиса] через интернет"
      Это поз­во­ля­ет робо­ту Яндек­са счи­ты­вать клю­че­вые мар­ке­ры реле­вант­но­сти при обхо­де DOM.
  2. Семан­ти­че­ская иерар­хия: Заго­лов­ки раз­де­лов пере­ве­де­ны на теги H2 и H3. Спой­ле­ры легенд и кате­го­рий сохра­ня­ют тек­сто­вое содер­жи­мое в DOM, но скры­ты через CSS, что дела­ет их доступ­ны­ми для индек­са­ции без заму­со­ри­ва­ния UX.
  3. Schema​.org (JSON-LD): На уровне шаб­ло­на внед­ре­ны два мас­си­ва микроразметки: 
    • WebApplication (Сущ­ность: RootRouter Тест доступ­но­сти, ОС: Web/Все).
    • FAQPage (Валид­ный JSON-LD, дуб­ли­ру­ю­щий рас­кры­ва­ю­щи­е­ся спис­ки частых вопро­сов, очи­щен­ный от лома­ю­щих син­так­сис HTML-тегов).

Фильтрация, UX и работа с сессионными данными

Вме­сто ста­рой систе­мы пере­клю­че­ния вкла­док, кото­рая скры­ва­ла часть интер­фей­са, в v3 при­ме­не­на сквоз­ная филь­тра­ция на базе JS-аккордеонов:

  • Свод­ная панель ста­ти­сти­ки: Высту­па­ет в роли интер­ак­тив­но­го филь­тра. Клик по кноп­ке-счет­чи­ку «Забло­ки­ро­ва­но» веша­ет триг­гер на MutationObserver и CSS-класс, мгно­вен­но скры­вая кар­точ­ки со ста­ту­сом success и отоб­ра­жая толь­ко про­блем­ные хосты. Повтор­ный клик сбра­сы­ва­ет мас­ку фильтра.
  • Управ­ле­ние исто­ри­ей (LocalStorage): Логи­ка изме­не­на с поте­сто­вой на сес­си­он­ную. Ранее каж­дый про­гон пере­за­пи­сы­вал стек исто­рии из 3 эле­мен­тов. Теперь сущ­ность currentSessionEntry акку­му­ли­ру­ет дан­ные теку­щей сес­сии: если поль­зо­ва­тель выпол­нил тест доступ­но­сти, а затем – тест ско­ро­сти, дан­ные объ­еди­ня­ют­ся в один лог-объ­ект с вре­мен­ной меткой.

Заключение и коммерческая интеграция

Релиз v3 поз­во­лил изо­ли­ро­вать код, решить про­бле­мы с бло­ки­ров­кой сете­вых пото­ков в бра­у­зе­ре и под­го­то­вить плат­фор­му к высо­ко­му поис­ко­во­му тра­фи­ку. Одна­ко, если резуль­та­ты тестов в вашем бра­у­зе­ре ста­биль­но воз­вра­ща­ют ста­тус Таймаут, Заблокировано или фик­си­ру­ют кри­ти­че­ское паде­ние ско­ро­сти через зару­беж­ные туннель-шлю­зы – про­бле­ма лежит на уровне марш­ру­ти­за­ции ваше­го теку­ще­го провайдера.

Я зани­ма­юсь про­ек­ти­ро­ва­ни­ем и сбор­кой аппа­рат­ных роу­те­ров с интел­лек­ту­аль­ным split-tunneling обхо­дом бло­ки­ро­вок на сете­вом уровне (без необ­хо­ди­мо­сти дер­жать вклю­чен­ны­ми неста­биль­ные туннель-кли­ен­ты на теле­фо­нах и компьютерах).

Если вам тре­бу­ет­ся ста­биль­ный доступ к YouTube в 4K, Instagram и рабо­чим зару­беж­ным сер­ви­сам на всех домаш­них устрой­ствах сра­зу (вклю­чая Smart TV и кон­со­ли) – вы може­те зака­зать у меня инди­ви­ду­аль­ную настрой­ку роу­те­ра Netcraze. Для ана­ли­за вашей сете­вой кон­фи­гу­ра­ции и под­бо­ра обо­ру­до­ва­ния свя­жи­тесь со мной напря­мую через фор­му на сай­те или напи­ши­те в Директ. Пер­вич­ный раз­бор вашей про­бле­мы – бесплатный.