Body ミックスインを廃止し、 Response インターフェイスへ統合 (#1898)

- orphaned にあった Body ミックスインを廃止
- Body ミックスインのメンバーを Response インターフェイスへ移動
- 関連する記事を 2021/08/04 時点の英語版に同期

1 files changed, 65 insertions, 0 deletions

diff --git a/files/ja/web/api/response/blob/index.html b/files/ja/web/api/response/blob/index.html
new file mode 100644
index 0000000000..4709a8d364
--- /dev/null
+++ b/files/ja/web/api/response/blob/index.html
@@ -0,0 +1,65 @@
+---
+title: Response.blob()
+slug: Web/API/Response/blob
+tags:
+  - API
+  - Blob
+  - Fetch
+  - Method
+  - Reference
+  - Response
+browser-compat: api.Response.blob
+translation_of: Web/API/Response/blob
+original_slug: Web/API/Body/blob
+---
+<div>{{APIRef("Fetch")}}</div>
+
+<p><strong><code>blob()</code></strong> は {{domxref("Response")}} インターフェイスのメソッドで、 {{domxref("Response")}} ストリームを取得して完全に読み込みます。 {{domxref("Blob")}} で解決するプロミスを返します。</span></p>
+
+<h2 id="Syntax">構文</h2>
+
+<pre class="brush: js"><em>response</em>.blob().then(function(<em>myBlob</em>) {
+  // do something with myBlob
+});</pre>
+
+<h3 id="Parameters">引数</h3>
+
+<p>なし。</p>
+
+<div class="note"><strong>注:</strong> {{domxref("Response")}} の {{domxref("Response.type")}} が <code>"opaque"</code> の場合、結果の {{domxref("Blob")}} の {{domxref("Blob.size")}} は <code>0</code>、{{domxref("Blob.type")}} は空文字列 <code>""</code> になり、{{domxref("URL.createObjectURL")}} のようなメソッドでは<em>役に立たなく</em>なります。</div>
+
+<h3 id="Return_value">返値</h3>
+
+<p>{{domxref("Blob")}} で解決するプロミスです。</p>
+
+<h2 id="Example">例</h2>
+
+<p><a href="https://github.com/mdn/fetch-examples/tree/master/fetch-request">fetch request の例</a> (<a href="https://mdn.github.io/fetch-examples/fetch-request/">fetch request をライブで</a>実行) では、{{domxref("Request.Request","Request()")}} コンストラクターを使用して新しいリクエストを作成し、それを使用して JPG を読み取ります。読み取りが成功したら、<code>blob()</code> を使用してレスポンスから {{domxref("Blob")}} を読み取り、それを {{domxref("URL.createObjectURL")}} を使用してオブジェクト URL に入れ、その URL を {{htmlelement("img")}} 要素のソースとして設定して画像を表示します。</p>
+
+<pre class="brush: js">var myImage = document.querySelector('img');
+
+var myRequest = new Request('flowers.jpg');
+
+fetch(myRequest)
+.then(response =&gt; response.blob())
+.then(function(myBlob) {
+  var objectURL = URL.createObjectURL(myBlob);
+  myImage.src = objectURL;
+});
+</pre>
+
+<h2 id="Specifications">仕様書</h2>
+
+{{Specifications}}
+
+<h2 id="Browser_compatibility">ブラウザーの互換性</h2>
+
+<p>{{Compat}}</p>
+
+<h2 id="See_also">関連情報</h2>
+
+<ul>
+ <li><a href="/ja/docs/Web/API/Service_Worker_API">ServiceWorker API</a></li>
+ <li><a href="/ja/docs/Web/HTTP/CORS">HTTP アクセス制御 (CORS)</a></li>
+ <li><a href="/ja/docs/Web/HTTP">HTTP</a></li>
+</ul>