如何为网站提供离线支持

时间:2018-05-30 10:29:40

标签: javascript php

我正在开发一个使用PHP / MySQL进行杂货店的销售网站。

我看到一些网站可以重新加载整个网站,即使没有互联网访问也可以工作。 例如,在第一次,我去了abc.com,一切正常。但在那之后,我关闭了网站,断开了网络连接(我拔掉了电缆),然后再次访问网站。它仍然存在并装载一切。他们怎么能这样做?

对于产品列表,我知道需要将其保存在本地存储或缓存中,以便我可以重复使用它。但是加载网站的CSS,HTML代码,javascript代码呢?

希望你理解,抱歉我的英语不好。

1 个答案:

答案 0 :(得分:0)

这绝不会为您的网站提供完整的离线支持,您需要查看您的用例以及您希望离线的内容并计划您希望如何处理它。

这只是设置服务工作者的基本代码,这是获得离线支持的第一步

  

https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API/Using_Service_Workers

     

https://developer.mozilla.org/en-US/Add-ons/WebExtensions/manifest.json

     

https://developers.google.com/web/fundamentals/codelabs/offline/

<强> index.js

// Register the ServiceWorker
navigator.serviceWorker.register('service-worker.js', {
  scope: '.'
}).then(function(registration) {
  // The service worker has been registered!
});

<强>服务worker.js

 self.addEventListener('fetch', function(event) {
  if(event.request.url.indexOf("download-file") !== -1) {
    event.respondWith(event.request.formData().then(function (formdata){
      var filename = formdata.get("filename");
      var body = formdata.get("filebody");
      var response = new Response(body);
      response.headers.append('Content-Disposition', 'attachment; filename="' + filename + '"');
        return response;
      }));
    }
});
  

https://hacks.mozilla.org/2015/11/offline-service-workers/

本教程应该让您了解提供离线支持所需的内容