# Assistant d'installation : une installation vérifiée, étape par étape

Comment l'assistant d'installation FlowConsent vérifie chaque étape en réel — snippet, scan de refus, surveillance hebdomadaire, et le parcours serveur.

> Canonical: https://www.flowconsent.com/fr/doc/setup-wizard
> Last updated: 2026-07-30
L'assistant d'installation vit dans l'onglet **Deployment** du Builder, une fois votre bannière déployée. Il fait plus que vous tendre un snippet : chaque étape est **vérifiée sur votre site réel**. L'assistant ne dit pas « collez ce code » — il va chercher votre page et constate que c'est fait, puis prouve que la bannière est respectée par un scan de refus, et se termine sur la surveillance continue plutôt que sur un « c'est fini ».

## Étape 1 — Ajouter le snippet pour votre plateforme

La carte d'intégration propose le snippet en trois déclinaisons : **HTML / No-code**, **Webflow** et **Next.js**. Toutes contiennent les deux mêmes parties, dans cet ordre :

1. Un **stub Consent Mode** inline qui enregistre des valeurs par défaut `denied` pour tous les signaux Google.
2. Le **chargeur FlowConsent** qui affiche la bannière et applique le choix du visiteur.

```html title="index.html"
<script>
// FlowConsent Loader - PLACER AVANT tout autre script dans le <head>
window.dataLayer=window.dataLayer||[];
function gtag(){dataLayer.push(arguments);}
gtag('consent','default',{
  'ad_storage':'denied',
  'analytics_storage':'denied',
  'ad_user_data':'denied',
  'ad_personalization':'denied',
  'wait_for_update':500
});
gtag('set','url_passthrough',true);
gtag('set','ads_data_redaction',true);
</script>
<!-- FlowConsent CMP -->
<script src="https://VOTRE-CODE-LICENCE.consent.flowconsent.com/cookie-manager.js?code=VOTRE_CODE_LICENCE"></script>
```

> [!WARNING]
> Le stub doit précéder le chargeur — et tout autre script. Le chargeur est asynchrone : un tag Google injecté par un autre canal (un réglage de site builder, un plugin) pourrait gagner la course. Le stub, lui, s'exécute au parse du HTML : les valeurs `denied` sont enregistrées avant tout gtag, qui que ce soit qui le charge.

Les spécificités par plateforme, telles qu'affichées dans l'assistant :

- **Webflow** — collez le snippet dans *Site settings → Custom code → Head code*, puis publiez. Retirez tout Measurement ID Google Analytics de *Site settings → Apps & Integrations* : Webflow l'injecte **au-dessus** de votre code personnalisé, sa config gtag s'exécuterait donc avant les valeurs par défaut de consentement et aucune CMP ne pourrait la contrôler.
- **Next.js** — l'assistant génère une version `app/layout.tsx` utilisant `<Script strategy="beforeInteractive">` pour le stub et le chargeur. Pour la navigation côté client, activez aussi le mode SPA dans l'onglet Settings — voir le [guide d'intégration Next.js](/fr/doc/nextjs-integration).

## Étape 2 — Vérifier votre installation

Saisissez l'URL de votre page et cliquez sur **Vérifier**. FlowConsent va chercher la page depuis ses serveurs et contrôle, dans le HTML réel :

- la page est **joignable** (avec le statut HTTP sinon) ;
- le **chargeur FlowConsent est présent avec votre code licence** — si un chargeur est trouvé avec un code *différent*, l'assistant vous dit lequel ;
- le **stub Consent Mode est présent** — s'il manque, vous n'avez probablement collé que le second bloc `<script>` ;
- si un tag Google est sur la page, le **stub s'exécute avant lui** — sinon ses cookies ne peuvent pas être contrôlés, et l'assistant affiche l'URL du tag fautif.

> [!TIP]
> Si le contrôle signale un tag injecté par vos **réglages Webflow**, ne le combattez pas à coups de code personnalisé : retirez le Measurement ID de *Site settings → Apps & Integrations* et laissez la bannière charger Google Analytics à sa place.

## Étape 3 — Lancer un scan de refus

Une bannière installée ne prouve rien en soi : ce qui compte, c'est ce qui s'exécute quand un visiteur **refuse**. Cette étape charge votre page dans un vrai navigateur avec le consentement refusé et liste tout ce qui part quand même. Elle utilise le profil rapide — un verdict en 30 à 60 secondes environ — et affiche le même badge de verdict que la page Conformité (Conforme, Avertissements ou Violations), plus le nombre de violations.

L'audit exhaustif, les suggestions de pages et l'historique des scans vivent sur la [page Conformité](/fr/doc/compliance-verification).

## Étape 4 — Activer la surveillance hebdomadaire

La dernière étape ne clôt pas l'installation — elle la maintient prouvée. Cliquez sur **Surveiller cette page chaque semaine** : le même scan de refus se relance chaque semaine et vous alerte en cas de régression (un tag ajouté par une équipe marketing, un réglage de site builder réactivé). Dès qu'un moniteur existe pour la page, l'assistant l'affiche comme actif.

## Côté serveur (optionnel)

La moitié des traitements soumis au consentement se joue côté serveur — GA4 Measurement Protocol, synchro CRM, analytics maison. L'assistant couvre aussi ce parcours.

### Lire le contrat de consentement avec le SDK serveur

L'assistant génère un snippet `readConsent()` avec le **`configHash` courant de votre bannière déjà injecté**. Un consentement donné avant une modification de la bannière est invalide — le hash amène votre serveur à le traiter comme nécessitant un re-consentement :

```js title="handler.js"
import { readConsent } from '@flowconsent/server-sdk'

export async function handler(request) {
  const consent = readConsent(request, {
    // Hash de la config publiée : un choix antérieur à un
    // changement de bannière est invalide (re-consentement).
    expectedConfigHash: 'VOTRE_CONFIG_HASH_COURANT',
  })
  if (consent.can('analytics')) {
    // GA4 Measurement Protocol, analytics maison…
  }
  if (consent.can('marketing')) {
    // synchro CRM, audiences…
  }
}
```

Voir le [guide du SDK serveur](/fr/doc/server-sdk) pour l'API complète.

### Webhook de consentement, testé par un vrai événement signé

Ajoutez l'URL d'un endpoint et l'assistant crée un **webhook de consentement** avec un secret de signature au format `whsec_…`.

> [!IMPORTANT]
> Le secret de signature n'est montré qu'**une seule fois**, à la création. Enregistrez-le immédiatement — vous en aurez besoin pour vérifier la signature de chaque livraison.

Cliquez ensuite sur **Envoyer un test signé** : FlowConsent livre un véritable événement `consent.test` signé à votre endpoint et rend le constat — livré, avec le statut HTTP et le temps de réponse, ou le détail de l'échec. Votre intégration est confirmée par une livraison réelle, pas par une coche verte sur parole.

## Prochaines étapes

- [Vérifier la conformité en continu](/fr/doc/compliance-verification)
- [Personnaliser la bannière](/fr/doc/banner-customization)
- [Installation rapide depuis zéro](/fr/doc/quick-install)
