---
title: RequestExample & ResponseExample
description: Wrappers stylisés qui distinguent visuellement les blocs de code de requête et de réponse.
url: https://docs.thally.io/fr/components/request-response-example
---

# RequestExample & ResponseExample

Wrappers stylisés qui distinguent visuellement les blocs de code de requête et de réponse.

{/* thally:ai-translation locale=fr source-sha=c20bc8b9c94f9a939e5a46a8d572885dc0d421f16c3d3177ae8a21d21c798ca6 */}
{/* Remove the marker above before manual edits to opt out of automatic refresh. */}

Utilisez `<RequestExample>` et `<ResponseExample>` pour encadrer les paires de requêtes/réponses HTTP dans la documentation API écrite en MDX. Ils ajoutent une barre d'en-tête étiquetée — bleue pour les requêtes, verte pour les réponses — correspondant au style utilisé par les pages de référence API générées automatiquement.

## Exemple

```bash cURL
curl -X POST https://api.example.com/pets \
  -H "Authorization: Bearer sk-..." \
  -H "Content-Type: application/json" \
  -d '{"name": "Buddy", "species": "dog"}'
```

```json 201 Created
{
  "id": "a1b2c3d4-e5f6-7890-abcd-ef1234567890",
  "name": "Buddy",
  "species": "dog",
  "status": "available",
  "created_at": "2025-01-15T10:30:00Z"
}
```

```mdx
<RequestExample>
\`\`\`bash cURL
curl -X POST https://api.example.com/pets \
  -H "Authorization: Bearer sk-..." \
  -d '{"name": "Buddy", "species": "dog"}'
\`\`\`
</RequestExample>

<ResponseExample>
\`\`\`json 201 Created
{ "id": "a1b2c3d4", "name": "Buddy", "status": "available" }
\`\`\`
</ResponseExample>
```

## Avec CodeGroup

Enveloppez un `<CodeGroup>` à l'intérieur de `<RequestExample>` pour afficher la même requête dans plusieurs langages :

```mdx
<RequestExample>
  <CodeGroup>
  \`\`\`typescript TypeScript
  await client.pets.create({ name: 'Buddy', species: 'dog' })
  \`\`\`

  \`\`\`python Python
  client.pets.create(name="Buddy", species="dog")
  \`\`\`
  </CodeGroup>
</RequestExample>
```

## Voir en action

Les pages de référence API sont générées automatiquement à partir de votre spécification OpenAPI et s'affichent à l'aide des mêmes composants visuels — `ParamField`, `ResponseField`, `Expandable`, `RequestExample` et `ResponseExample`. Ouvrez n'importe quel endpoint pour les voir tous en contexte :

#### [Lister les animaux](/api/default/pets/get)

    `GET /pets` — paramètres de requête, schéma de réponse paginé avec champs extensibles imbriqués.

#### [Créer un animal](/api/default/pets/post)

    `POST /pets` — paramètres du corps de la requête, schéma de réponse complet et exemple cURL en direct.