Skip to content
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
6 changes: 3 additions & 3 deletions src/content/docs/fr/guides/middleware.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -114,7 +114,7 @@ export const onRequest = async (context, next) => {

### Types du middleware

Vous pouvez importer et utiliser la fonction utilitaire `defineMiddleware()` pour bénéficier de la sûreté du typage :
Vous pouvez importer et utiliser la fonction utilitaire [`defineMiddleware()`](/fr/reference/modules/astro-middleware/#definemiddleware) pour bénéficier de la sûreté du typage :

```ts
// src/middleware.ts
Expand Down Expand Up @@ -205,7 +205,7 @@ réponse de validation

<p><Since v="4.13.0" /></p>

L'`APIContext` expose une méthode appelée `rewrite()` qui fonctionne de la même manière que [Astro.rewrite](/fr/guides/routing/#réécritures).
L'`APIContext` expose une méthode appelée [`rewrite()`](/fr/reference/api-reference/#rewrite) qui fonctionne de la même manière que [Astro.rewrite](/fr/guides/routing/#réécritures).

Utilisez `context.rewrite()` dans un middleware pour afficher le contenu d'une autre page sans [rediriger](/fr/guides/routing/#redirections-dynamiques) votre visiteur vers une nouvelle page. Cela déclenchera une nouvelle phase d'affichage, entraînant la ré-exécution de tout middleware.

Expand Down Expand Up @@ -249,7 +249,7 @@ export function onRequest (context, next) {

La fonction `next()` accepte la même charge utile que [la fonction `Astro.rewrite()`](/fr/reference/api-reference/#rewrite). L'emplacement du chemin de réécriture peut être fourni sous la forme d'une chaîne de caractères, d'une URL ou d'une requête (`Request`).

Quand vous avez plusieurs fonctions middleware enchaînées via [sequence()](#enchaînement-de-middlewares), soumettre un chemin à `next()` réécrira la requête (`Request`) en place et le middleware ne s'exécutera pas à nouveau. Le middleware suivant dans la chaîne recevra la nouvelle requête (`Request`) avec son contexte (`context`) mis à jour :
Quand vous avez plusieurs fonctions middleware enchaînées via [sequence()](#enchaînement-de-middlewares), soumettre un chemin à `next()` réécrira la requête (`Request`) en place et le middleware ne s'exécutera pas à nouveau. Le middleware suivant dans la chaîne recevra la nouvelle requête (`Request`) avec son contexte (`context`) mis à jour.

L'appel de `next()` avec cette signature créera un nouvel objet `Request` en utilisant l'ancien contexte de requête (`ctx.request`). Cela signifie que toute tentative de consommation de `Request.body`, avant ou après cette réécriture, générera une erreur d'exécution. Cette erreur est souvent générée avec [les actions Astro qui utilisent des formulaires HTML](/fr/guides/actions/#appeler-des-actions-depuis-une-action-de-formulaire-html). Dans ces cas, nous vous recommandons de gérer les réécritures de vos modèles Astro à l'aide de `Astro.rewrite()` au lieu d'utiliser un middleware.

Expand Down
219 changes: 186 additions & 33 deletions src/content/docs/fr/reference/modules/astro-middleware.mdx
Original file line number Diff line number Diff line change
Expand Up @@ -16,60 +16,84 @@ Un middleware vous permet d'intercepter les requêtes et les réponses et d'inje

## Importations depuis `astro:middleware`

Les fonctions d'assistance suivantes sont importées du module middleware virtuel :

```js
import {
sequence,
createContext,
trySerializeLocals,
defineMiddleware,
} from 'astro:middleware';
sequence,
} from 'astro:middleware';
```

### `defineMiddleware()`

Vous pouvez importer et utiliser la fonction utilitaire `defineMiddleware()` pour bénéficier de la sûreté du typage :
<p>

**Type :** <code>(fn: <a href="#middlewarehandler">MiddlewareHandler</a>) => MiddlewareHandler</code>
</p>

```ts
// src/middleware.ts
Une fonction permettant de définir une fonction middleware avec sûreté du typage. Lorsque vous utilisez cet utilitaire, les arguments [`context`](#context) et [`next()`](#next) sont automatiquement typés, et vous obtiendrez une erreur Typescript si vous essayez de renvoyer une [valeur non prise en charge dans votre middleware](#middlewarehandler).

```ts title="src/middleware.ts"
import { defineMiddleware } from "astro:middleware";

// `context` et `next` sont automatiquement typés
export const onRequest = defineMiddleware((context, next) => {

/* la logique de votre middleware */
});
```

### `sequence()`

<p>

**Type :** `(...handlers: MiddlewareHandler[]) => MiddlewareHandler`
**Type :** <code>(...handlers: <a href="#middlewarehandler">MiddlewareHandler</a>[]) => MiddlewareHandler</code>
</p>

Une fonction qui accepte des fonctions de middleware comme arguments et les exécutera dans l'ordre dans lequel elles sont transmises.

```js title="src/middleware.js"
import { sequence } from "astro:middleware";

async function validation(_, next) {...}
async function auth(_, next) {...}
async function greeting(_, next) {...}
async function validation(context, next) {/* ... */}
async function auth(context, next) {/* ... */}
async function greeting(context, next) {/* ... */}

export const onRequest = sequence(validation, auth, greeting);
```

## Importations depuis `astro/middleware`

Les fonctions d'assistance suivantes peuvent être importées depuis le module middleware standard lors de la création d'une [intégration Astro](/fr/reference/integrations-reference/) :

```js
import {
createContext,
defineMiddleware,
sequence,
trySerializeLocals,
} from "astro/middleware";
```

### `createContext()`

<p>

**Type :** `(context: CreateContext) => APIContext`<br />
**Type :** <code>(context: <a href="#createcontext-1">CreateContext</a>) => <a href="/fr/reference/api-reference/">APIContext</a></code><br />
<Since v="2.8.0" />
</p>

Une API de bas niveau pour créer un objet [`APIContext`](/fr/reference/api-reference/) à transmettre à une fonction `onRequest()` du middleware d'Astro.
Une API de bas niveau pour créer un objet [`APIContext`](/fr/reference/api-reference/) à transmettre à une [fonction `onRequest()`](#onrequest) d'un middleware d'Astro.

Cette fonction peut être utilisée par les intégrations/adaptateurs pour exécuter par programmation le middleware d'Astro.

### `defineMiddleware()`

Voir [`defineMiddleware()`](#definemiddleware) de `astro:middleware`.

### `sequence()`

Voir [`sequence()`](#sequence) de `astro:middleware`.

### `trySerializeLocals()`

<p>
Expand All @@ -80,45 +104,174 @@ Cette fonction peut être utilisée par les intégrations/adaptateurs pour exéc

Une API de bas niveau qui prend n'importe quelle valeur et tente d'en renvoyer une version sérialisée (une chaîne de caractères). Si la valeur ne peut pas être sérialisée, la fonction générera une erreur d'exécution.

## Exportations de middleware
## Types d'`astro/middleware`

Lors de la définition du middleware de votre projet dans `src/middleware.js`, exportez les fonctions définies par l'utilisateur suivantes :
Les types suivants sont importés du module middleware standard :

### `onRequest()`
```js
import type {
CreateContext,
} from "astro/middleware";
```

**Type :** `(context: APIContext, next: MiddlewareNext) => Promise<Response> | Response | Promise<void> | void`
### `CreateContext`

Une fonction requise exportée depuis `src/middleware.js` qui sera appelée avant le rendu de chaque page ou route d'API. Elle reçoit deux arguments : [context](#context) et [next()](#next). `onRequest()` doit renvoyer une réponse (`Response`) : soit directement, soit en appelant `next()`.
<p>

```js title="src/middleware.js"
export function onRequest (context, next) {
// intercepte les données de réponse d'une requête
// éventuellement, transforme la réponse
// renvoie directement une réponse, ou le résultat de l'appel de `next()`
return next();
**Type :** `{ request: Request; params?: Params; userDefinedLocales?: string[]; defaultLocale: string; locals: App.Locals; }`<br />
<Since v="2.8.0" />
</p>

Un objet pour [créer un contexte](#createcontext) à transmettre à un middleware Astro. Il contient les propriétés suivantes :

#### `request`

<p>

**Type :** `Request`
</p>

L'objet [`Request`](https://developer.mozilla.org/fr/docs/Web/API/Request) entrant.

#### `params`

<p>

**Type :** `Params`
</p>

Un objet contenant les paramètres optionnels à transmettre à [`Astro.params`](/fr/reference/api-reference/#params).

#### `userDefinedLocales`

<p>

**Type :** `string[]`<br />
<Since v="3.5.0" />
</p>

Une liste des paramètres régionaux pris en charge définis dans la [configuration `i18n` de l'utilisateur](/fr/reference/configuration-reference/#i18nlocales).

#### `defaultLocale`

<p>

**Type :** `string`<br />
<Since v="4.16.0" />
</p>

Le paramètre régional par défaut défini dans la [configuration `i18n` de l'utilisateur](/fr/reference/configuration-reference/#i18ndefaultlocale).

#### `locals`

<p>

**Type :** `App.Locals`<br />
<Since v="5.0.0" />
</p>

Un objet permettant de stocker des informations arbitraires provenant d'un middleware, accessible à l'utilisateur via [`Astro.locals`](/fr/reference/api-reference/#locals).

<ReadMore>Apprenez-en davantage sur [le stockage des données dans `locals`](/fr/guides/middleware/#stocker-des-données-dans-contextlocals) avec un exemple d'utilisation.</ReadMore>

## Types d'`astro`

```js
import type {
MiddlewareHandler,
MiddlewareNext,
RewritePayload,
} from "astro";
```

### `MiddlewareHandler`

<p>

**Type :** <code>(context: <a href="/fr/reference/api-reference/">APIContext</a>, next: <a href="#middlewarenext">MiddlewareNext</a>) => Promise\<Response\> | Response | Promise\<void\> | void</code>
</p>

Représente une fonction middleware pour Astro. Les gestionnaires de middleware reçoivent deux arguments et peuvent soit renvoyer directement un objet `Response`, soit appeler `next()` pour invoquer le middleware suivant dans la chaîne. Vous pouvez également utiliser [`defineMiddleware()`](#definemiddleware) pour garantir la sûreté du typage pour votre middleware.

L'exemple suivant importe le type `MiddlewareHandler` pour garantir la sûreté du typage dans la fonction [`onRequest()`](#onrequest) :

```ts title="src/middleware.ts"
import type { MiddlewareHandler } from "astro";

export const onRequest: MiddlewareHandler = (context, next) => {
/* la logique du middleware */
};
```

Votre fonction `onRequest()` sera appelée avec les arguments suivants :
Un gestionnaire de middleware reçoit les propriétés suivantes :

#### `context`

<p>

**Type :** `APIContext`
**Type :** [`APIContext`](/fr/reference/api-reference/)
</p>

Le premier argument de `onRequest()` est un objet de contexte. Il reflète de nombreuses propriétés globales d'`Astro`.

<ReadMore>Consultez [Contextes de point de terminaison](/fr/reference/api-reference/) pour plus d'informations sur l'objet de contexte.</ReadMore>
Un objet de [contexte Astro](/fr/reference/api-reference/) reflétant de nombreuses propriétés globales disponibles dans `Astro`.

#### `next()`

<p>

**Type :** `(rewritePayload?: string | URL | Request) => Promise<Response>`<br />
**Type :** [`MiddlewareNext`](#middlewarenext)<br />
</p>

Le deuxième argument de `onRequest()` est une fonction qui appelle tous les middlewares suivants de la chaîne et renvoie une `Response`. Par exemple, un autre middleware pourrait modifier le corps HTML d'une réponse et attendre le résultat de `next()` permettrait à votre middleware de répondre à ces modifications.
Une fonction qui appelle tous les middlewares suivants dans la chaîne et renvoie un objet `Response`. Par exemple, d'autres middlewares pourraient modifier le corps HTML d'une réponse et l'attente du résultat de `next()` permettrait à votre middleware de réagir à ces modifications.

Depuis Astro v4.13.0, `next()` accepte un paramètre de chemin d'URL facultatif sous la forme d'une chaîne de caractères, d'une `URL` ou d'un objet `Request` pour [réécrire](/fr/guides/routing/#réécritures) la requête actuelle sans déclencher une nouvelle phase de rendu.

L'exemple suivant utilise `next()` pour diffuser du contenu à partir d'un chemin différent lorsque le chemin actuel correspond à `/ancien-chemin` :

```ts title="src/middleware.ts"
import type { MiddlewareHandler } from "astro";

export const onRequest: MiddlewareHandler = (context, next) => {
if (context.url.pathname === '/ancien-chemin') {
return next('/nouveau-chemin');
}
return next();
};
```

### `MiddlewareNext`

<p>

**Type :** <code>(rewritePayload?: <a href="#rewritepayload">RewritePayload</a>) => Promise\<Response\></code><br />
</p>

Représente la fonction [`next()`](#next) transmise aux gestionnaires de middleware.

### `RewritePayload`

<p>

**Type :** `string | URL | Request`<br />
<Since v="4.13.0" />
</p>

Représente la destination d'une [réécriture](/fr/guides/routing/#réécritures) lorsqu'elle est transmise à la fonction [`next()`](#next).

## Exportations depuis un middleware

Lors de la définition du middleware de votre projet dans `src/middleware.js`, exportez les fonctions définies par l'utilisateur suivantes :

### `onRequest()`

**Type :** [`MiddlewareHandler`](#middlewarehandler)

Une fonction requise exportée depuis `src/middleware.js` qui sera appelée avant le rendu de chaque page ou route d'API. Elle reçoit deux arguments : [context](#context) et [next()](#next). `onRequest()` doit renvoyer une réponse (`Response`) : soit directement, soit en appelant `next()`.

```js title="src/middleware.js"
export function onRequest (context, next) {
// intercepte les données de réponse d'une requête
// éventuellement, transforme la réponse
// renvoie directement une réponse, ou le résultat de l'appel de `next()`
return next();
};
```