Categorías

Extractor de Fuentes de Imagen

Extrae URLs de imagen (atributos src) del código fuente HTML. Admite imágenes de carga diferida y atributos srcset.

También extraer de atributos data-src (imágenes de carga diferida)

También extraer de atributos srcset (imágenes responsivas)

Elimina URLs de imagen duplicadas de los resultados

Elija cómo ordenar las URLs de imagen extraídas

Datos clave

Categoría
Text Processing
Tipos de entrada
textarea, checkbox, select
Tipo de salida
json
Cobertura de muestras
4
API disponible
Yes

Resumen

El Extractor de Fuentes de Imagen es una herramienta en línea que extrae URLs de imágenes del código fuente HTML. Permite capturar atributos src, así como data-src para imágenes de carga diferida y srcset para imágenes responsivas, facilitando el análisis y gestión de recursos visuales en sitios web.

Cuándo usarlo

  • Cuando necesitas obtener todas las URLs de imágenes de una página web para análisis SEO o auditoría de contenido.
  • Al trabajar con sitios web que utilizan carga diferida (lazy loading) y quieres extraer las imágenes reales cargadas.
  • Para identificar y listar imágenes responsivas definidas con atributos srcset en el código HTML.

Cómo funciona

  • Pega el código fuente HTML en el área de texto proporcionada.
  • Selecciona las opciones deseadas: incluir atributos data-src para imágenes de carga diferida, srcset para imágenes responsivas, eliminar duplicados y ordenar los resultados.
  • La herramienta analiza el HTML, extrae las URLs de imagen según las reglas configuradas y devuelve una lista JSON con los resultados.
  • Puedes copiar o descargar la lista de URLs para su uso posterior.

Casos de uso

Auditoría SEO para verificar la presencia y optimización de imágenes en un sitio web.
Migración de contenido, donde se necesita extraer todas las URLs de imágenes de un sitio antiguo.
Análisis de diseño responsivo, identificando las diferentes versiones de imágenes para distintos tamaños de pantalla.

Ejemplos

1. Extraer imágenes de una página para auditoría SEO

Especialista en SEO
Contexto
Un especialista en SEO necesita analizar todas las imágenes de una página web para asegurar que están optimizadas y tienen atributos alt.
Problema
El código HTML es extenso y contiene imágenes con carga diferida, haciendo difícil la extracción manual.
Cómo usarlo
Pega el código fuente de la página en la herramienta, activa 'Incluir Atributos data-src' y 'Eliminar Duplicados', luego ejecuta la extracción.
Configuración de ejemplo
Opciones: includeDataSrc=true, uniqueOnly=true
Resultado
Obtiene una lista JSON única de todas las URLs de imágenes, incluyendo las de carga diferida, lista para análisis.

2. Identificar imágenes responsivas en un sitio moderno

Diseñador web
Contexto
Un diseñador web está revisando un sitio para asegurar que las imágenes responsivas están correctamente implementadas.
Problema
El sitio usa srcset para diferentes resoluciones, y necesita listar todas las variantes.
Cómo usarlo
Copia el HTML relevante, pégalo en la herramienta, activa 'Incluir Atributos srcset' y ordena alfabéticamente.
Configuración de ejemplo
Opciones: includeSrcSet=true, sortBy=alphabetical
Resultado
Recibe una lista ordenada de URLs de imágenes responsivas, facilitando la verificación de implementación.

Probar con muestras

html, image, video

Hubs relacionados

Preguntas frecuentes

¿Qué tipos de atributos de imagen soporta la herramienta?

Soporta atributos src, data-src (para carga diferida) y srcset (para imágenes responsivas).

¿Puedo extraer imágenes de múltiples páginas a la vez?

No, esta herramienta procesa un código HTML a la vez. Para múltiples páginas, necesitas pegar cada código por separado.

¿Cómo maneja las URLs duplicadas?

Con la opción 'Eliminar Duplicados' activada por defecto, se eliminan las URLs repetidas de los resultados.

¿En qué formato se devuelven los resultados?

Los resultados se devuelven en formato JSON, con una lista de URLs de imagen.

¿Es necesario instalar algo para usar esta herramienta?

No, es una herramienta basada en navegador. Solo necesitas acceso a internet y un navegador web.

Documentación de la API

Punto final de la solicitud

POST /es/api/tools/image-source-extractor

Parámetros de la solicitud

Nombre del parámetro Tipo Requerido Descripción
htmlCode textarea -
includeDataSrc checkbox No También extraer de atributos data-src (imágenes de carga diferida)
includeSrcSet checkbox No También extraer de atributos srcset (imágenes responsivas)
uniqueOnly checkbox No Elimina URLs de imagen duplicadas de los resultados
sortBy select No Elija cómo ordenar las URLs de imagen extraídas

Formato de respuesta

{
  "key": {...},
  "metadata": {
    "key": "value"
  },
  "error": "Error message (optional)",
  "message": "Notification message (optional)"
}
Datos JSON: Datos JSON

Documentación de MCP

Agregue este herramienta a su configuración de servidor MCP:

{
  "mcpServers": {
    "elysiatools-image-source-extractor": {
      "name": "image-source-extractor",
      "description": "Extrae URLs de imagen (atributos src) del código fuente HTML. Admite imágenes de carga diferida y atributos srcset.",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=image-source-extractor",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Puede encadenar múltiples herramientas, por ejemplo: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, máximo 20 herramientas.

Si encuentra algún problema, por favor, póngase en contacto con nosotros en [email protected]