Capturar pantalla de una página web
Captura una captura de pantalla completa o del viewport de cualquier URL como archivo PNG o JPEG usando la API CaptureKit — sin navegadores headless que mantener.
Descripción general
Este tutorial muestra cómo tomar una captura de pantalla de cualquier URL pública y guardarla en disco. Un caso de uso común es las pruebas de regresión visual o generar miniaturas de imagen OG para un servicio de vista previa de enlaces.
Prerrequisitos
- Una clave de API de CaptureKit — consigue una en app.capturekit.dev
- Instala las dependencias para tu lenguaje:
pip install requestsSin dependencias adicionales — usa la API nativa fetch (Node 18+).
Extensión curl habilitada (activa por defecto).
Sin dependencias adicionales — usa net/http (Go 1.18+).
Sin dependencias adicionales — usa java.net.http (Java 11+).
Sin dependencias adicionales — usa System.Net.Http (.NET 6+).
# Cargo.toml
[dependencies]
reqwest = { version = "0.12", features = ["json"] }
tokio = { version = "1", features = ["full"] }
serde_json = "1"Pasos
Solicita una captura de pantalla
Llama a GET /v1/capture con el parámetro url. Las opciones adicionales controlan el viewport, el formato y la captura de página completa.
import requests
API_KEY = "YOUR_API_KEY"
response = requests.get(
"https://api.capturekit.dev/v1/capture",
headers={"x-api-key": API_KEY},
params={
"url": "https://stripe.com",
"format": "png",
"full_page": "true",
"width": "1440",
"height": "900",
},
)
data = response.json()
print(data)const API_KEY = "YOUR_API_KEY";
const params = new URLSearchParams({
url: "https://stripe.com",
format: "png",
full_page: "true",
width: "1440",
height: "900",
});
const response = await fetch(`https://api.capturekit.dev/v1/capture?${params}`, {
headers: { "x-api-key": API_KEY },
});
const data = await response.json();
console.log(data);<?php
$apiKey = "YOUR_API_KEY";
$params = http_build_query([
"url" => "https://stripe.com",
"format" => "png",
"full_page" => "true",
"width" => "1440",
"height" => "900",
]);
$ch = curl_init("https://api.capturekit.dev/v1/capture?{$params}");
curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
curl_setopt($ch, CURLOPT_HTTPHEADER, ["x-api-key: {$apiKey}"]);
$data = json_decode(curl_exec($ch), true);
curl_close($ch);
print_r($data);package main
import (
"encoding/json"
"fmt"
"io"
"net/http"
"net/url"
)
func main() {
params := url.Values{
"url": {"https://stripe.com"}, "format": {"png"},
"full_page": {"true"}, "width": {"1440"}, "height": {"900"},
}
req, _ := http.NewRequest("GET", "https://api.capturekit.dev/v1/capture?"+params.Encode(), nil)
req.Header.Set("x-api-key", "YOUR_API_KEY")
resp, _ := http.DefaultClient.Do(req)
defer resp.Body.Close()
body, _ := io.ReadAll(resp.Body)
var data map[string]any
json.Unmarshal(body, &data)
fmt.Println(data)
}import java.net.URI;
import java.net.URLEncoder;
import java.net.http.*;
import java.nio.charset.StandardCharsets;
var apiKey = "YOUR_API_KEY";
var target = URLEncoder.encode("https://stripe.com", StandardCharsets.UTF_8);
var url = "https://api.capturekit.dev/v1/capture?url=" + target + "&format=png&full_page=true&width=1440&height=900";
var client = HttpClient.newHttpClient();
var request = HttpRequest.newBuilder().uri(URI.create(url))
.header("x-api-key", apiKey).GET().build();
var response = client.send(request, HttpResponse.BodyHandlers.ofString());
System.out.println(response.body());using System.Net.Http;
using var client = new HttpClient();
client.DefaultRequestHeaders.Add("x-api-key", "YOUR_API_KEY");
var target = Uri.EscapeDataString("https://stripe.com");
var body = await client.GetStringAsync(
$"https://api.capturekit.dev/v1/capture?url={target}&format=png&full_page=true&width=1440&height=900");
Console.WriteLine(body);#[tokio::main]
async fn main() -> Result<(), reqwest::Error> {
let data = reqwest::Client::new()
.get("https://api.capturekit.dev/v1/capture")
.header("x-api-key", "YOUR_API_KEY")
.query(&[("url", "https://stripe.com"), ("format", "png"), ("full_page", "true"), ("width", "1440"), ("height", "900")])
.send().await?.json::<serde_json::Value>().await?;
println!("{:#?}", data);
Ok(())
}Obtén la URL de la imagen de la respuesta
La API devuelve screenshot_url con la imagen alojada — o un campo image codificado en base64 si configuras response_type=base64.
screenshot_url = data.get("screenshot_url")
print(f"Captura lista: {screenshot_url}")const { screenshot_url } = data;
console.log(`Captura lista: ${screenshot_url}`);$screenshotUrl = $data["screenshot_url"] ?? "";
echo "Captura lista: {$screenshotUrl}\n";screenshotURL := data["screenshot_url"].(string)
fmt.Println("Captura lista:", screenshotURL)import org.json.*;
var screenshotUrl = new JSONObject(response.body()).getString("screenshot_url");
System.out.println("Captura lista: " + screenshotUrl);using System.Text.Json;
var screenshotUrl = JsonDocument.Parse(body).RootElement.GetProperty("screenshot_url").GetString();
Console.WriteLine($"Captura lista: {screenshotUrl}");let screenshot_url = data["screenshot_url"].as_str().unwrap_or("");
println!("Captura lista: {}", screenshot_url);Descarga y guarda la imagen
Obtén los bytes de la imagen desde la URL y escríbelos en disco.
filename = "screenshot.png"
with requests.get(screenshot_url, stream=True) as r:
r.raise_for_status()
with open(filename, "wb") as f:
for chunk in r.iter_content(chunk_size=8192):
f.write(chunk)
print(f"Guardado en {filename}")import { writeFileSync } from "fs";
const imgResponse = await fetch(screenshotUrl);
const buffer = Buffer.from(await imgResponse.arrayBuffer());
writeFileSync("screenshot.png", buffer);
console.log("Guardado en screenshot.png");$fp = fopen("screenshot.png", "wb");
$ch = curl_init($screenshotUrl);
curl_setopt($ch, CURLOPT_FILE, $fp);
curl_setopt($ch, CURLOPT_FOLLOWLOCATION, true);
curl_exec($ch);
curl_close($ch);
fclose($fp);
echo "Guardado en screenshot.png\n";resp, _ := http.Get(screenshotURL)
defer resp.Body.Close()
file, _ := os.Create("screenshot.png")
defer file.Close()
io.Copy(file, resp.Body)
fmt.Println("Guardado en screenshot.png")import java.net.URL;
import java.nio.file.*;
Files.copy(new URL(screenshotUrl).openStream(), Path.of("screenshot.png"), StandardCopyOption.REPLACE_EXISTING);
System.out.println("Guardado en screenshot.png");var imageBytes = await new HttpClient().GetByteArrayAsync(screenshotUrl);
File.WriteAllBytes("screenshot.png", imageBytes);
Console.WriteLine("Guardado en screenshot.png");use std::{fs::File, io::Write};
let bytes = reqwest::get(screenshot_url).await?.bytes().await?;
let mut file = File::create("screenshot.png").unwrap();
file.write_all(&bytes).unwrap();
println!("Guardado en screenshot.png");Usa full_page=false para capturar solo el viewport visible — ideal para miniaturas de redes sociales donde se requiere un recorte de 630×1200 px de altura fija.