工作框范围请求

在发出请求时,可以设置 range 标头,以告知服务器仅返回完整请求的一部分。这对于某些文件(例如视频文件)非常有用,用户可能会更改视频的播放位置。

此模块的用途是什么?

在某些情况下,您可能希望传送缓存的文件,但浏览器设置了 range 标头。一般情况下,该标头将被忽略。

此模块将读取缓存的响应并返回指定的数据范围。

基本用法

如要使用 Workbox 范围请求,您可以将该插件添加到要针对范围请求检查的策略中。

import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
import {RangeRequestsPlugin} from 'workbox-range-requests';

registerRoute(
  ({url}) => url.pathname.endsWith('.mp4'),
  new CacheFirst({
    plugins: [
      new RangeRequestsPlugin(),
    ],
  });
);

高级用法

如果您想在插件之外使用此逻辑,则可以使用 createPartialResponse() 函数。

import {createPartialResponse} from 'workbox-range-requests';

createPartialResponse(request, cachedResponse);

如需了解详情,请参阅参考文档

类型

RangeRequestsPlugin

范围请求插件可让您通过缓存的响应轻松实现带有“Range”标头的请求。

为此,它会拦截 cachedResponseWillBeUsed 插件回调并返回已缓存响应正文的相应子集。

属性

方法

createPartialResponse()

workbox-range-requests.createPartialResponse(
  request: Request,
  originalResponse: Response,
)

如果给定一个 RequestResponse 对象作为输入,这将返回一个针对新 Response 的 promise。

如果原始 Response 已包含部分内容(即其状态为 206),则假设它已满足 Range: 要求,并按原样返回。

参数

  • request

    请求

    请求,应包含 Range: 标头。

  • originalResponse

    响应

    响应。

返回

  • Promise<Response>

    206 Partial Content 响应(响应正文设置为请求的 Range: 标头指定的内容切片);如果无法满足 Range: 标头的条件,则为 416 Range Not Satisfiable 响应。