javascript - 无网络环境下网页系统开发技术选择？

Question

开发的网页系统，客户期望在无网络的环境下也能访问且存储数据，用什么技术实现呢？

开发了网页项目，例如OA系统，客户的作业环境是无网络的，应该用什么技术能够实现无网络的情况下，也能访问这个网页项目，且存储数据，在有网络的时候，同步存储的数据到服务器上呢？

Answer 1

了解一下 PWA ？ - 离线和后台操作 - 渐进式 Web 应用（PWA） | MDN
但是需要项目开启HTTPS。

Answer 2

可以使用Electron + vue, 无网络把数据存储到本地，有网络的时候推送数据到服务端。无网络是无法和服务端通信的

这种需求很不合理，建议规避或从其他方面解决。

Answer 3

在无网络环境下开发网页系统，你可以考虑以下几种技术来实现数据存储和同步：

1. 本地存储：使用浏览器的本地存储机制，如localStorage或IndexedDB，来存储数据。这些数据会在用户的浏览器中保存，即使在没有网络的情况下也能访问。当网络恢复时，可以将本地存储的数据同步到服务器。
2. 离线Web应用：利用Service Workers和Cache API来创建一个离线Web应用。Service Workers允许你在用户的浏览器后台运行脚本，而Cache API则允许你缓存资源并在需要时提供它们。通过这种方式，你可以确保用户在没有网络的情况下仍然可以访问你的网页系统。
3. WebSQL或IndexedDB：如果你需要存储更复杂的数据结构，可以考虑使用WebSQL（已被废弃）或IndexedDB。这些技术允许你在浏览器中存储大量结构化数据。
4. 数据同步：在有网络的情况下，你可以使用Ajax、Fetch API、WebSocket或其他技术将数据从本地存储同步到服务器。确保在同步数据时处理冲突和版本控制，以避免数据不一致。
5. 渐进式Web应用（PWA）：考虑使用PWA技术来增强你的应用性能。PWA结合了离线Web应用和Service Workers，为用户提供接近原生应用的体验。

请注意，无网络环境下的数据存储和同步是一个复杂的问题，需要仔细规划和设计。在实现过程中，确保考虑到数据安全性、隐私保护、冲突解决和用户体验等方面。