Catégories

Extracteur de Source d'Image

Extrayez les URLs d'image (attributs src) du code source HTML. Prend en charge les images en chargement différé et les attributs srcset.

Extrayez également des attributs data-src (images en chargement différé)

Extrayez également des attributs srcset (images responsives)

Supprime les URLs d'image en double des résultats

Choisissez comment trier les URLs d'image extraites

Points clés

Catégorie
Text Processing
Types d’entrée
textarea, checkbox, select
Type de sortie
json
Couverture des échantillons
4
API disponible
Yes

Vue d’ensemble

L'Extracteur de Source d'Image est un outil conçu pour extraire rapidement les URLs d'images à partir de code HTML. Il gère les images en chargement différé via data-src et les attributs srcset pour une extraction complète des sources d'images.

Quand l’utiliser

  • Lorsque vous avez du code HTML et besoin de lister toutes les URLs d'images qu'il contient.
  • Pour analyser des pages web avec des images en chargement différé et récupérer leurs sources via data-src.
  • Quand vous travaillez avec des images responsives utilisant srcset et voulez extraire toutes les variantes d'URLs.

Comment ça marche

  • Collez votre code source HTML dans le champ de texte dédié.
  • Activez les options pour inclure les attributs data-src (images en chargement différé) ou srcset (images responsives) si nécessaire.
  • Choisissez de supprimer les doublons et de trier les URLs alphabétiquement selon vos besoins.
  • Lancez l'extraction pour obtenir une liste JSON des URLs d'images extraites.

Cas d’usage

Scraping web pour collecter et analyser les images à partir de pages HTML.
Audit SEO pour vérifier les URLs d'images et leur optimisation sur un site.
Migration de contenu pour extraire et réorganiser les images lors de la refonte d'un site web.

Exemples

1. Extraction d'images pour un audit de site

Contexte
Un consultant en référencement doit analyser les images d'un site e-commerce pour identifier les problèmes de performance.
Problème
Le site utilise des images avec src, data-src pour le chargement différé, et srcset pour différentes résolutions, rendant l'extraction manuelle complexe.
Comment l’utiliser
Copiez le code source de la page d'accueil, collez-le dans l'outil, activez 'Inclure data-src' et 'Inclure srcset', puis extrayez avec suppression des doublons.
Résultat
Une liste JSON complète de toutes les URLs d'images, permettant d'auditer les sources et d'optimiser le chargement.

2. Collecte d'images responsives pour un projet

Contexte
Un développeur front-end prépare un projet de refonte et doit récupérer toutes les variantes d'images responsives d'un site existant.
Problème
Les images utilisent srcset pour servir différentes tailles, et il faut extraire toutes les URLs sans les modifier.
Comment l’utiliser
Collez le code HTML de la page cible, cochez uniquement 'Inclure srcset', désactivez 'Supprimer les doublons' pour voir toutes les occurrences, et extrayez sans tri.
Résultat
Un JSON détaillé avec toutes les URLs d'images et leurs variantes srcset, facilitant la migration vers le nouveau design.

Tester avec des échantillons

html, image, video

Hubs associés

FAQ

Quels attributs d'image sont extraits par défaut ?

Par défaut, seuls les attributs src des balises img sont extraits. Activez les options pour inclure data-src et srcset.

Puis-je extraire des images d'un site web en direct ?

Non, vous devez d'abord copier le code source HTML de la page et le coller dans l'outil pour l'analyse.

Comment sont gérés les doublons dans les résultats ?

Par défaut, les URLs en double sont supprimées. Vous pouvez désactiver cette option pour conserver toutes les occurrences.

Quel est le format de sortie des URLs extraites ?

Les URLs sont retournées au format JSON, sous forme d'un tableau, faciles à utiliser dans d'autres applications.

L'outil trie-t-il automatiquement les résultats ?

Non, par défaut, l'ordre d'origine est conservé. Vous pouvez choisir un tri alphabétique si souhaité.

Documentation de l'API

Point de terminaison de la requête

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

Paramètres de la requête

Nom du paramètre Type Requis Description
htmlCode textarea Oui -
includeDataSrc checkbox Non Extrayez également des attributs data-src (images en chargement différé)
includeSrcSet checkbox Non Extrayez également des attributs srcset (images responsives)
uniqueOnly checkbox Non Supprime les URLs d'image en double des résultats
sortBy select Non Choisissez comment trier les URLs d'image extraites

Format de réponse

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

Documentation de MCP

Ajoutez cet outil à votre configuration de serveur MCP:

{
  "mcpServers": {
    "elysiatools-image-source-extractor": {
      "name": "image-source-extractor",
      "description": "Extrayez les URLs d'image (attributs src) du code source HTML. Prend en charge les images en chargement différé et les attributs srcset.",
      "baseUrl": "https://elysiatools.com/mcp/sse?toolId=image-source-extractor",
      "command": "",
      "args": [],
      "env": {},
      "isActive": true,
      "type": "sse"
    }
  }
}

Vous pouvez chaîner plusieurs outils, par ex.: `https://elysiatools.com/mcp/sse?toolId=png-to-webp,jpg-to-webp,gif-to-webp`, max 20 outils.

Si vous rencontrez des problèmes, veuillez nous contacter à [email protected]