Request

L'interface Request de l'API Fetch représente une demande de ressource.

Vous pouvez créer un nouvel objet Request en utilisant le constructeur Request(), mais vous êtes plus susceptible de rencontrer un objet Request renvoyé à la suite d'une autre opération d'API, telle en tant que service worker FetchEvent.request.

Constructeur

Request()
Crée un nouvel objet Request.

Propriétés

Request.cache Lecture seule
Contient le mode de cache de la demande (par exemple, default, reload, no-cache).
Request.context Lecture seule
Contient le contexte de la demande (par exemple, audio, image, iframe, etc.)
Request.credentials Lecture seule
Contient les informations d'identification de la demande (par exemple, omit, same-origin, include). La valeur par défaut est same-origin.
Request.destination Lecture seule
Renvoie une chaîne de l'énumération RequestDestination décrivant la destination de la requête. Il s'agit d'une chaîne indiquant le type de contenu demandé.
Request.headers Lecture seule
Contient l'objet Headers associé de la requête.
Request.integrity Lecture seule
Contient la valeur d'intégrité de la sous-ressource de la demande (par exemple, sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=).
Request.method Lecture seule
Contient la méthode de la requête (GET, POST, etc).
Request.mode Lecture seule
Contient le mode de la demande (par exemple, cors, no-cors, same-origin, navigate.)
Request.redirect Lecture seule
Contient le mode de gestion des redirections. Il peut s'agir d'un follow, error, ou d'un manual.
Request.referrer Lecture seule
Contient le référent de la demande (par exemple, client).
Request.referrerPolicy Lecture seule
Contient la politique de référent de la demande (par exemple, no-referrer).
Request.url Lecture seule
Contient l'URL de la demande.

Request implémente Body, donc il hérite également des propriétés suivantes:

body Lecture seule
Un getter simple utilisé pour exposer un ReadableStream du contenu du corps.
bodyUsed Lecture seule
Stocke un Boolean qui déclare si le corps a déjà été utilisé dans une réponse.

Méthodes

Request.clone()
Crée une copie de l'objet Request actuel.

Request implémente Body, donc il dispose également des méthodes suivantes:

Body.arrayBuffer()
Renvoie une promesse qui se résout avec une représentation ArrayBuffer du corps de la requête.
Body.blob()
Renvoie une promesse qui se résout avec une représentation Blob du corps de la requête.
Body.formData()
Renvoie une promesse qui se résout avec une représentation FormData du corps de la requếte.
Body.json()
Renvoie une promesse qui se résout avec une représentation JSON du corps de la requête.
Body.text()
Renvoie une promesse qui se résout avec une représentation USVString (texte) du coprs de la requête.

Note: Les fonctions Body ne peuvent être exécutées qu'une seule fois; les appels suivants seront résolus avec des chaînes vides / ArrayBuffers.

Exemples

Dans l'extrait de code suivant, nous créons une nouvelle requête à l'aide du constructeur Request() (pour un fichier image dans le même répertoire que le script), puis renvoyons certaines valeurs de propriété de la requête:

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

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

Vous pouvez ensuite récupérer cette requête en passant l'objet Request en tant que paramètre à un appel WindowOrWorkerGlobalScope.fetch(), par exemple:

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

Dans l'extrait de code suivant, nous créons une nouvelle requête à l'aide du constructeur Request() avec des données initiales et du contenu du body pour une requête api qui nécessite une charge utile de body:

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: Le type de body ne peut être qu'un Blob, BufferSource, FormData, URLSearchParams, USVString ou ReadableStream donc pour ajouter un objet JSON à la charge utile, vous devez stringify cet objet.

Vous pouvez ensuite récupérer cette demande d'API en passant l'objet Request en tant que paramètre à un appel WindowOrWorkerGlobalScope.fetch(), par exemple et obtenir la réponse:

fetch(request)
  .then(response => {
    if (response.status === 200) {
      return response.json();
    } else {
      throw new Error('Something went wrong on api server!');
    }
  })
  .then(response => {
    console.debug(response);
    // ...
  }).catch(error => {
    console.error(error);
  });

Spécifications

Spécification Statut Commentaire
Fetch
La définition de 'Request' dans cette spécification.
Standard évolutif Définition initiale

Compatibilité des navigateurs

