所以我建立了一个服务工作者,它缓存了网站文件(在devtools上检查了它,它们被缓存在IndexedDB和Cache Storage中。
我正在使用工作箱,并且做了以下事情:
1)在所有必填变量/常量之后,我就在我的nodejs服务器(index.js)中使用了它:
const https = require('https');
const fs = require('fs');
var path = require('path');
const express = require('express');
const app = express();
const router = express.Router();
const pool = require('./mysqldb.js');
const pathView = __dirname + "/views/";
const IMGPath = "/public";
var bodyParser = require("body-parser");
const listenPort = 8010;
const workboxBuild = require('workbox-build');
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
app.set('view engine', 'ejs');
app.use(express.static('public'));
app.use('/public', express.static('public'));
app.use(express.static('views'));
app.use('/views',express.static('views'));
router.use(function (req, res, next) {
next();
});
router.get('/', function (req, res) {
res.render(pathView + 'home.ejs', { msg:" > " });
});//and few more .ejs files just like this one
app.use( "/", router);
app.use("*",function(req,res){
res.setHeader('Content-Type', 'text/html');
res.status(404).send('Page introuvable !');
});
app.listen(listenPort, function () {
console.log('PWA listening on port ' + listenPort );
});
const buildSW = () => {
return workboxBuild.generateSW({
globDirectory: '/var/www/ww1sites.app/emil/NETWORLD/makenavbar/networld/samples/networldfinalv3/',
globPatterns: [
'**\/*.{html,json,js,css,ejs}',
],
swDest: '/var/www/ww1sites.app/emil/NETWORLD/makenavbar/networld/samples/networldfinalv3/public/ServiceWorker.js',
clientsClaim: true,
skipWaiting: true
});
}
buildSW();
https.createServer(options, app).listen(8000);
此buildSW()生成了具有以下内容的ServiceWorker.js文件:
importScripts("https://storage.googleapis.com/workbox-cdn/releases/3.6.2/workbox-sw.js");
workbox.skipWaiting();
workbox.clientsClaim();
self.__precacheManifest = [
{
"url": "index.js",
"revision": "09b1cd28e310f1e9aed3d11c967e36bf"
},
{
"url": "mysqldb.js",
"revision": "2f375ec22385cde075c3027a45f712fe"
},
{
"url": "public/addSW.js",
"revision": "db7d09ac05f8d7da77a7bccbdb037f91"
},
{
"url": "public/manifest.json",
"revision": "0addc89535552310fe57e848156eba13"
},
{
"url": "public/TOKEO-ServiceWorker.js",
"revision": "c7972d42d60771b41f1499491c3632a6"
},
{
"url": "views/about.ejs",
"revision": "11d729194a0669e3bbc938351eba5d00"
},
{
"url": "views/details.ejs",
"revision": "881d8ca1f2aacfc1617c09e3cf7364f0"
},
{
"url": "views/head.ejs",
"revision": "eaa0f2065cf822351c1f2490f9380e30"
},
{
"url": "views/home.ejs",
"revision": "7e50eec344ce4d01730894ef1d637d4d"
},
{
"url": "views/home1.ejs",
"revision": "a34ea6e5245b45aefba102dab23f68ac"
},
{
"url": "views/map.ejs",
"revision": "c3942a2a8ac5b713d63c53616676974a"
},
{
"url": "views/mapbox-script.ejs",
"revision": "1363899a94e5cb63333f8c79886cdf1b"
},
{
"url": "views/navbar.ejs",
"revision": "97aacd7b7705e72ed7696673412b96e1"
},
{
"url": "views/scripts.ejs",
"revision": "15c88be24be624a683f7be97fd8abcce"
},
{
"url": "workbox-config.js",
"revision": "20dcffa419f1b8c9e06c630df4821446"
}
].concat(self.__precacheManifest || []);
workbox.precaching.suppressWarnings();
workbox.precaching.precacheAndRoute(self.__precacheManifest, {});
所有文件都按照我所说的进行了缓存,但是,我意识到在IndexedDB中有一个小东西,node.js和mysqldb.js被缓存了,但是在缓存存储中却没有。我认为这很奇怪。 当我单击网页上的按钮或其他内容后从Devtools脱机时,它为我提供了标准的缺少Internet连接页面,并且Cache Storage,IndexedDB,ServiceWorker.js和manifest.json从devtools中消失了,它们是“全部删除。
我该怎么办? 帮助我了解一件事,如果我不缓存index.js(nodejs服务器),我将无法使网站脱机工作,或者即使没有缓存nodejs服务器也可以做到这一点? / p>
项目结构如下:
PROJECT|--index.js
|--mysqldb.js
|--public|--addSW.js(this is the script that I used to register the servic worker to the first page that I access on the website(I places it in the home.ejs just before the </body> with a <script src=... /> and it contains only the clasic&standard registration for a service worker)
|--manifest.json
|--ServiceWorker.js
|--views|--home.ejs
|--home1.ejs
|--scripts.ejs
|--navbar.ejs
|--map.ejs
|--about.ejs
|--details.ejs
|--head.ejs
我要做的就是让该应用程序离线运行。请帮助我...