双期函数依赖
运行时和编译期的函数依赖,其中的内容会被写入到 sw 中。
该配置项用于放置所有同时在浏览器和 NodeJs 环境下执行的工具函数。
对于每一项配置 <KEY>: { <runOnBrowser>, <runOnNode> }
:<KEY>
是函数名,<runOnBrowser>
是在浏览器环境下执行的代码,<runOnNode>
是在 NodeJs 环境下执行的代码。
对于在浏览器环境下执行的代码,可以像 RuntimeDep
一样引用其它运行时的环境变量、依赖函数等内容。
对于在 NodeJs 环境下执行的代码,可以使用 this
调用 <runOnBrowser>
(前提是 <runOnBrowser>
中没有依赖浏览器环境的代码)。
<runOnBrowser>
和 <runOnNode>
中的代码的行为应当完全一致。注意:此处说的行为一致是两者应当产生相同的副作用,内部具体实现可以不一样。
例:
import {defineCrossDep} from 'swpp-backends'
defineCrossDep({
example: { // 不推荐!双端的行为不完全一致!但如果是为了进行代码测试,可以临时这么干。
runOnBrowser: () => console.log('hello'),
runOnNode: () => console.log('world')
},
invokeExample: {
runOnBrowser: () => console.log('hello world'),
runOnNode() {
this.runOnBrowser()
}
}
})
isFetchSuccessful
类型 | 说明 |
---|---|
(response: Response) => boolean | 检查一个请求是否成功 |
该项用于通过 Response
检查拉取是否成功,默认通过状态码判断(若状态码返回 200
301
302
307
308
会被视为成功)。
请注意!!!缓存、URL 竞速、备用 URL 等功能均会使用该函数判断某个请求是否成功,返回错误地返回 true
或 false
会导致功能异常:
- 对于缓存:若错误地返回了
true
会导致将失败的响应缓存到本地,若错误地返回了false
将会导致结果不被缓存。 - 对于 URL 竞速和备用 URL:若错误地返回了
true
会导致将一个失败的响应视为成功响应作为最终的响应结果;若错误地返回了false
会错失正确的响应,可能导致最终响应失败。
部分 CDN 响应错误时不使用状态码进行标记,而是使用响应体中的内容,此时有下面几种解决方案:
- 避开该 CDN,使用其它 CDN 进行替代
- 对于该 CDN 的资源不启用缓存等功能
- 自定义
isFetchSuccessful
,在函数中读取响应体的数据判断请求是否成功。
需要特别注意的是,如果需要在该函数中读取 body,请先克隆响应体,然后读取克隆后的结果,否则会导致后续的流程无法读取响应体内容。
matchCacheRule
类型 | 说明 | 默认值 |
---|---|---|
(url: URL) => number | false | null | undefined | 判断一个资源是否需要缓存 | () => false |
该项用于判断一个资源是否需要被前端缓存,其中各个返回值的含义如下:
false
null
undefined
或0
:表示不需要缓存- 正数:表示需要缓存,缓存类型为定时缓存,单位为毫秒,超过指定时间后缓存自动失效
- 负数:表示需要缓存,缓存类型为永久缓存,仅能通过增量更新失效
normalizeUrl
类型 | 说明 | 默认值 |
---|---|---|
(url: string) => string | 归一化 URL | 省略 |
该项用于将链接进行归一化,归一化的作用是防止目标相同但连接形式不同的资源被重复缓存。默认的实现会对 HTML 资源的 URL 进行处理:
- 如果链接以
/index.html
结尾会被替换为/
- 如果链接以
/xxx.html
结尾会被替换为/xxx
- 否则保持原链接
matchUpdateRule
类型 | 说明 | 默认值 |
---|---|---|
(exp: UpdateChangeExp) => ((url: string) => boolean | undefined | null) | 匹配缓存更新规则 | 省略 |
该项用于判断一个 UpdateChangeExp
应当如何被程序理解,返回一个函数,该函数用于判断指定资源是否应该被刷新。
内置的规则已经可以满足大多数情况的要求,一般只有需要自定义新的规则时才需要修改该项,具体的实现可以参考 源代码 (opens in a new tab)。