Passer au contenu principal

Prérequis

Installer le SDK

npm install @mendable/firecrawl-js

Définissez votre clé API

Ajoutez votre clé API à .env.local :
FIRECRAWL_API_KEY=fc-YOUR-API-KEY

Rechercher sur le Web

Le SDK doit s’exécuter uniquement côté serveur, car il nécessite votre clé API.

Route Handler

Créez app/api/search/route.ts :
import { NextResponse } from "next/server";
import Firecrawl from "@mendable/firecrawl-js";

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 NextResponse.json(results);
}

Action serveur

Créez app/actions.ts pour l’utiliser dans les composants clients :
"use server";

import Firecrawl from "@mendable/firecrawl-js";

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

export async function searchWeb(query: string) {
  const results = await firecrawl.search(query, { limit: 5 });
  return (results.web || []).map((r) => ({ title: r.title, url: r.url }));
}

Scraper une page

Route Handler

Créez app/api/scrape/route.ts :
import { NextResponse } from "next/server";
import Firecrawl from "@mendable/firecrawl-js";

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 NextResponse.json(result);
}

Composant serveur

Récupérez directement les données dans un composant serveur, dans app/page.tsx :
import Firecrawl from "@mendable/firecrawl-js";

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

export default async function Page() {
  const result = await firecrawl.scrape("https://example.com");

  return (
    <article>
      <h1>Scraped Content</h1>
      <pre>{result.markdown}</pre>
    </article>
  );
}

Interact avec une page

Utilisez Interact pour contrôler une session de navigateur active — cliquez sur des boutons, remplissez des formulaires et extrayez du contenu dynamique.

Route Handler

Créez app/api/interact/route.ts :
import { NextResponse } from "next/server";
import Firecrawl from "@mendable/firecrawl-js";

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

export async function POST(request: Request) {
  const { url, prompts } = await request.json();

  const result = await firecrawl.scrape(url, { 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 NextResponse.json({ output: response.output });
}

Étapes suivantes

Documentation Scrape

Toutes les options de scrape, y compris les formats, les actions et les proxies

Documentation Search

Effectuez une recherche sur le web et obtenez le contenu complet de la page

Documentation Interact

Cliquez, remplissez des formulaires et extrayez du contenu dynamique

Référence du SDK Node

Référence complète du SDK avec crawl, cartographie, extraction par lot et plus encore