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/error/index.html | 63 +++++++++++ files/ja/web/api/response/headers/index.html | 73 +++++++++++++ files/ja/web/api/response/index.html | 128 +++++++++++++++++++++++ files/ja/web/api/response/redirect/index.html | 85 +++++++++++++++ files/ja/web/api/response/response/index.html | 75 +++++++++++++ files/ja/web/api/response/usefinalurl/index.html | 60 +++++++++++ 6 files changed, 484 insertions(+) create mode 100644 files/ja/web/api/response/error/index.html create mode 100644 files/ja/web/api/response/headers/index.html create mode 100644 files/ja/web/api/response/index.html create mode 100644 files/ja/web/api/response/redirect/index.html create mode 100644 files/ja/web/api/response/response/index.html create mode 100644 files/ja/web/api/response/usefinalurl/index.html (limited to 'files/ja/web/api/response') diff --git a/files/ja/web/api/response/error/index.html b/files/ja/web/api/response/error/index.html new file mode 100644 index 0000000000..28ad1c1995 --- /dev/null +++ b/files/ja/web/api/response/error/index.html @@ -0,0 +1,63 @@ +--- +title: Response.error() +slug: Web/API/Response/error +translation_of: Web/API/Response/error +--- +
{{APIRef("Fetch")}}
+ +

{{domxref("Response")}} インターフェイスの error() メソッドはネットワークエラーに関連付けられた新規の Response オブジェクトを返します。

+ +
+

Note: これは主に ServiceWorkers に関連しています。エラーメソッドは、必要に応じてエラーを返す為に使用されます。 エラーレスポンスの {{domxref("Response.type","type")}} は error に設定されています。

+
+ +
+

Note: "エラー" Response は実際にスクリプトに公開されません。 {{domxref("GlobalFetch.fetch","fetch()")}} に対するそのような応答は、 promise を拒否します。

+
+ +

構文

+ +
var errorResponse = Response.error();
+ +

引数

+ +

無し

+ +

返り値

+ +

{{domxref("Response")}} オブジェクト

+ +

例

+ +

TBD (まだどこでもサポートされていません。)

+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Fetch','#dom-response-error','error()')}}{{Spec2('Fetch')}}
+ +

ブラウザー実装状況

+ + + +

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

+ +

関連項目

+ + diff --git a/files/ja/web/api/response/headers/index.html b/files/ja/web/api/response/headers/index.html new file mode 100644 index 0000000000..96dd993ea7 --- /dev/null +++ b/files/ja/web/api/response/headers/index.html @@ -0,0 +1,73 @@ +--- +title: Response.headers +slug: Web/API/Response/headers +tags: + - API + - Experimental + - Fetch + - Headers + - Property + - Reference + - Response +translation_of: Web/API/Response/headers +--- +
{{APIRef("Fetch")}}
+ +

{{domxref("Response")}} インターフェイスの headers 読み取り専用プロパティはレスポンスに関連付けられた {{domxref("Headers")}} オブジェクトが含まれています。

+ +

構文

+ +
var myHeaders = response.headers;
+ +

値

+ +

{{domxref("Headers")}} オブジェクト

+ +

例

+ +

Fetch Response の例 ( Fetch Response live を参照) では、 {{domxref("Request.Request","Request()")}} コンストラクタを使用して新しい {{domxref("Request")}} オブジェクトを作成し、 JPG のパスを渡します。次に {{domxref("GlobalFetch.fetch","fetch()")}} を使用してこのリクエストをフェッチし、 {{domxref("Body.blob")}} を使用してリクエストから blob を抽出し、 {{domxref("URL.createObjectURL")}} を使用してオブジェクトURLを作成し、これを {{htmlelement("img")}} に表示します。

+ +

fetch() ブロックの上部でレスポンス headers の値をコンソールに記録している事に注意して下さい。

+ +
var myImage = document.querySelector('img');
+
+var myRequest = new Request('flowers.jpg');
+
+fetch(myRequest).then(function(response) {
+  console.log(response.headers); // returns a Headers{} object
+  response.blob().then(function(myBlob) {
+    var objectURL = URL.createObjectURL(myBlob);
+    myImage.src = objectURL;
+  });
+});
+ +

仕様

+ + + + + + + + + + + + + + +
仕様ステータス備考
{{SpecName('Fetch','#dom-response-headers','headers')}}{{Spec2('Fetch')}}初回定義
+ +

ブラウザーの互換性

+ + + +

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

+ +

関連項目

+ + 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")}}

+ +

関連項目

+ + diff --git a/files/ja/web/api/response/redirect/index.html b/files/ja/web/api/response/redirect/index.html new file mode 100644 index 0000000000..3fe304bfc4 --- /dev/null +++ b/files/ja/web/api/response/redirect/index.html @@ -0,0 +1,85 @@ +--- +title: Response.redirect() +slug: Web/API/Response/redirect +translation_of: Web/API/Response/redirect +--- +
{{APIRef("Fetch")}}
+ +

{{domxref("Response")}} インターフェイスの redirect() メソッドは、指定されたURLへのレダイレクトをもたらす Response を返します。

