For example, if the url is not match to any API endpoint, we want to return 404 error message.

So first thing, we want to send the request to the server first. If got the response, then we just return it back.

self.addEventListener('fetch', (event) => {

    event.respondWith(
fetch(event.request).then( (response) => {
// fetch the request frist return response;
})
)
});

Then we handle 404 error:

self.addEventListener('fetch', (event) => {

    event.respondWith(
fetch(event.request).then( (response) => {
if(response.status === ){
return fetch('/img/dr-evil.gif');
} return response;
}).catch( () => {
return new Response("Something totally wrong");
})
)
});

[PWA] 6. Hijacking response的更多相关文章

  1. [PWA] 5. Hijacking one type of request

    Previously we saw how to Hijacking all the reqest, but this is not useful. So now we want to see how ...

  2. [PWA] 4. Hijacking Request

    We want to do offline first, the first thing we need to do is we should able to catch the browser re ...

  3. HTTP Response Splitting攻击探究 <转>

    第一小节:HTTP Basics:使用Proxy软件(例如Webscarab)来截断浏览器(客户端)和Server之间的HTTP通信,之后任意篡改得到预期结果即可. 第二小节:HTTP Splitti ...

  4. [Rails] 从 Request 到 Response(1)

    本文翻译自:Rails from Request to Response 系列:个人选择了自己感兴趣的部分进行翻译,需要阅读原文的同学请戳前面的链接. 第一部分 导言(Introduction) 服务 ...

  5. 轻松把你的项目升级到PWA

    什么是PWA PWA(Progressive Web Apps,渐进式网页应用)是Google在2015年推出的项目,致力于通过web app获得类似native app体验的网站. 优点 1.无需客 ...

  6. Angular 学习笔记 ( PWA + App Shell )

    PWA (Progressive Web Apps) 是未来网页设计的方向. 渐进式网站. Angular v5 开始支持 pwa 网站 (所谓支持意思是说有一些 build in 的方法和规范去实现 ...

  7. 前端应该了解的PWA

    一.传统web 应用 当前web应用在移动时代并没有达到其在桌面设备上流行的程度,下面有张图来对比与原生应用之间的差别. 究其原因,无外乎下面不可避免的几点: 移动设备网络限制-不可忽略的加载时间 w ...

  8. 渐进式Web应用(PWA)入门教程(下)

    上篇文章我们对渐进式Web应用(PWA)做了一些基本的介绍. 渐进式Web应用(PWA)入门教程(上) 在这一节中,我们将介绍PWA的原理是什么,它是如何开始工作的. 第一步:使用HTTPS 渐进式W ...

  9. 为 VUE 项目添加 PWA 解决发布后刷新报错问题

    为什么要给 VUE 项目添加 PWA 为什么要添加?因为不管是部署在 IIS,还是 nginx,每次应用部署后,再次访问因为旧的 js 已经不存在,所以页面访问的时候会整个报错,报错的结果就是一个白屏 ...

随机推荐

  1. IE6双倍margin间距解决方案

          问题:在IE6下如果某个标签使用了float属性,同时设置了其外补丁“margin:10px 0 0 10px”可以看出,上边距和左边距同样为10px,但第一个对象距左边有20px. 解决 ...

  2. system.getProperties()

    Properties props=System.getProperties(); //系统属性     System.out.println("Java的运行环境版本:"+prop ...

  3. directsound 应用实例

    sdk里边有个文件夹Samples\C++\XInput\AudioController这个就是

  4. 9张思维导图学习Javascript

    分别归类为: javascript变量 javascript运算符 javascript数组 javascript流程语句 javascript字符串函数 javascript函数基础 javascr ...

  5. dedecms织梦二级菜单的实现方法

    首先,复制代码: 程序代码 {dede:channelartlist typeid='top' cacheid='channelsonlist'} {dede:channel type='son' n ...

  6. 【Linux】常用命令

    一.文件结构     /:       根目录 /bin:    系统所需要的那些命令位于此目录. /boot:   Linux的内核及引导系统程序所需要的文件目录,GRUB或LILO系统引导管理器也 ...

  7. MySql数据库1【概念】

    [mysql] mysql是目前最主流的跨平台.开放源代码的关系型数据库,由瑞曲的mysql ab公司开发,已经被SUN公司收购,标识是一只名为sakila的海豚,代表mysql的速度.能力.精确优秀 ...

  8. 51中的C语言数据类型

    在标准C语言中基本的数据类型为char,int,short,long,float 和double,而在C51编译器中int和short相同,float和double相同. 说明: (1)类型修饰符si ...

  9. centos升级python到2.7

    最近在阿里云租了一个云主机,打算部署自己的个人网站,但是centos系统的默认Python是2.6版本,打算升级到2.7.3! 查看python的版本 #python  -V Python 2.6.6 ...

  10. codeforces D.Mashmokh and ACM

    题意:给你n和k,然后找出b1, b2, ..., bl(1 ≤ b1 ≤ b2 ≤ ... ≤ bl ≤ n),并且对所有的bi+1%bi==0,问有多少这样的序列? 思路:dp[i][j] 表示长 ...