> ## Documentation Index
> Fetch the complete documentation index at: https://docs.firecrawl.dev/llms.txt
> Use this file to discover all available pages before exploring further.

# Fonctions Vercel

> Utilisez Firecrawl avec les fonctions Vercel pour rechercher, extraire et interagir avec des données web dans des déploiements serverless.

<div id="prerequisites">
  ## Prérequis
</div>

* Un projet Vercel (Next.js, SvelteKit, Nuxt ou autonome)
* Une clé API Firecrawl — [obtenez-en une gratuitement](https://www.firecrawl.dev/app/api-keys)

<div id="setup">
  ## Configuration
</div>

```bash theme={null}
npm install firecrawl
```

Ajoutez `FIRECRAWL_API_KEY` en tant que variable d’environnement dans les paramètres de votre projet Vercel, ou dans `.env.local` pour le développement local :

```bash theme={null}
FIRECRAWL_API_KEY=fc-YOUR-API-KEY
```

<div id="search-the-web">
  ## Recherche sur le Web
</div>

Créez `api/search.ts` (ou `app/api/search/route.ts` pour Next.js) :

```typescript theme={null}
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({ apiKey: process.env.FIRECRAWL_API_KEY });

export async function POST(request: Request) {
  const { query } = await request.json();
  const results = await firecrawl.search(query, { limit: 5 });

  return new Response(JSON.stringify(results), {
    headers: { "Content-Type": "application/json" },
  });
}
```

<div id="scrape-a-page">
  ## Scrape une page
</div>

Créez `api/scrape.ts` (ou `app/api/scrape/route.ts` pour Next.js) :

```typescript theme={null}
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({ apiKey: process.env.FIRECRAWL_API_KEY });

export async function POST(request: Request) {
  const { url } = await request.json();
  const result = await firecrawl.scrape(url);

  return new Response(JSON.stringify(result), {
    headers: { "Content-Type": "application/json" },
  });
}
```

<div id="interact-with-a-page">
  ## Interact avec une page
</div>

Créez `api/interact.ts` (ou `app/api/interact/route.ts` pour Next.js) :

```typescript theme={null}
import { Firecrawl } from "firecrawl";

const firecrawl = new Firecrawl({ apiKey: process.env.FIRECRAWL_API_KEY });

export async function POST(request: Request) {
  const result = await firecrawl.scrape("https://www.amazon.com", {
    formats: ["markdown"],
  });
  const scrapeId = result.metadata?.scrapeId;

  await firecrawl.interact(scrapeId, {
    prompt: "Search for iPhone 16 Pro Max",
  });
  const response = await firecrawl.interact(scrapeId, {
    prompt: "Click on the first result and tell me the price",
  });

  await firecrawl.stopInteraction(scrapeId);

  return new Response(JSON.stringify({ output: response.output }), {
    headers: { "Content-Type": "application/json" },
  });
}
```

<div id="deploy">
  ## Déployer
</div>

```bash theme={null}
vercel deploy
```

<div id="test-it">
  ## Testez-le
</div>

```bash theme={null}
curl -X POST https://your-project.vercel.app/api/search \
  -H "Content-Type: application/json" \
  -d '{"query": "firecrawl web scraping"}'
```

<Note>
  Les Vercel Functions ont un délai d’expiration par défaut de 10 secondes sur l’offre Hobby et de 60 secondes sur l’offre Pro. Pour les gros jobs de crawl, utilisez plutôt l’API asynchrone de Firecrawl avec des webhooks.
</Note>

<div id="next-steps">
  ## Étapes suivantes
</div>

<CardGroup cols={2}>
  <Card title="Documentation de recherche" icon="magnifying-glass" href="/fr/features/search">
    Effectuez des recherches sur le web et obtenez le contenu complet des pages
  </Card>

  <Card title="Documentation sur le scrape" icon="file-lines" href="/fr/features/scrape">
    Toutes les options de scrape, y compris les formats, les actions et les proxies
  </Card>

  <Card title="Documentation Interact" icon="hand-pointer" href="/fr/features/interact">
    Cliquez, remplissez des formulaires et extrayez du contenu dynamique
  </Card>

  <Card title="Référence du SDK Node" icon="node" href="/fr/sdks/node">
    Référence complète du SDK avec crawl, cartographie, extraction par lot, etc.
  </Card>
</CardGroup>
