Fetch API

概念與應用

Fetch 提供了 Request 與 Response 物件，還有其他牽涉網路請求的通用定義。這能讓他們在需要的時候被使用到，不管是 service worker、Cache API、還是其他處理或更動請求回應的相類事物、或是任何需要產生有序化產生回應的用例（use case）。

它也提供了諸如 CORS 與 HTTP origin 標頭語意的分散定義，能取代分散的定義。

要發動請求並取得資源的話，請使用 GlobalFetch.fetch 方法。他實作了數種介面，並指定了 Window 與 WorkerGlobalScope，使它可以在任何想獲取資源的環境中使用。

fetch() 方法有一個強制性的參數，就是要取得資源的網址。該方法會回傳一個不論請求成敗，都會 resolve 的 promise 回應。你也能選擇性地使用第二個稱為 init 的物件參數（請參見 Request）。

當 Response 檢索後，在請求體裡面會定義一些請求體為何，還有要如何處理的方法（請參見 Body）。

你也可以直接用 Request() 與 Response() 建構子來建立請求與回應，不過你不太可能直接使用他，反而更可能是以其他 API 行動的結果為形式存在。（例如來自 service worker 的 FetchEvent.respondWith）

Fetch 介面

GlobalFetch

包含用於取得資源的 fetch() 方法。

Headers

代表請求/回應標頭，讓你能 query 並針對結果不同，採取不同行動。

Request

代表資源請求。

Response

代表資源請求的回應。

實驗性 fetch controller/signal/observer 介面

也稱為「可取消的 fetch」（cancellable fetch），介面包含允許 fetch 請求在生命週期間觀察和控制所操作的功能。

FetchController

允許控制一個或以上 fetch 請求的控制器物件。

FetchSignal

能以 fetch 請求透過 FetchController 交流與控制的單一物件。

FetchObserver

檢索 fetch 請求狀態相關的訊息觀察物件（observer object）。

ObserverCallback

提供回呼函式，該函式在 fetch 請求與運行相關聯時運行。另外也提供 FetchObserver 物件，用於檢索 fetch 請求狀態的相關訊息。

Fetch mixin

Body

提供請求/回應訊息體的相關方法，能宣告內容的類別為何，以及該如何處理。

規範

瀏覽器相容性

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

[1] This API is implemented behind a preference.

[2] Prior to Firefox 52, get() only returned the first value in the specified header, with getAll() returning all values. From 52 onwards, get() now returns all values and getAll() has been removed.

[3] Readable streams are currently enabled in Firefox, but hidden behind the dom.streams.enabled and javascript.options.streams prefs.

參見

• 使用 Fetch
• ServiceWorker API
• HTTP access control (CORS)
• HTTP
• Fetch polyfill
• Fetch 基本概念