From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/ja/web/api/response/index.html | 128 +++++++++++++++++++++++++++++++++++ 1 file changed, 128 insertions(+) create mode 100644 files/ja/web/api/response/index.html (limited to 'files/ja/web/api/response/index.html') diff --git a/files/ja/web/api/response/index.html b/files/ja/web/api/response/index.html new file mode 100644 index 0000000000..3884020535 --- /dev/null +++ b/files/ja/web/api/response/index.html @@ -0,0 +1,128 @@ +--- +title: Response +slug: Web/API/Response +tags: + - API + - Experimental + - Fetch + - Fetch API + - Interface + - Reference + - Response +translation_of: Web/API/Response +--- +
{{APIRef("Fetch API")}}
+ +

Fetch API の Response インターフェイスは、リクエストのレスポンスを表します。

+ +

{{domxref("Response.Response()")}} コンストラクタを使い、新しい Response オブジェクトを作ることができます。しかし、ServiceWorker の {{domxref("Fetchevent.respondWith")}} や {{domxref("GlobalFetch.fetch()")}} などのように、他のAPIからResponseオブジェクトが返されるのをより頻繁に目にするでしょう。

+ +

コンストラクタ

+ +
+
{{domxref("Response.Response","Response()")}}
+
新しい Response オブジェクトを返します。
+
+ +

プロパティ

+ +
+
{{domxref("Response.headers")}} {{readonlyinline}}
+
レスポンスに関連した {{domxref("Headers")}} オブジェクトを含む。
+
{{domxref("Response.ok")}} {{readonlyinline}}
+
レスポンスが成功（200-299 の範囲のステータス）したか否かを通知する boolean 値を含む。
+
{{domxref("Response.redirected")}} {{ReadOnlyInline}}
+
レスポンスがリダイレクトの結果であるかどうかを示します。 つまり、その URL リストには複数のエントリーがあります。
+
{{domxref("Response.status")}} {{readonlyinline}}
+
HTTPステータスコードを返す。(例：200 成功)
+
{{domxref("Response.statusText")}} {{readonlyinline}}
+
ステータスコードに対応したステータスメッセージを含む（たとえば、200 で OK）。
+
{{domxref("Response.type")}} {{readonlyinline}}
+
レスポンスのタイプを示す。(例：basic,cors)
+
{{domxref("Response.url")}} {{readonlyinline}}
+
レスポンスのURLを返す。
+
{{domxref("Response.useFinalURL")}}
+
レスポンスの最後の URL かどうかを通知する boolean 値を含む。
+
+ +

Response は {{domxref("Body")}} を実装しているため、次のプロパティも使用可能です:

+ +
+
{{domxref("Body.body")}} {{readonlyInline}}
+
コンテンツのボディを示す {{domxref("ReadableStream")}} の単純なゲッターです。
+
{{domxref("Body.bodyUsed")}} {{readonlyInline}}
+
レスポンスで body が既に使用されているかどうかを示す {{domxref("Boolean")}} 値を保持する。
+
+ +

メソッド

+ +
+
{{domxref("Response.clone()")}}
+
Response オブジェクトのクローンを生成する。
+
{{domxref("Response.error()")}}
+
ネットワークエラーに関連した新しい Response オブジェクトを返す。
+
{{domxref("Response.redirect()")}}
+
異なる URL で新しい response を生成する
+
+ +

Response　は {{domxref("Body")}}　を実装しているため、次のメソッドも使用可能です:

+ +
+
{{domxref("Body.arrayBuffer()")}}
+
{{domxref("Response")}} ストリームを取得し、それを完全に読み込む。これは、{{domxref("ArrayBuffer")}} で解決する promise を返す。
+
{{domxref("Body.blob()")}}
+
{{domxref("Response")}} ストリームを取得し、それを完全に読み込む。これは、 {{domxref("Blob")}} で解決する promise を返す。
+
{{domxref("Body.formData()")}}
+
{{domxref("Response")}} ストリームを取得し、それを完全に読み込む。これは、 {{domxref("FormData")}} オブジェクトで解決する promise を返す。
+
{{domxref("Body.json()")}}
+
{{domxref("Response")}} ストリームを取得し、それを完全に読み込む。これは、 {{jsxref("JSON")}} オブジェクトで解決する promise を返す。
+
{{domxref("Body.text()")}}
+
{{domxref("Response")}} ストリームを取得し、それを完全に読み込む。これは、{{domxref("USVString")}} （text）で解決する promise を返す。
+
+ +

例

+ +

basic fetch example (run example live) では image を取得するために単純な fetch() を使用し、それを {{htmlelement("img")}} タグの中に入れて表示しています。fetch() はプロミスを返し、then の引数として Response オブジェクトを渡します。image をリクエストするとき、レスポンスに正しい MIME タイプを設定するために、{{domxref("Body.blob")}}（{{domxref("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 オブジェクトを生成するために、{{domxref("Response.Response()")}} コンストラクタを使用することもできます：

+ +
var myResponse = new Response();
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Fetch','#response-class','Response')}}{{Spec2('Fetch')}}Initial definition
+ +

ブラウザー実装状況

+ + + +

{{Compat("api.Response")}}

+ +

関連項目

+ + -- cgit v1.2.3-54-g00ecf