Response
Fetch API の Response
インターフェイスは、リクエストのレスポンスを表します。
Response.Response()
コンストラクタを使い、新しい Response オブジェクトを作ることができます。しかし、ServiceWorker の Fetchevent.respondWith
や GlobalFetch.fetch()
などのように、他のAPIからResponseオブジェクトが返されるのをより頻繁に目にするでしょう。
コンストラクタ
Response()
- 新しい
Response
オブジェクトを返します。
プロパティ
Response.headers
読取専用- レスポンスに関連した
Headers
オブジェクトを含む。 Response.ok
読取専用- レスポンスが成功(200-299 の範囲のステータス)したか否かを通知する boolean 値を含む。
Response.redirected
読取専用- レスポンスがリダイレクトの結果であるかどうかを示します。 つまり、その URL リストには複数のエントリーがあります。
Response.status
読取専用- HTTPステータスコードを返す。(例:200 成功)
Response.statusText
読取専用- ステータスコードに対応したステータスメッセージを含む(たとえば、200 で OK)。
Response.type
読取専用- レスポンスのタイプを示す。(例:basic,cors)
Response.url
読取専用- レスポンスのURLを返す。
Response.useFinalURL
- レスポンスの最後の URL かどうかを通知する boolean 値を含む。
Response
は Body
を実装しているため、次のプロパティも使用可能です:
Body.body
読取専用- コンテンツのボディを示す
ReadableStream
の単純なゲッターです。 Body.bodyUsed
読取専用- レスポンスで body が既に使用されているかどうかを示す
Boolean
値を保持する。
メソッド
Response.clone()
Response
オブジェクトのクローンを生成する。Response.error()
- ネットワークエラーに関連した新しい
Response
オブジェクトを返す。 Response.redirect()
- 異なる URL で新しい response を生成する
Response
は Body
を実装しているため、次のメソッドも使用可能です:
Body.arrayBuffer()
Response
ストリームを取得し、それを完全に読み込む。これは、ArrayBuffer
で解決する promise を返す。Body.blob()
Response
ストリームを取得し、それを完全に読み込む。これは、Blob
で解決する promise を返す。Body.formData()
Response
ストリームを取得し、それを完全に読み込む。これは、FormData
オブジェクトで解決する promise を返す。Body.json()
Response
ストリームを取得し、それを完全に読み込む。これは、JSON
オブジェクトで解決する promise を返す。Body.text()
Response
ストリームを取得し、それを完全に読み込む。これは、USVString
(text)で解決する promise を返す。
例
basic fetch example (run example live) では image を取得するために単純な fetch()
を使用し、それを <img>
タグの中に入れて表示しています。fetch()
はプロミスを返し、then の引数として Response オブジェクトを渡します。image をリクエストするとき、レスポンスに正しい MIME タイプを設定するために、Body.blob
(Response
は body を実装しています)を実行する必要があることに注意してください。
var myImage = document.querySelector('.my-image');
fetch('flowers.jpg').then(function(response) {
return response.blob();
}).then(function(blob) {
var objectURL = URL.createObjectURL(blob);
myImage.src = objectURL;
});
カスタム Response
オブジェクトを生成するために、Response.Response()
コンストラクタを使用することもできます:
var myResponse = new Response();
仕様
仕様 | 状態 | コメント |
---|---|---|
Fetch Response の定義 |
現行の標準 | Initial definition |
ブラウザー実装状況
BCD tables only load in the browser