> ## 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.
# Astro
> Utilisez Firecrawl avec Astro pour extraire, rechercher et interagir avec des données web sur votre site riche en contenu.
## Prérequis
* Un projet Astro avec SSR activé (`output: "server"` ou `"hybrid"`)
* Une clé d’API Firecrawl — [obtenez-en une gratuitement](https://www.firecrawl.dev/app/api-keys)
## Installer le SDK
```bash theme={null}
npm install firecrawl
```
Ajoutez votre clé API dans `.env` :
```bash theme={null}
FIRECRAWL_API_KEY=fc-YOUR-API-KEY
```
## Recherche sur le Web
Créez `src/pages/api/search.ts` :
```typescript theme={null}
import type { APIRoute } from "astro";
import { Firecrawl } from "firecrawl";
const firecrawl = new Firecrawl({
apiKey: import.meta.env.FIRECRAWL_API_KEY,
});
export const POST: APIRoute = async ({ 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" },
});
};
```
Ou effectuez une recherche lors de la requête dans une page rendue côté serveur (`src/pages/search.astro`) :
```astro theme={null}
---
import { Firecrawl } from "firecrawl";
const firecrawl = new Firecrawl({
apiKey: import.meta.env.FIRECRAWL_API_KEY,
});
const query = Astro.url.searchParams.get("q");
let results = [];
if (query) {
const searchData = await firecrawl.search(query, { limit: 5 });
results = searchData.web || [];
}
---
Search Results
{results.length > 0 ? (
) : (
Pass ?q= to search the web
)}
```
## Scrape une page
Créez `src/pages/api/scrape.ts`:
```typescript theme={null}
import type { APIRoute } from "astro";
import { Firecrawl } from "firecrawl";
const firecrawl = new Firecrawl({
apiKey: import.meta.env.FIRECRAWL_API_KEY,
});
export const POST: APIRoute = async ({ request }) => {
const { url } = await request.json();
const result = await firecrawl.scrape(url);
return new Response(JSON.stringify(result), {
headers: { "Content-Type": "application/json" },
});
};
```
Ou lancez le scraping au moment de la requête dans une page rendue côté serveur (`src/pages/scrape.astro`) :
```astro theme={null}
---
import { Firecrawl } from "firecrawl";
const firecrawl = new Firecrawl({
apiKey: import.meta.env.FIRECRAWL_API_KEY,
});
const target = Astro.url.searchParams.get("url");
let markdown = null;
if (target) {
const result = await firecrawl.scrape(target);
markdown = result.markdown;
}
---
Contenu extrait
{markdown ? {markdown} : Passez ?url= pour scraper une page
}
```
## Interact avec une page
Créez `src/pages/api/interact.ts`:
```typescript theme={null}
import type { APIRoute } from "astro";
import { Firecrawl } from "firecrawl";
const firecrawl = new Firecrawl({
apiKey: import.meta.env.FIRECRAWL_API_KEY,
});
export const POST: APIRoute = async () => {
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" },
});
};
```
## Étapes suivantes
Toutes les options de scrape, y compris les formats, les actions et les proxies
Effectuez une recherche sur le web et obtenez le contenu complet de la page
Cliquez, remplissez des formulaires et extrayez du contenu dynamique
Référence complète du SDK avec crawl, cartographie, extraction par lot et plus encore