在為 Web 編寫代碼時，有大量可用的 Web API。這個網站列出了您在開發 Web 應用程序或站點時可以使用的所有 API 和接口（對象類型）。

Web API 通常與 JavaScript 一起使用，盡管情況并非總是如此。

這是按照字母排序的。

Background Fetch API

這個 API 提供了可能需要花費很長時間下載的資源下載方法，比如 movies, audio 文件和軟件。

當 Web 應用程序要求用戶下載大文件時，這通常會帶來一個問題，即用戶需要保持與頁面的連接才能完成下載。如果他們失去連接，請關閉選項卡或離開下載停止的頁面。

以前曾經有一個后臺同步下載 API，能夠延遲 service worker 的處理，直到用戶重新處于連接狀態。但是它不能用于長時間運行的任務，例如下載大文件。后臺同步要求 Service Worker 保持活動狀態直到獲取完成，并且為了節省電池壽命并防止在后臺發生不需要的任務，瀏覽器將在某個時候終止任務。

而本文描述的 background fetch API 則不存在這個問題。它為 Web 開發人員創建了一種方法來告訴瀏覽器在后臺執行一些 fetch 操作以進行文件下載，例如當用戶單擊按鈕下載視頻文件時。然后瀏覽器以用戶可見的方式執行提取，向用戶顯示進度并為他們提供取消下載的方法。下載完成后，瀏覽器會打開 Service Worker，此時您的應用程序可以根據需要對響應執行某些操作。

如果用戶在離線狀態下啟動進程，后臺提取 API 將啟用提取。一旦它們連接起來，它就會開始。如果用戶離線，該過程將暫停，直到用戶再次上線。

看個具體的例子。

首先檢查瀏覽器是否支持 background fetch API:

if (!('BackgroundFetchManager' in self)) {// Provide fallback downloading. }

下面的例子使用 fetch API 一次性下載多個文件：

navigator.serviceWorker.ready.then(async (swReg) => {const bgFetch = await swReg.backgroundFetch.fetch('my-fetch', ['/ep-5.mp3', 'ep-5-artwork.jpg'], {title: 'Episode 5: Interesting things.',icons: [{sizes: '300x300',src: '/ep-5-icon.png',type: 'image/png',}],downloadTotal: 60 * 1024 * 1024,}); });

總結

以上是生活随笔為你收集整理的什么是 Web API 中的 background fetch API的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。