javascript - If (Internet == available) in HTML5 app manifest offline app

Question

我想为登录页面设置条件，如果互联网连接可用，则检查服务器数据库，否则检查本地存储。

我试图通过 AJAX 调用来检查这一点，但是当从应用缓存加载页面时，它总是显示我已连接到 Internet。我对 list 文件中的回退部分了解一些，但我不知道如何在我的案例中使用它。

离线时如何处理事件？

Answer 1

您可以使用返回 bool 值的 Navigator.onLine 轻松获取客户端的互联网状态。

if (!navigator.onLine) {
   //Browser is offline, pull data from localStorage
} else {
   //Browser is online, pull data through AJAX
}

您还可以将它绑定(bind)到一个事件监听器，以便您可以动态更改数据源:

window.addEventListener('offline', function(e) { 
   //Browser is offline, pull data from localStorage
});

引用: https://developer.mozilla.org/en-US/docs/Web/API/NavigatorOnLine/onLine

发帖时，this function is supported适用于 IE11、IE Edge、Firefox 51+ Chrome 49+、Safari 10+、iOS 9.3+、Android 浏览器 4.4+ 和 Chrome for Android 57+

---

更新 看来我误解了你原来的问题。检查 list 文件后。从 localStorage 提取数据的代码应该放在 FALLBACK 部分。您应该将 localStorage 函数放入 offline.html 文件中。

FALLBACK:
/ offline.html

引用:https://developer.mozilla.org/en-US/docs/Web/HTML/Using_the_application_cache