(HTML5) 浏览器中的离线模式应用程序可能吗?
是否可以在浏览器中内部构建应用程序?应用程序意味着:
1 浏览器和远程应用程序服务器之间存在连接(在线模式):
- 应用程序以典型的基于 Web 的模式运行
- 应用程序存储必要数据在离线存储中,在离线模式下使用 (2)
- 当从离线模式恢复到在线模式时,应用程序将数据(在离线模式下捕获)同步/推送回服务器
2 无连接< /strong>(离线模式)在浏览器和远程应用程序服务器之间:
- 应用程序仍将运行(javascript?)
- 应用程序将向用户呈现数据(离线存储)
- 应用程序可以接受用户的输入(并存储/附加在离线存储中)
这可能吗?如果答案是肯定的,是否正在构建任何(Ruby/Python/PHP)框架?
谢谢
Is it possible to build an application inside in browser? An application means:
1 Where there is connection (online mode) between the browser and an remote application server:
- the application runs in typical web-based mode
- the application stores necessary data in offline storage, to be used in offline mode (2)
- the application sync/push data (captured during offline mode) back to the server when it is resumed from offline mode back to online mode
2 Where there is no connection (offline mode) between the browser and an remote application server:
- the application will still run (javascript?)
- the application will present data (which is stored offline) to user
- the application can accept input from user (and store/append in offline storage)
Is this possible? If the answer is a yes, is there any (Ruby/Python/PHP) framework being built?
Thanks
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(6)
是的,这是可能的。
您需要用 Javascript 编写应用程序,并以某种方式检测浏览器是否处于离线模式(最简单的是偶尔轮询服务器)。 (编辑:请参阅评论以获取更好的检测离线模式的方法)
确保您的应用程序仅包含静态 HTML、Js 和 CSS 文件(或在脚本中手动设置缓存策略,以便您的浏览器会在离线模式)。页面的更新是通过 JS DOM 操作完成的,而不是通过服务器(诸如 ExtJS http://www.extjs. com 将在这里为您提供帮助)
对于存储,请使用 PersistJS 等模块 ( http: //github.com/jeremydurham/persist-js ),它使用浏览器的本地存储来跟踪数据。当连接恢复时,与服务器同步。
您需要预先缓存所使用的图像和其他资源,否则如果您以前没有使用过它们,它们在离线模式下将不可用。
您需要预先缓存所使用的图像和其他资源,否则它们将无法使用
再次强调:您的应用程序的大部分内容需要使用 JavaScript,如果服务器无法访问,PHP/Ruby/Python 框架对您的帮助不大。服务器可能会尽可能简单,使用类似 REST 的 AJAX API 来存储和加载数据。
Yes, that is possible.
You need to write the application in Javascript, and detect somehow whether the browser is in offline mode (simplest is to poll a server once in a while). (Edit: see comments for a better way to detect offline mode)
Make sure that your application consists of only static HTML, Js and CSS files (or set the caching policy manually in your script so that your browser will remember them in offline mode). Updates to the page are done through JS DOM manipulation, not through the server (a framework such as ExtJS http://www.extjs.com will help you here)
For storage, use a module such as PersistJS ( http://github.com/jeremydurham/persist-js ), which uses the local storage of the browser to keep track of data. When connection is restored, synchronize with the server.
You need to pre-cache images and other assets used, otherwse they will be unavailable in offline mode if you didn't use them before.
Again: the bulk of your app needs to be in javascript, a PHP/Ruby/Python framework will help you little if the server is unreachable. The server is probably kept as simple as possible, a REST-like AJAX API to store and load data.
Mark Pilgrim 的(在线)书中的“让我们离线吧”章节深入了解 HTML5 是关于使用 HTML5 技术编写离线 Web 应用程序的非常好的概述。
注意:由于 Mark Pilgrim 的原始 Dive Into HTML5 链接似乎已关闭。
现在可以在此处以及其他地方找到副本。
The "Let's Take This Offline" chapter in Mark Pilgrim's (online) book Dive Into HTML5 is a very nice overview of writing offline web apps with HTML5 technologies.
Note: Since Mark Pilgrim's original Dive Into HTML5 link seems to be down.
Copies can now be found here among other places.
杰克·阿奇博尔德(Jake Archibald)撰写了《离线食谱》。 ServiceWorker 的现代(2014 年 12 月 9 日)且良好的方法:
http://jakearchibald.com/2014/offline -食谱/
Jake Archibald wrote "The offline cookbook". A modern (9 December 2014) and nice approach with ServiceWorker:
http://jakearchibald.com/2014/offline-cookbook/
2018 年的答案是利用 Service Worker 并构建渐进式 Web 应用程序:
https://developers.google.com/web/progressive-web-apps/< /a>
The answer in 2018 is to leverage the service worker, and to build a Progressive Web App:
https://developers.google.com/web/progressive-web-apps/
我也在寻找这个,我发现了 abt HTML5 离线 Web 应用。还没试过
i was looking for this also, i found out abt HTML5 Offline Web Apps. havent tried it tho
查看 Google Gears,http://code.google.com/apis/gears/。尽管它们已被 HTML5 淘汰。不过,现在正在推的 HTML5 似乎是 Google Gears。
Have a look at Google Gears, http://code.google.com/apis/gears/. Although they have been phased out in favour of HTML5. However, it seems that what is being pushed as HTML5 is Google Gears.