sw-router
PWA 全称是 这里也主要介绍一下它。 下载npm install sw-router 由于是在 SW 中使用,所以一般的 CMD/ES6 模块 写法是不能用的。推荐是直接到 importScripts('./index.js'); 使用使用 SW 缓存功能其实很简单,你不需要写啥 self.addEventListener('fetch', (event)=>{ // doSth()}); 不过,如果你要做的是比较大业务,单单使用一个 fetch 就有点 “势单力薄”。所以,本库还是基于最小业务原则的出发点来进行创作的。 通过导入之后,sw-router 会 SW 作用域下绑定一个 路由绑定利用 Router 对象进行路由绑定和 express router 类似,所以上手起来也不是特别大的问题: Router.get('/*.js',(event,req)=>{ console.log('to save js files'); // doSth()}).get('/*.png',(event,req)=>{ console.log('capture PNG:' + req.toString()); // doSth()}).get('/.*',(event,req)=>{ console.log('capture others request'); // doSth()}) 它以链式的方法,来提供 restful 形式的路由注册。常用方法有:
使用格式如下(5 种方法使用都一样): Router.get('/*.js',(event,req)=>{ ...}) 其中,event,req 参数分别为:
self.addEventListener('fetch', (event)=>{ // doSth()});
当然,这里不仅仅只提供了路由绑定的功能,还提供了缓存的做法。 缓存文件缓存的方法也绑定在 Router.get('/*.js',(event,req)=>{ console.log('to save js files'); Router.save('test',event);}) 它的格式为: Router.save(cacheName, event);
Router.get('/*.js',(event,req)=>{ console.log('to save js files'); Router.save(event);})
上面,大致介绍了路由注册这一块内容,但是,如果使用你注册好的路由分发系统呢? 投入生产路由系统真正接入 SW 是通过 Router.get('/*.js',(event,req)=>{ console.log('save js files'); Router.save('v1',event);}).get('/*.png',(event,req)=>{ console.log('capture PNG:' + req.toString()); Router.save('v1',event);}).get('/.*',(event,req)=>{ console.log('capture all request');})self.addEventListener('fetch', function(event) { // start to listen Router.watch(event);}); 注意,watch 只能传入 event 参数,其它的就不要乱传了。 英文文档反馈如果在使用库的同时,遇到什么问题,可以去 issue提一提。鄙人一定会及时处理并回复。 作者LicenseISC |
|