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
(en-US).
Constructeur
Request()
-
Crée un nouvel objet
Request
.
Propriétés
Request.cache
(en-US) Lecture seule-
Contient le mode de cache de la demande (par exemple,
default
,reload
,no-cache
). Request.context
(en-US) Lecture seule Obsolète-
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 estsame-origin
. Request.destination
(en-US) Lecture seule-
Renvoie une chaîne de l'énumération
RequestDestination
(en-US) décrivant la destination de la requête. Il s'agit d'une chaîne indiquant le type de contenu demandé. Request.headers
(en-US) Lecture seule-
Contient l'objet
Headers
associé de la requête. Request.integrity
(en-US) Lecture seule-
Contient la valeur d'intégrité de la sous-ressource de la demande (par exemple,
sha256-BpfBw7ivV8q2jLiT13fxDYAe2tJllusRSZ273h2nFSE=
). Request.method
(en-US) 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
(en-US) Lecture seule-
Contient le mode de gestion des redirections. Il peut s'agir d'un
follow
,error
, ou d'unmanual
. Request.referrer
(en-US) Lecture seule-
Contient le référent de la demande (par exemple,
client
). Request.referrerPolicy
(en-US) Lecture seule-
Contient la politique de référent de la demande (par exemple,
no-referrer
). Request.url
(en-US) Lecture seule-
Contient l'URL de la demande.
Request
implémente Body
, donc il hérite également des propriétés suivantes:
body
(en-US) Lecture seule-
Un getter simple utilisé pour exposer un
ReadableStream
(en-US) du contenu du corps. bodyUsed
(en-US) Lecture seule-
Stocke un
Boolean
(en-US) qui déclare si le corps a déjà été utilisé dans une réponse.
Méthodes
Request.clone()
(en-US)-
Crée une copie de l'objet
Request
actuel.
Request
implémente Body
, donc il dispose également des méthodes suivantes:
Body.arrayBuffer()
(en-US)-
Renvoie une promesse qui se résout avec une représentation
ArrayBuffer
du corps de la requête. Body.blob()
(en-US)-
Renvoie une promesse qui se résout avec une représentation
Blob
du corps de la requête. Body.formData()
(en-US)-
Renvoie une promesse qui se résout avec une représentation
FormData
du corps de la requếte. Body.json()
(en-US)-
Renvoie une promesse qui se résout avec une représentation
JSON
du corps de la requête. Body.text()
(en-US)-
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 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
(en-US) 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 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
Specification |
---|
Fetch Standard # request-class |
Compatibilité des navigateurs
BCD tables only load in the browser