Телеграм:@camouf_ruПочта:mihail@bazarow.ru

Серия 4: Cмешанный режим работы, онлайн и оффлайн приложение

Просмотров: 570

Делаем приложение универсальным: если на устройстве есть сеть, показываем онлайн версию. Если интернет соединения нет, показывам "закешированную" версию приложения.
План серии:

  • Смешанный режим работы, онлайн и оффлайн приложение
  • Проверяем наличие сети плагином network information на отсутсвие или наличие сети
  • В соотвествии с этим знанием перенаправляем на нужный адрес (внутрь www или на внешний сайт)

Все серии

Комментарии к видео

Михаил Базаров 10.04.2022
Дополнение.
Если хотите что бы офлайн режим включался и после загрузки приложения.
Например:
- если пользователь уже попал на на главную страницу;
- у него пропала сеть;
- он попробовал перейти на другую страницу;
Получит туже, не красивую ошибку.

Что бы и в таком случае отдать оффлайн страницу, добавляем плагин inappbrowser
На индексной странице добавляем:
Код
<script>         document.addEventListener("deviceready", onDeviceReady, false);         function onDeviceReady() {             document.addEventListener("offline", onOffline, false);             function onOffline(e) {                 e.preventDefault();                 var src = '/offline.html';                 var target = '_self';                 var option = "location=no, toolbar=no, zoom=no, hidden=yes, hardwareback=no, hideurlbar=yes,hidenavigationbuttons=yes";                 var ref = cordova.InAppBrowser.open(src, target, option);             }             var target = "_blank";             var options = "location=no,toolbar=no,hideurlbar=yes,hidenavigationbuttons=yes,lefttoright=yes,zoom=no";             var opensite = cordova.InAppBrowser.open('https://ВАШ_САЙТ/', target, options);         }     </script>

На локальной странице offline.html делаем, собственно оффлайн странику с красивой версткой или алертом.
На нейже, можно добавить проверку события (document.addEventListener("ofnline", onOnline, false);) - появления сети и автоматически возвращать пользователя на сайт.