# Request



The **`Request`** interface of the [Fetch API](https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API) represents a resource request.

You can create a new `Request` object using the [Request()](https://developer.mozilla.org/en-US/docs/Web/API/Request/Request) constructor, but you are more likely to encounter a `Request` object being returned as the result of another API operation, such as a service worker [FetchEvent.request](https://developer.mozilla.org/en-US/docs/Web/API/FetchEvent/request).

## Constructor

- [Request()](https://developer.mozilla.org/en-US/docs/Web/API/Request/Request)
  - : Creates a new `Request` object.

## Instance properties

- [Request.body](https://developer.mozilla.org/en-US/docs/Web/API/Request/body) 
  - : A [ReadableStream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream) of the body contents.
- [Request.bodyUsed](https://developer.mozilla.org/en-US/docs/Web/API/Request/bodyUsed) 
  - : Stores `true` or `false` to indicate whether or not the body has been used in a request yet.
- [Request.cache](https://developer.mozilla.org/en-US/docs/Web/API/Request/cache) 
  - : Contains the cache mode of the request (e.g., `default`, `reload`, `no-cache`).
- [Request.credentials](https://developer.mozilla.org/en-US/docs/Web/API/Request/credentials) 
  - : Contains a value controlling whether credentials should be included with the request (e.g., `omit`, `same-origin`, `include`). The default is `same-origin`.
- [Request.destination](https://developer.mozilla.org/en-US/docs/Web/API/Request/destination) 
  - : A string describing the type of content being requested.
- [Request.duplex](https://developer.mozilla.org/en-US/docs/Web/API/Request/duplex)  
  - : The duplex mode of the request, which determines whether the browser must send the entire request before processing the response.
- [Request.headers](https://developer.mozilla.org/en-US/docs/Web/API/Request/headers) 
  - : Contains the associated [Headers](https://developer.mozilla.org/en-US/docs/Web/API/Headers) object of the request.
- [Request.integrity](https://developer.mozilla.org/en-US/docs/Web/API/Request/integrity) 
  - : Contains the [subresource integrity](https://developer.mozilla.org/en-US/docs/Web/Security/Defenses/Subresource_Integrity) value of the request (e.g., `sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=`).
- [Request.isHistoryNavigation](https://developer.mozilla.org/en-US/docs/Web/API/Request/isHistoryNavigation) 
  - : A boolean indicating whether the request is a history navigation.
- [Request.isReloadNavigation](https://developer.mozilla.org/en-US/docs/Web/API/Request/isReloadNavigation)  
  - : A boolean indicating whether the request is a user-triggered reload.
- [Request.keepalive](https://developer.mozilla.org/en-US/docs/Web/API/Request/keepalive) 
  - : Contains the request's `keepalive` setting (`true` or `false`), which indicates whether the browser will keep the associated request alive if the page that initiated it is unloaded before the request is complete.
- [Request.method](https://developer.mozilla.org/en-US/docs/Web/API/Request/method) 
  - : Contains the request's method (`GET`, `POST`, etc.)
- [Request.mode](https://developer.mozilla.org/en-US/docs/Web/API/Request/mode) 
  - : Contains the mode of the request (e.g., `cors`, `no-cors`, `same-origin`, `navigate`.)
- [Request.redirect](https://developer.mozilla.org/en-US/docs/Web/API/Request/redirect) 
  - : Contains the mode for how redirects are handled. It may be one of `follow`, `error`, or `manual`.
- [Request.referrer](https://developer.mozilla.org/en-US/docs/Web/API/Request/referrer) 
  - : Contains the referrer of the request (e.g., `client`).
- [Request.referrerPolicy](https://developer.mozilla.org/en-US/docs/Web/API/Request/referrerPolicy) 
  - : Contains the referrer policy of the request (e.g., `no-referrer`).
- [Request.signal](https://developer.mozilla.org/en-US/docs/Web/API/Request/signal) 
  - : Returns the [AbortSignal](https://developer.mozilla.org/en-US/docs/Web/API/AbortSignal) associated with the request.
- [Request.targetAddressSpace](https://developer.mozilla.org/en-US/docs/Web/API/Request/targetAddressSpace)  
  - : Returns the request's target address space, which indicates whether it is a loopback, local, or public request.
- [Request.url](https://developer.mozilla.org/en-US/docs/Web/API/Request/url) 
  - : Contains the URL of the request.

## Instance methods

- [Request.arrayBuffer()](https://developer.mozilla.org/en-US/docs/Web/API/Request/arrayBuffer)
  - : Returns a promise that resolves with an [ArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer) representation of the request body.
- [Request.blob()](https://developer.mozilla.org/en-US/docs/Web/API/Request/blob)
  - : Returns a promise that resolves with a [Blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob) representation of the request body.
- [Request.bytes()](https://developer.mozilla.org/en-US/docs/Web/API/Request/bytes)
  - : Returns a promise that resolves with a [Uint8Array](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Uint8Array) representation of the request body.
- [Request.clone()](https://developer.mozilla.org/en-US/docs/Web/API/Request/clone)
  - : Creates a copy of the current `Request` object.
- [Request.formData()](https://developer.mozilla.org/en-US/docs/Web/API/Request/formData)
  - : Returns a promise that resolves with a [FormData](https://developer.mozilla.org/en-US/docs/Web/API/FormData) representation of the request body.
- [Request.json()](https://developer.mozilla.org/en-US/docs/Web/API/Request/json)
  - : Returns a promise that resolves with the result of parsing the request body as [JSON](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON).
- [Request.text()](https://developer.mozilla.org/en-US/docs/Web/API/Request/text)
  - : Returns a promise that resolves with a text representation of the request body.
- [Request.textStream()](https://developer.mozilla.org/en-US/docs/Web/API/Request/textStream) 
  - : Returns a [ReadableStream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream) that can be used to read the contents of the request body in chunks of UTF-8.

> **NOTE:**
> The request body functions can be run only once; subsequent calls will reject with TypeError showing that the body stream has already used.

## Examples

In the following snippet, we create a new request using the `Request()` constructor (for an image file in the same directory as the script), then return some property values of the request:

```js
const request = new Request("https://www.mozilla.org/favicon.ico");

const url = request.url;
const method = request.method;
const credentials = request.credentials;
```

You could then fetch this request by passing the `Request` object in as a parameter to a [fetch()](https://developer.mozilla.org/en-US/docs/Web/API/Window%2Ffetch) call, for example:

```js
fetch(request)
  .then((response) => response.blob())
  .then((blob) => {
    image.src = URL.createObjectURL(blob);
  });
```

In the following snippet, we create a new request using the `Request()` constructor with some initial data and body content for an API request which needs a body payload:

```js
const request = new Request("https://example.com", {
  method: "POST",
  body: '{"foo": "bar"}',
});

const url = request.url;
const method = request.method;
const credentials = request.credentials;
const bodyUsed = request.bodyUsed;
```

> **NOTE:**
> The body can only be a [Blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob), an [ArrayBuffer](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/ArrayBuffer), a [TypedArray](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/TypedArray), a [DataView](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/DataView), a [FormData](https://developer.mozilla.org/en-US/docs/Web/API/FormData), a [URLSearchParams](https://developer.mozilla.org/en-US/docs/Web/API/URLSearchParams), a [ReadableStream](https://developer.mozilla.org/en-US/docs/Web/API/ReadableStream), or a [String](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/String) object, as well as a string literal, so for adding a JSON object to the payload you need to stringify that object.

You could then fetch this API request by passing the `Request` object in as a parameter to a [fetch()](https://developer.mozilla.org/en-US/docs/Web/API/Window%2Ffetch) call, for example and get the response:

```js
fetch(request)
  .then((response) => {
    if (response.status !== 200) {
      throw new Error("Something went wrong on API server!");
    }
    return response.json();
  })
  .then((response) => {
    console.debug(response);
    // …
  })
  .catch((error) => {
    console.error(error);
  });
```

## Specifications

## Browser compatibility

## See also

- [ServiceWorker API](https://developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API)
- [HTTP access control (CORS)](https://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CORS)
- [HTTP](https://developer.mozilla.org/en-US/docs/Web/HTTP)