+ +
+

Note: これは主に ServiceWorker API に関連しています。制御service worker は、ページのリクエストを中断し、必要に応じてリダイレクトできます。もし Service worker が上流に送信を行うと、実際に本当のリダイレクトが発生します。

+
+ +

構文

+ +
var response = Response.redirect(url, status);
+ +

引数

+ +
+
url
+
新しい reponse の発信元URL。
+
status {{optional_inline}}
+
response のオプションのステータスコード (例 302 )
+
+ +

返り値

+ +

{{domxref("Response")}} オブジェクト

+ +

例外

+ + + + + + + + + + + + + + + + + + +
例外説明
RangeError指定されたステータスはリダイレクトステータスではありません。
TypeError指定されたURLは無効です。
+ +

例

+ +
responseObj.redirect('https://www.example.com', 302);
+ +

仕様

+ + + + + + + + + + + + + + +
仕様状態コメント
{{SpecName('Fetch','#dom-response-redirect','redirect()')}}{{Spec2('Fetch')}}
+ +

ブラウザー実装状況

+ + + +

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

+ +

関連項目

+ + diff --git a/files/ja/web/api/response/response/index.html b/files/ja/web/api/response/response/index.html new file mode 100644 index 0000000000..d61b3de4f3 --- /dev/null +++ b/files/ja/web/api/response/response/index.html @@ -0,0 +1,75 @@ +--- +title: Response() +slug: Web/API/Response/Response +translation_of: Web/API/Response/Response +--- +
{{APIRef("Fetch")}}
+ +

Response() コンストラクターは、新しい {{domxref("Response")}} オブジェクトを生成します。

+ +

構文

+ +
var myResponse = new Response(body, init);
+ +

引数

+ +
+
body {{optional_inline}}
+
bodyオブジェクトには、レスポンスの本体を定義する。なお、これは null でも問題ない: +
    +
  • {{domxref("Blob")}}
    • +
  • {{domxref("BufferSource")}}
    • +
  • {{domxref("FormData")}}
    • +
  • {{domxref("ReadableStream")}}
    • +
  • {{domxref("URLSearchParams")}}
    • +
  • {{domxref("USVString")}}
    • +
+
+
init {{optional_inline}}
+
レスポンスに適用したオプションで、カスタム設定したい場合の可能なオプションは、次のとおりです。: +
    +
  • status: レスポンス[応答]のステータスコードです。（例： 200）
    • +
  • statusText: ステータスメッセージは次のようなものです。（例：OKなど)
    • +
  • headers: レスポンス[応答]に追加するヘッダーは、{{domxref("ByteString")}} のキーと値のペアか、もしくは{{domxref("Headers")}} 、または文字どおりの状態で含まれます。（詳細は、HTTP headersを参照）
    • +
+
+
+ +

例

+ +

In our Fetch Response example (see Fetch Response live) we create a new Response object using the constructor, passing it a new {{domxref("Blob")}} as a body, and an init object containing a custom status and statusText:

+ +
var myBlob = new Blob();
+var init = { "status" : 200 , "statusText" : "SuperSmashingGreat!" };
+var myResponse = new Response(myBlob,init);
+ +

仕様

+ + + + + + + + + + + + + + +
SpecificationStatusComment
{{SpecName('Fetch','#dom-response','Response()')}}{{Spec2('Fetch')}}Initial definition
+ +

ブラウザーの対応

+ + + +

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

+ +

関連情報

+ + diff --git a/files/ja/web/api/response/usefinalurl/index.html b/files/ja/web/api/response/usefinalurl/index.html new file mode 100644 index 0000000000..6f18f681d8 --- /dev/null +++ b/files/ja/web/api/response/usefinalurl/index.html @@ -0,0 +1,60 @@ +--- +title: Response.useFinalURL +slug: Web/API/Response/useFinalURL +tags: + - API + - Experimental + - Fetch + - Obsolete + - Property + - Reference + - Response + - useFinalURL +translation_of: Web/API/Response/useFinalURL +--- +
{{APIRef("Fetch")}}{{obsolete_header}}
+ +

{{domxref("Response")}} インターフェイスの useFinalURL プロパティには、これが response の最終URLかどうかを示すbook値が含まれています。

+ +
+

このプロパティは ServiceWorkers にのみに適用されます。他のコンテキストの場合、 undefined を返します。

+
+ +

構文

+ +
var isfinalURL = Response.useFinalURL;
+ +

値

+ +

URLがリダイレクトでなく最終的なものかどうかを示す {{domxref("Boolean")}}

+ +

例

+ +

ページ index.html にあるスクリプトで考えてみます:

+ +
fetch('/test').then((r) => console.log(r.url))
+ +

test.html は service worker sw.js によって制御されています:

+ +
onfetch = (e) => {
+  e.respondWith(fetch('/page2').then((r) => {
+    r.usefinalURL = true;
+    return r;
+  })
+}
+ +

usefinalURL を設定すると、 response のURLが要求のURLに設定されないため、出力は index.html の /test ではなく /page2 になります。

+ +

ブラウザーの互換性

+ + + +

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

+ +

関連項目

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