# Astro (/fr/quickstarts/astro)
Related: [Node.js](/fr/quickstarts/nodejs.md), [Next.js](/fr/quickstarts/nextjs.md), [Express](/fr/quickstarts/express.md), [NestJS](/fr/quickstarts/nestjs.md), [Fastify](/fr/quickstarts/fastify.md), [Hono](/fr/quickstarts/hono.md)
## Prérequis [#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 [#installer-le-sdk]
```bash
npm install firecrawl
```
Ajoutez votre clé API dans `.env` :
```bash
FIRECRAWL_API_KEY=fc-YOUR-API-KEY
```
## Recherche sur le Web [#recherche-sur-le-web]
Créez `src/pages/api/search.ts` :
```typescript
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
---
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 [#scrape-une-page]
Créez `src/pages/api/scrape.ts`:
```typescript
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
---
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 [#interact-avec-une-page]
Créez `src/pages/api/interact.ts`:
```typescript
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 [#é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