Update compatibility data on GitHub
OrdinateurMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebview AndroidChrome pour AndroidFirefox pour AndroidOpera pour AndroidSafari sur iOSSamsung Internet
Request
Expérimentale
Chrome Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Support complet ≤18Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 28Safari Support complet 10.1WebView Android Support complet 42Chrome Android Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Firefox Android Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
Opera Android Support complet 28Safari iOS Support complet 10.3Samsung Internet Android Support complet 4.0
Request() constructor
Expérimentale
Chrome Support complet 41
Notes
Support complet 41
Notes
Notes From Chrome 47, default values for the init argument's properties changed. mode defaults to same-origin (from no-cors). credentials defaults to include (from same-origin). redirect defaults to follow (from manual).
Edge Support complet 15Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Support complet 10.1WebView Android Support complet 42
Notes
Support complet 42
Notes
Notes From WebView 47, default values for the init argument's properties changed. mode defaults to same-origin (from no-cors). credentials defaults to include (from same-origin). redirect defaults to follow (from manual).
Chrome Android Support complet 41
Notes
Support complet 41
Notes
Notes From Chrome 47, default values for the init argument's properties changed. mode defaults to same-origin (from no-cors). credentials defaults to include (from same-origin). redirect defaults to follow (from manual).
Firefox Android Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
Opera Android Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari iOS Support complet 10.3Samsung Internet Android Support complet 4.0
Support complet 4.0
Support complet 5.0
Notes
Notes Some default values for the init parameter changed in Samsung Internet 5.0. See the Properties section for details.
cache
Expérimentale
Chrome Support complet 64Edge Support complet 14Firefox Support complet 48IE Aucun support NonOpera Support complet 51Safari Support complet 10.1WebView Android Support complet 64Chrome Android Support complet 64Firefox Android Aucun support NonOpera Android Support complet 47Safari iOS Support complet 10.3Samsung Internet Android Support complet 9.0
clone
Expérimentale
Chrome Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Support complet 14Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Support complet 10.1WebView Android Aucun support NonChrome Android Aucun support NonFirefox Android Aucun support NonOpera Android Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari iOS Support complet 10.3Samsung Internet Android Aucun support Non
context
ExpérimentaleObsolèteNon-standard
Chrome Aucun support 42 — 46Edge ? Firefox Aucun support 39 — 42
Notes
Aucun support 39 — 42
Notes
Notes see bug 1188062 for more information.
IE Aucun support NonOpera Aucun support 28 — 29Safari Aucun support NonWebView Android Aucun support 42 — 46Chrome Android Aucun support 42 — 46Firefox Android Aucun support NonOpera Android Aucun support NonSafari iOS Aucun support NonSamsung Internet Android Aucun support 4.0 — 5.0
credentials
Expérimentale
Chrome Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Support complet 14Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Support complet 10.1WebView Android Support complet 42Chrome Android Support complet 42Firefox Android Support complet OuiOpera Android Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari iOS Support complet 10.3Samsung Internet Android Support complet 4.0
destination
Expérimentale
Chrome Support complet 65Edge Support complet 14Firefox Support complet 61IE Aucun support NonOpera Support complet 52Safari Support complet 10.1WebView Android Support complet 65Chrome Android Support complet 65Firefox Android Support complet 61Opera Android Support complet 47Safari iOS Support complet 10.3Samsung Internet Android Support complet 9.0
headers
Expérimentale
Chrome Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Support complet 14Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Support complet 10.1WebView Android Aucun support NonChrome Android Aucun support 42 — 46Firefox Android Aucun support NonOpera Android Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari iOS Support complet 10.3Samsung Internet Android Aucun support 4.0 — 5.0
integrity
Expérimentale
Chrome Support complet 46Edge Support complet 14Firefox Support complet OuiIE Aucun support NonOpera Support complet OuiSafari Support complet 10.1WebView Android Aucun support NonChrome Android Support complet 46Firefox Android Aucun support NonOpera Android Support complet OuiSafari iOS Support complet 10.3Samsung Internet Android Support complet 5.0
keepalive
Expérimentale
Chrome Support complet 66Edge Support complet 15Firefox ? IE Aucun support NonOpera Support complet 43Safari Aucun support NonWebView Android Support complet 66Chrome Android Support complet 66Firefox Android ? Opera Android Support complet 43Safari iOS Aucun support NonSamsung Internet Android Support complet 9.0
method
Expérimentale
Chrome Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Support complet 14Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Support complet 10.1WebView Android Aucun support NonChrome Android Aucun support 42 — 46Firefox Android Aucun support NonOpera Android Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari iOS Support complet 10.3Samsung Internet Android Aucun support 4.0 — 5.0
mode
Expérimentale
Chrome Support complet 42Edge Support complet 14Firefox Support complet 39IE Aucun support NonOpera Support complet 29Safari Support complet 10.1WebView Android Support complet 49Chrome Android Support complet 49Firefox Android Aucun support NonOpera Android Aucun support NonSafari iOS Support complet 10.3Samsung Internet Android Support complet 5.0
redirect
Expérimentale
Chrome Support complet 46Edge Support complet 14Firefox Support complet OuiIE Aucun support NonOpera Support complet OuiSafari Support complet 10.1WebView Android Aucun support NonChrome Android Support complet 46Firefox Android Support complet OuiOpera Android Support complet OuiSafari iOS Support complet 10.3Samsung Internet Android Support complet 5.0
referrer
Expérimentale
Chrome Support complet 42
Support complet 42
Support complet 41
Désactivée
Désactivée From version 41: this feature is behind the Experimental Web Platform Features preference. To change preferences in Chrome, visit chrome://flags.
Edge Support complet 14Firefox Support complet 47IE Aucun support NonOpera Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari Support complet 10.1WebView Android Aucun support NonChrome Android Aucun support NonFirefox Android Aucun support NonOpera Android Support complet 29
Support complet 29
Support complet 28
Désactivée
Désactivée From version 28: this feature is behind the Experimental Web Platform Features preference.
Safari iOS Support complet 10.3Samsung Internet Android Aucun support Non
referrerPolicyChrome Support complet 52Edge Support complet 14Firefox Support complet 52IE Aucun support NonOpera Support complet 39Safari Support complet 10.1WebView Android Support complet 52Chrome Android Support complet 52Firefox Android Support complet 52Opera Android Support complet 41Safari iOS Support complet 10.3Samsung Internet Android Support complet 7.2
signalChrome Support complet 66Edge Support complet 16Firefox Support complet OuiIE Aucun support NonOpera Support complet OuiSafari ? WebView Android Support complet 66Chrome Android Support complet 66Firefox Android Support complet OuiOpera Android Support complet OuiSafari iOS ? Samsung Internet Android Support complet 9.0
url
Expérimentale
Chrome Support complet 42
Notes
Support complet 42
Notes
Notes Fragment support added in Chrome 59.
Edge Support complet 14Firefox Support complet 39
Support complet 39
Support complet 34
Désactivée
Désactivée From version 34: this feature is behind the dom.fetch.enabled preference. To change preferences in Firefox, visit about:config.
IE Aucun support NonOpera Support complet 29
Notes
Support complet 29
Notes
Notes Fragment support added in Opera 46.
Safari Support complet 10.1WebView Android Support complet 42
Notes
Support complet 42
Notes
Notes Fragment support added in Chrome 59.
Chrome Android Support complet 42
Notes
Support complet 42
Notes
Notes Fragment support added in Chrome 59.
Firefox Android Aucun support NonOpera Android Support complet 29
Notes
Support complet 29
Notes
Notes Fragment support added in Opera 46.
Safari iOS Support complet 10.3Samsung Internet Android Support complet 4.0
Notes
Support complet 4.0
Notes
Notes Fragment support added in Samsung Internet 7.0.

Légende

Support complet  
Support complet
Aucun support  
Aucun support
Compatibilité inconnue  
Compatibilité inconnue
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Fonctionnalité expérimentale. Celle-ci peut être amenée à changer par la suite.
Fonctionnalité non-standard. Celle-ci peut être incorrectement supportée par les autres navigateurs.
Fonctionnalité non-standard. Celle-ci peut être incorrectement supportée par les autres navigateurs.
Obsolète. Les nouveaux sites web ne doivent pas utiliser cette fonctionnalité.
Obsolète. Les nouveaux sites web ne doivent pas utiliser cette fonctionnalité.
Voir les notes d'implémentation.
Voir les notes d'implémentation.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.
Une action explicite de l'utilisateur est nécessaire pour activer cette fonctionnalité.

Voir aussi