Response
Baseline 廣泛可用 *
注意：此功能在 Web Workers 中可用。
Web API 的 Response 介面代表對請求的響應。
你可以使用 Response() 建構函式建立一個新的 Response 物件，但你更有可能遇到 Response 物件作為另一個 API 操作的結果返回——例如，Service Worker 的 FetchEvent.respondWith，或者簡單的 fetch()。
建構函式
Response()-
建立一個新的
Response物件。
例項屬性
Response.body只讀-
包含正文內容的
ReadableStream。 Response.bodyUsed只讀-
儲存一個布林值，宣告正文是否已被用於響應。
Response.headers只讀-
與響應關聯的
Headers物件。 Response.ok只讀-
一個布林值，指示響應是否成功（狀態碼在
200到299之間）。 Response.redirected只讀-
指示響應是否是重定向的結果（即，其 URL 列表包含多個條目）。
Response.status只讀-
響應的狀態碼。（成功時為
200）。 Response.statusText只讀-
與狀態碼對應的狀態訊息。（例如，
200為OK）。 Response.type只讀-
響應的型別（例如，
basic、cors）。 Response.url只讀-
響應的 URL。
靜態方法
Response.error()-
返回一個與網路錯誤關聯的新
Response物件。 Response.redirect()-
返回一個 URL 不同的新響應。
Response.json()-
返回一個用於返回提供的 JSON 編碼資料的新的
Response物件。
例項方法
Response.arrayBuffer()-
返回一個 Promise，該 Promise 解析為響應正文的
ArrayBuffer表示形式。 Response.blob()-
返回一個 Promise，該 Promise 解析為響應正文的
Blob表示形式。 Response.bytes()-
返回一個 Promise，該 Promise 解析為響應正文的
Uint8Array表示形式。 Response.clone()-
建立一個
Response物件的副本。 Response.formData()-
返回一個 Promise，該 Promise 解析為響應正文的
FormData表示形式。 Response.json()-
返回一個 Promise，該 Promise 解析為將響應正文文字解析為
JSON的結果。 Response.text()-
返回一個 Promise，該 Promise 解析為響應正文的文字表示形式。
示例
獲取圖片
在我們 基本的 fetch 示例（即時執行示例）中，我們使用一個簡單的 fetch() 呼叫來獲取圖片並將其顯示在 <img> 元素中。fetch() 呼叫返回一個 Promise，該 Promise 解析為與資源獲取操作關聯的 Response 物件。
您會注意到，因為我們請求的是圖片，所以我們需要執行 Response.blob 以使響應具有正確的 MIME 型別。
const image = document.querySelector(".my-image");
fetch("flowers.jpg")
.then((response) => response.blob())
.then((blob) => {
const objectURL = URL.createObjectURL(blob);
image.src = objectURL;
});
您還可以使用 Response() 建構函式來建立自己的自定義 Response 物件
const response = new Response();
PHP 呼叫
在這裡，我們呼叫一個生成 JSON 字串的 PHP 程式檔案，並將結果顯示為 JSON 值。
// Function to fetch JSON using PHP
const getJSON = async () => {
// Generate the Response object
const response = await fetch("getJSON.php");
if (response.ok) {
// Get JSON value from the response body
return response.json();
}
throw new Error("*** PHP file not found");
};
// Call the function and output value or error message to console
getJSON()
.then((result) => console.log(result))
.catch((error) => console.error(error));
規範
| 規範 |
|---|
| Fetch # response-class |
瀏覽器相容性
載入中…