Saat membuat permintaan, header range
dapat ditetapkan yang memberi tahu
server untuk hanya menampilkan sebagian dari permintaan lengkap. Ini
berguna untuk file tertentu seperti file video, di mana pengguna
dapat mengubah posisi pemutaran video.
Apa fungsi modul ini?
Mungkin ada beberapa skenario saat Anda
ingin menayangkan file yang di-cache
tetapi browser menetapkan header range
. Biasanya header akan diabaikan.
Modul ini akan membaca respons yang di-cache dan menampilkan rentang data yang ditentukan.
Penggunaan Dasar
Anda dapat menggunakan Permintaan Rentang Workbox dengan menambahkan plugin ke strategi yang ingin Anda periksa untuk permintaan rentang.
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(),
],
});
);
Penggunaan Lanjutan
Jika ingin menggunakan logika ini di luar Plugin, Anda
dapat menggunakan fungsi createPartialResponse()
.
import {createPartialResponse} from 'workbox-range-requests';
createPartialResponse(request, cachedResponse);
Untuk mengetahui info selengkapnya, lihat dokumen referensi.
Jenis
RangeRequestsPlugin
Plugin permintaan rentang memudahkan permintaan dengan header 'Rentang' untuk dipenuhi oleh respons yang di-cache.
Hal ini dilakukan dengan mencegat callback plugin cachedResponseWillBeUsed
dan menampilkan subset yang sesuai dari isi respons yang di-cache.
Properti
-
konstruktor
void
Fungsi
constructor
terlihat seperti:() => {...}
-
akan menampilkan
-
Metode
createPartialResponse()
workbox-range-requests.createPartialResponse(
request: Request,
originalResponse: Response,
)
Dengan objek Request
dan Response
sebagai input, ini akan menampilkan
menjanjikan untuk Response
baru.
Jika Response
yang asli sudah berisi sebagian konten (yaitu, memiliki
status 206), hal ini akan mengasumsikan bahwa kode tersebut sudah memenuhi Range:
persyaratan, dan akan mengembalikannya sebagaimana adanya.
Parameter
-
minta
Permintaan
Permintaan, yang harus berisi Rentang: {i>header<i}.
-
originalResponse
Respons
Respons.
Hasil
-
Promise<Response>
Respons
206 Partial Content
, dengan isi respons ditetapkan ke bagian konten yang ditentukan oleh headerRange:
permintaan, atau respons416 Range Not Satisfiable
jika kondisi headerRange:
tidak dapat terpenuhi.