Request()

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

構文

var myRequest = new Request(input, init);

パラメータ

input

取得したいリソースを定義する。いずれかを設定可能：

• 取得したいリソースの直接の URL を含む USVString。
• Request オブジェクト。

init Optional

リクエストに適用するカスタム設定を含むオプションオブジェクト。設定可能なオプションは：

• method：リクエストメソッド、たとえば GET、POST。
• headers：Headers オブジェクトか ByteString を含む、リクエストに追加するヘッダー。
• body： リクエストに追加するボディー：Blob か BufferSource、FormData、URLSearchParams、USVString オブジェクトが使用できる。リクエストが GET か HEAD メソッドを使用している場合、ボディーを持てないことに注意。
• mode：リクエストで使用するモード。たとえば、cors か no-cors、same-origin。既定値は cors。Chrome では、47 以前は no-cors が既定値であり、 same-origin は 47 から使用できるようになった。
• credentials：リクエストで使用するリクエスト credential：omit か same-origin、include が使用できる。 既定値は omit。Chrome では、47 以前は same-origin が既定値であり、include は 47 から使用できるようになった。
• cache：リクエストで使用する cache モード：default か no-store、reload、no-cache、force-cache、only-if-cached が設定できる。
• redirect：使用するリダイレクトモード：follow か error、manual が使用できる。Chrome では、47 以前は既定値が follow であり、manual は 47 から使用できるようになった。
• referrer：no-referrer か client、URL を指定する USVString。既定値は client。

エラー

例

Fetch Request example（Fetch Request live を見てください）では、コンストラクターを使用して新しいリクエストオブジェクトを生成してから、GlobalFetch.fetch 呼び出しを使用して取得しています。画像を取得してから、それを適切に処理できるように MIME タイプを設定するため、レスポンスの Body.blob を実行しています。それから、オブジェクト URL を生成して、<img> 要素に表示しています。

var myImage = document.querySelector('img');

var myRequest = new Request('flowers.jpg');

fetch(myRequest).then(function(response) {
  return response.blob();
}).then(function(response) {
  var objectURL = URL.createObjectURL(response);
  myImage.src = objectURL;
});

Fetch Request with init example（Fetch Request init live を見てください）では、fetch() を実行する際に、init オブジェクトを渡していること以外は同じことをしています。

var myImage = document.querySelector('img');

var myHeaders = new Headers();
myHeaders.append('Content-Type', 'image/jpeg');

var myInit = { method: 'GET',
               headers: myHeaders,
               mode: 'cors',
               cache: 'default' };

var myRequest = new Request('flowers.jpg',myInit);

fetch(myRequest).then(function(response) {
  ... 
});

同様の効果を得るために、fetch 呼び出しに init オブジェクトを渡せることにも注目してください。たとえば：

fetch(myRequest,myInit).then(function(response) {
  ...
});

リクエストのコピーを生成するために、Request() コンストラクターに Request を渡すこともできます（これは clone() メソッドの呼び出しと同じです）。

var copy = new Request(myRequest);

仕様

ブラウザ実装状況

[1] 初期化パラメーターの既定値のいくつかは  Chrome 47 で変更されました。詳細はプロパティセクションで確認してください。

[2] 34 では、設定で有効にします。

[3] 28 では、設定で有効にします。

関連項目

• ServiceWorker API
• HTTP access control (CORS)
• HTTP