使用html5 manifest ajax预加载页面以缓存它们

I'm currently having a situation where I have online courses website. But I want it to be accessible locally offline. I added a manifest for all topics in the courses. And if they are visited, they are cached locally.

我目前有一个情况,我有在线课程网站。但我希望它可以在本地离线访问。我在课程中添加了所有主题的清单。如果访问它们,它们将在本地缓存。

However, I now want to add a button "Make offline available" to preload all these pages without having to visit them first manually.

但是,我现在想要添加一个“使离线可用”按钮来预加载所有这些页面,而无需先手动访问它们。

I tried loading all these files by multiple ajax-calls triggered by the button. They would $.get() the page, and I was hoping that the browser would cache them. However, it does not seem to work. It seems that the browser doesn't interpret pages it doesn't show...

我尝试通过按钮触发的多个ajax调用加载所有这些文件。他们会$ .get()页面,我希望浏览器会缓存它们。但是,它似乎不起作用。似乎浏览器不解释它没有显示的页面......

Is there a way for doing this by using javascript and manifests?

有没有办法通过使用JavaScript和清单来做到这一点?

Thanks!

3 个解决方案

#1

Manifests don't really work the way you want, I believe. The entries in your manifest file will be cached in the background. The user never has to visit the page for it to be cached.

我相信,清单并不能按你想要的方式运作。清单文件中的条目将在后台缓存。用户永远不必访问该页面以进行缓存。

Here's a great resource for html5 manifests: http://diveintohtml5.ep.io/offline.html

这是html5清单的一个很好的资源:http://diveintohtml5.ep.io/offline.html

#2

you can send ajax requests and pre fetch the page contents and save them in hidden divs. you can write handlers for events triggering page navigation and show the corresponding divs when requested.

您可以发送ajax请求并预先获取页面内容并将其保存在隐藏的div中。您可以为触发页面导航的事件编写处理程序,并在请求时显示相应的div。

#3

Yes it is. But all requests for resources in manifest-file does not have any parameters, p.e.:

是的。但是清单文件中的所有资源请求都没有任何参数,例如:

CACHE MANIFEST

CACHE:
/cgi-bin/imgrequest.cgi     # OK
/cgi-bin/request.cgi?id=123 # Wrong, it does not work

#1