Docs / Integrations
Integration Vercel
Scannez automatiquement chaque deploiement de preview et recevez les resultats directement dans votre workflow.
A quoi ca sert
L'integration Vercel de Panache surveille vos deploiements de preview pour detecter les problemes de securite, les regressions de performance, les erreurs SEO et les problemes de configuration. A chaque deploiement de preview pret sur Vercel, Panache lance un scan complet et rapporte les resultats. Vous detectez les regressions avant qu'elles n'atteignent la production.
1. Connecter Vercel
Allez dans votre dashboard Panache, puis Settings > Integrations. Cliquez "Connect" a cote de Vercel. Vous serez redirige vers Vercel pour autoriser l'integration. Une fois connecte, le nom de votre equipe Vercel apparaitra dans la page Integrations.
2. Configurer un site
Allez dans Workflow > [votre site] > Settings. Selectionnez le trigger provider "Vercel Webhook" et entrez l'ID de votre projet Vercel (visible dans les settings de votre projet Vercel). Optionnel : choisissez ou poster les resultats (commentaire GitLab MR ou Vercel Checks API).
3. Declenchement des scans
Panache ecoute le webhook deployment.ready de Vercel. Quand un deploiement de preview est pret, un scan demarre automatiquement. Les deploiements en production (target: production) sont toujours ignores. Seules les branches de preview sont scannees. Vous pouvez filtrer les branches scannees dans les parametres de filtrage (toutes, inclure les correspondantes, ou exclure les correspondantes).
4. Resultats des scans
Chaque scan produit un score et un detail par categorie : securite, performance, SEO et bonnes pratiques. Les resultats sont compares a votre score de production. Le delta vous indique si la branche introduit des regressions ou des ameliorations. Si un provider de sortie est configure, un resume est poste en commentaire sur votre merge request ou en tant que Vercel Check.
Alternative : plugin Next.js
Si vous utilisez @withpanache/nextjs, le plugin peut aussi declencher les scans automatiquement pendant le next build. L'URL de preview est auto-detectee depuis les variables d'environnement Vercel. Installez le plugin : npm install @withpanache/nextjs Wrappez votre config : import {withPanache} from "@withpanache/nextjs" export default withPanache({/* votre config next */}). Definissez PANACHE_SITE_TOKEN dans les variables d'environnement de votre projet Vercel.
Securite
Tous les tokens OAuth sont chiffres au repos (AES-256-GCM). Les webhooks sont verifies par signature HMAC. Aucun code source ni artefact de build n'est accede. Panache ne lit que l'URL de deploiement et les metadonnees git (branche, SHA du commit) depuis les webhooks. Les scans sont effectues sur l'URL de preview publique.
Besoin d'aide ?
Pour toute question sur l'integration Vercel ou si vous avez besoin d'assistance, contactez-nous a hello@withpanache.dev