路由器将请求与路由匹配，然后处理该请求（即提供响应）的过程。
开发人员可以通过三种方式将请求与Workbox路由相匹配。
- 字符串
- 正则表达式
- 回调函数
我们首先看看如何使用这三种方法进行匹配，然后再讨论请求的处理，handler变量将在这里作为占位符。
用字符串匹配路由
将请求URL与路由字符串进行比较，如果它们相等，则请求将使用该路由handler。
我们定义一个路由'/logo.png'，如下：
workbox.routing.registerRoute(
'/logo.png',
handler
);
唯一需要注意的是，这只会与源站上的请求匹配。如果有一个单独的站点的URL是https://some-other-origin.com/logo.png，那么这个路由就不匹配了，因为在大多数情况下，这不是预期的。所以，您需要定义整个URL来匹配：
workbox.routing.registerRoute(
'https://some-other-origin.com/logo.png',
handler
);
用正则表达式匹配路由
正则表达式是根据网站的完整的URL匹配的，如果有匹配，handler会被触发；
下面提供了一些灵活使用的例子，如匹配文件扩展名：
workbox.routing.registerRoute(
new RegExp('\\.js$'),
jsHandler
);
workbox.routing.registerRoute(
new RegExp('\\.css$'),
cssHandler
);
或者可以编写特定URL格式的正则表达式：例如，遵循格式/blog/<year>/<month>/<post title slug>的博客
workbox.routing.registerRoute(
new RegExp('/blog/\\d{4}/\\d{2}/.+'),
handler
);
就像字符串匹配一样，不同来源的请求也会得到不同的处理。正则表达式必须从URL的开头匹配，而不是与URL的任何部分匹配，防止在跨源请求时触发handler.
例如，前一个正则表达式new regexp（“/blog/\d/\4/\d 2/.+”）与https://some other origin.com/blog/<year>/<month>/<post title slug>的请求不匹配。如果我们想要这个路由与拥有相同路径模式的跨源请求相匹配，那么可以使用带有通配符（.+）的正则表达式：
workbox.routing.registerRoute(
new RegExp('.+/blog/\\d{4}/\\d{2}/.+'),
handler
);
用回调函数匹配路由
为了让开发人员随心所欲的匹配请求，我们提供了一个函数，该函数可以任意定义。
回调将接收一个函数对象。
const matchFunction = ({url, event}) => {
// Return true if the route should match
return false;
};
workbox.routing.registerRoute(
matchFunction,
handler
);
怎么为与路由匹配的请求提供响应呢？
这里提供了两种方法：
- 使用Workbox.Strategies提供的缓存策略。
- 提供回调函数，该函数返回一个处理响应的promise
使用缓存策略处理请求
大多数路由都可以通过一种内置的缓存策略来处理
- Stale While Revalidate
此策略优先使用缓存获取数据，于此同时，使用网络响应在后台更新缓存。（如果没有缓存，则会等待网络响应）。这是一个相当安全的策略，因为这意味着用户定期更新缓存。这种策略的缺点是，它总是从网络请求资源，消耗用户带宽。
- Network First
优先从网络请求获取数据，并将其保存在缓存中，如果请求是失败的，则从上次缓存中获取数据。
- Cache First
优先从缓存中获取数据，如果请求不存在缓存中，则使用网络请求，并在传递到浏览器之前将任何有效响应添加到缓存中。
- Network Only
强制所有的数据都通过网络请求获取
- Cache Only
强制所有的数据都通过缓存获取
简单使用示例：
workbox.routing.registerRoute(
match,
new workbox.strategies.StaleWhileRevalidate()
);
workbox.routing.registerRoute(
match,
new workbox.strategies.NetworkFirst()
);
workbox.routing.registerRoute(
match,
new workbox.strategies.CacheFirst()
);
workbox.routing.registerRoute(
match,
new workbox.strategies.NetworkOnly()
);
workbox.routing.registerRoute(
match,
new workbox.strategies.CacheOnly()
);
针对每个缓存策略，您都可以通过添加插件的形式自定义缓存某些选项，以便确保其更安全（例如限制缓存的时间或大小）。
new workbox.strategies.StaleWhileRevalidate({
// Use a custom cache for this route.
cacheName: 'my-cache-name',
// Add an array of custom plugins ...
plugins: [
...
]
});
使用自定义的回调函数处理请求
在某些情况下，您可能希望使用自己定义的策略来响应请求，或者只是使用模板在servicer worker中生成请求。为此，您可以提供一个async函数，它返回一个响应对象。入参有URL和事件（fetchvent）。
const handler = async ({url, event}) => {
return new Response(`Custom handler response.`);
};
workbox.routing.registerRoute(match, handler);
如果在match回调中返回一个值，它将作为params参数传递到handler回调中。
const match = ({url, event}) => {
return {
name: 'Workbox',
type: 'guide',
};
};
const handler = async ({url, event, params}) => {
// Response will be "A guide to Workbox"
return new Response(
`A ${params.type} to ${params.name}`
);
};
workbox.routing.registerRoute(match, handler);
以上为workbox 官网route-requests章节的搬运，如理解有误，请指正，感谢；
原文： route-requests
