在网络应用程序中保存用于离线访问的网页 [英] Save webpages for offline access in web app

问题描述

我有一个网络应用程序（sencha / phonegap），其中包括允许用户点击链接到维基百科文章的按钮的功能。如果设备具有互联网访问权限，这显然可以正常工作，但是当应用程序处于离线状态时，我会收到许多请求以使应用程序工作。为此，我想给用户下载链接的文章/网页以进行离线访问的选项。当设备没有互联网访问时，应用程序将显示保存的版本（可能是陈旧的/过时的，但比没有更好）。什么是可能的方法来完成这项任务？

我的第一个想法是以某种方式使用html清单来缓存手机浏览器中的页面，这在Android浏览器上是可能的，但iOS显然有一个5MB的浏览器缓存限制 - 太小了。

我的下一个想法是保存所需的html&关联文件并将其捆绑在应用程序内。但这似乎是一个相当麻烦的方法，该应用程序变得比它需要的更大，网页已经过时到安装应用程序的日期。

使用javascript ，是否可以下载网页，然后我可以保存（例如，在SD卡上）进行访问？

还是有更优雅的方法？ / p>

如果有任何人可以指出正确的方向，将不胜感激。

解决方案

在纯JavaScript中，您可以 Ajax 请求下载页面。然后，您可以使用 FileWriter 将responseText写入文件系统上的文件。但是，这对于图像来说不会帮助你。您需要使用 FileTransfer.download（）命令获取二进制图像文件。

如果我是你，我会：

1. 使用AJAX下载html。


2. 解析html寻找图片。


3. 使用FileTransfer.download获取图像。

I have a web app (sencha/phonegap) that includes a feature allowing users to click on buttons that link to Wikipedia articles. This obviously works fine if the device has internet access, but I get numerous requests to make the app work when the app is offline too. To accomplish this, I'd like to give the user the option to download the linked articles/webpages for offline access. When the device does not have internet access, the app would instead display the saved version (which might be stale/out-of-date, but is better than nothing). What are possible ways to accomplish this task?

My first thought was to somehow use the html manifest to cache the pages in the phone's browser, which sounds possible on the Android browser, but iOS apparently has a 5MB browser cache limit - too small.

My next thought was to save the needed html & associated files and bundle them up inside the app. But this seems a rather cumbersome approach, the app becomes much larger than it needs to be, and the webpages are stale back to the date the app was installed.

Using javascript, is it possible to download webpages, which I could then save (on the sd card, for example) for access later?

Or is there a more elegant approach?

If anyone could point me in the right direction it would be much appreciated.

解决方案

In pure Javascript you can make an Ajax request to download a page. Then you can use the FileWriter to write the responseText to a file on the file system. However, that won't help you when it comes to images. You'll need to use the FileTransfer.download() command to get the binary image files.

If I were you I'd:

1. Use AJAX to download the html.
2. Parse the html looking for images.
3. Use FileTransfer.download to get the images.

这篇关于在网络应用程序中保存用于离线访问的网页的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！