Categorias

Extrator de Fonte de Imagem

Extraia URLs de imagem (atributos src) do código fonte HTML. Suporta imagens de carregamento lento e atributos srcset.

Também extrair de atributos data-src (imagens de carregamento lento)

Também extrair de atributos srcset (imagens responsivas)

Remove URLs de imagem duplicadas dos resultados

Escolha como ordenar as URLs de imagem extraídas

Fatos principais

Categoria
Text Processing
Tipos de entrada
textarea, checkbox, select
Tipo de saída
json
Cobertura de amostras
4
API disponível
Yes

Visão geral

O Extrator de Fonte de Imagem é uma ferramenta eficiente para extrair URLs de imagens diretamente do código fonte HTML. Com suporte para atributos padrão 'src', além de 'data-src' para carregamento lento e 'srcset' para imagens responsivas, ele simplifica a coleta de ativos visuais de qualquer página web.

Quando usar

  • Ao precisar coletar rapidamente todas as URLs de imagens de uma página para download ou auditoria.
  • Quando você deseja extrair imagens de sites que utilizam técnicas de carregamento lento (lazy loading).
  • Ao analisar a estrutura de imagens responsivas que utilizam o atributo srcset em um site.

Como funciona

  • Cole o código fonte HTML da página desejada na área de texto.
  • Selecione as opções adicionais, como incluir 'data-src' ou 'srcset', conforme a necessidade do seu projeto.
  • Escolha se deseja remover duplicatas e definir a ordenação dos resultados.
  • Clique em processar para obter a lista organizada de URLs de imagem em formato JSON.

Casos de uso

Criação de bibliotecas de ativos visuais a partir de páginas de portfólio ou catálogos.
Auditoria de SEO para verificar se todas as imagens de uma página possuem fontes corretas.
Extração de links de imagens para automação de downloads em massa ou migração de conteúdo.

Exemplos

1. Extração de imagens de um catálogo

Desenvolvedor Web
Contexto
Um desenvolvedor precisa migrar um catálogo de produtos e coletar todas as URLs das imagens de um site antigo.
Problema
O site utiliza carregamento lento, escondendo as URLs reais em atributos 'data-src'.
Como usar
Cole o HTML da página, marque a opção 'Incluir Atributos data-src' e selecione a ordenação alfabética.
Configuração de exemplo
includeDataSrc: true, uniqueOnly: true, sortBy: 'alphabetical'
Resultado
Uma lista limpa e organizada de todas as URLs de produtos, pronta para ser importada no novo sistema.

2. Análise de imagens responsivas

Analista de SEO
Contexto
O analista precisa verificar se as imagens responsivas de um site estão configuradas corretamente com o atributo srcset.
Problema
Identificar todas as variações de tamanho de imagem declaradas no código fonte.
Como usar
Cole o HTML da página e ative a opção 'Incluir Atributos srcset'.
Configuração de exemplo
includeSrcSet: true, uniqueOnly: false, sortBy: 'none'
Resultado
Extração completa de todas as fontes de imagem responsivas, permitindo a validação técnica dos tamanhos de arquivo.

Testar com amostras

html, image, video

Hubs relacionados

FAQ

Quais atributos de imagem a ferramenta suporta?

A ferramenta suporta o atributo padrão 'src', além de 'data-src' (comum em carregamento lento) e 'srcset' (para imagens responsivas).

É possível remover URLs repetidas da lista?

Sim, a ferramenta possui uma opção para remover duplicatas automaticamente, garantindo uma lista limpa e única.

Como as URLs extraídas são ordenadas?

Você pode optar por manter a ordem original de aparição no HTML ou ordenar as URLs alfabeticamente (A-Z).

A ferramenta funciona com sites que usam lazy loading?

Sim, ao ativar a opção 'Incluir Atributos data-src', a ferramenta capturará as URLs de imagens que utilizam essa técnica.

Qual é o formato de saída dos dados?

Os resultados são fornecidos em formato JSON, facilitando a integração com outros sistemas ou fluxos de trabalho.

Documentação da API

Ponto final da solicitação

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

Parâmetros da solicitação

Nome do parâmetro Tipo Requerido Descrição
htmlCode textarea Sim -
includeDataSrc checkbox Não Também extrair de atributos data-src (imagens de carregamento lento)
includeSrcSet checkbox Não Também extrair de atributos srcset (imagens responsivas)
uniqueOnly checkbox Não Remove URLs de imagem duplicadas dos resultados
sortBy select Não Escolha como ordenar as URLs de imagem extraídas

Formato de resposta

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

Documentação de MCP

Adicione este ferramenta à sua configuração de servidor MCP:

{
  "mcpServers": {
    "elysiatools-image-source-extractor": {
      "name": "image-source-extractor",
      "description": "Extraia URLs de imagem (atributos src) do código fonte HTML. Suporta imagens de carregamento lento e atributos srcset.",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=image-source-extractor",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Você pode encadear várias ferramentas, ex: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, máx 20 ferramentas.

Se você encontrar algum problema, por favor, entre em contato conosco em [email protected]