Français

Vidéo et sous-titres · Téléchargeur de vignettes YouTube et visionneuse de métadonnées

Comment un navigateur enregistre une image d'origine croisée : récupération, URL Blob et téléchargement

· Comment ça marche

youtube javascript cors

Un JPEG distant devenant un Blob de navigateur et un téléchargement local
Illustration vectorielle originale de ToolAcre

Enregistrer une image d'un autre domaine est plus difficile qu'un lien avec un attribut de téléchargement. Cet article explique pourquoi l'attribut est ignoré pour les URL d'origine croisée, comment les URL de récupération et de blob le résolvent et ce que CORS a à voir avec cela.

L'attribut de téléchargement a ouvert l'image au lieu de la sauvegarder - le problème d'origine croisée

Une ancre pointée vers une origine différente peut naviguer vers une image au lieu d'honorer un nom de fichier souhaité. Un téléchargeur fiable a besoin d'octets lisibles selon les règles d'origine croisée du navigateur, et pas simplement d'un attribut de téléchargement sur une URL distante. Le test visible est simple : l'enregistrement d'un JPEG vérifié devrait créer le nom de fichier ToolAcre sans ajouter une autre requête i.ytimg.com.

ToolAcre récupère déjà chaque candidat JPEG pour déterminer s'il est réel. Conserver le Blob réussi signifie que le téléchargement ultérieur peut utiliser ces mêmes octets au lieu d’émettre une deuxième requête réseau. Cette réutilisation conserve le fichier enregistré identique à l'image dont les dimensions et l'état de l'espace réservé ont été inspectés quelques instants plus tôt.

Pourquoi les navigateurs ignorent le téléchargement pour d'autres origines : une décision de sécurité et ses conséquences

Les navigateurs limitent les téléchargements multi-origines, car une page ne doit pas renommer et enregistrer silencieusement des ressources distantes arbitraires. Le comportement dépend de la réponse distante et de la relation d'origine. Un simple lien n'est donc pas une API universelle de sauvegarde de fichiers. L'attribut `download` ne peut à lui seul garantir qu'une image YouTube distante sera enregistrée sous le nom local demandé.

La conception la plus sûre est explicite : demandez une image publique divulguée, vérifiez la réponse et construisez une URL d'objet gérée par le navigateur uniquement pour les données que la page était autorisée à lire. Si CORS bloque l'accès, JavaScript n'a pas de Blob à valider ou à enregistrer, même si la navigation directe vers l'adresse de l'image peut toujours l'afficher dans un onglet.

La route fetch-and-Blob — récupérer les octets de l'image, les envelopper dans un Blob et créer un blob de même origine : URL

Pour JPEG, sondeThumbnail effectue un CORS GET anonyme, convertit une réponse réussie en un Blob et décode les dimensions. Un Blob utilisable est conservé sur le résultat, tandis que les espaces réservés sont supprimés afin qu'ils ne puissent pas se faire passer pour des téléchargements. Le bouton de téléchargement représente donc des octets vérifiés en mémoire, et non une confiance déduite d'un nom de fichier ou de HTTP 200 seul.

Une URL d'objet peut ensuite représenter ce Blob en mémoire pour une action de sauvegarde locale. Cela ne rend pas la récupération d'origine locale ; Google a fourni les octets directement au navigateur après Fetch. L'adresse `blob:` est un descripteur de navigateur temporaire pour ce corps de réponse, et non un miroir hébergé par ToolAcre ou un droit nouvellement accordé sur l'image source.

CORS permet JPEG téléchargements fetch-and-Blob ; WebP reste un lien uniquement

Le plan impliquait que CORS était une porte générique, mais le comportement livré est spécifique au format. JPEG le téléchargement fetch-and-Blob fonctionne ; le chemin /vi_webp/ est servi sans l'en-tête d'origine croisée requis, donc ToolAcre fournit WebP comme lien uniquement. Un réviseur doit tester les deux familles de chemins séparément au lieu de généraliser les en-têtes de réponse JPEG à chaque format de vignette.

Cette limitation n'est pas réparée en modifiant JavaScript ou en réessayant via ToolAcre, car aucun proxy ToolAcre n'existe. Un bloqueur, une connexion hors ligne ou un proxy d'entreprise peut également arrêter l'une ou l'autre des ressources distantes. L'accès WebP en lien uniquement reflète avec précision ce que le serveur distant autorise la page à faire : pointer sur le fichier, mais ne pas lire ses octets pour le reconditionner.

Nommer le fichier enregistré : pourquoi un téléchargeur devrait le nommer par ID vidéo et taille afin que les fichiers restent identifiables Les noms

téléchargés JPEG utilisent youtube-VIDEO_ID-VARIANT.jpg. L'identifiant et la variante proviennent d'alphabets validés, empêchant les séparateurs de chemin ou les caractères de contrôle arbitraires d'entrer dans le nom de fichier suggéré. L'enregistrement de `maxresdefault` et `hq2` à partir d'une seule recherche devrait donc produire des noms distincts et prévisibles qui peuvent être mis en correspondance avec leurs lignes de résultats.

Un nom de fichier descriptif préserve la provenance lorsque plusieurs tailles se trouvent dans un même dossier. Cela évite également de prétendre que le titre des métadonnées est un nom de système de fichiers sûr, puisque les titres peuvent contenir des signes de ponctuation et changer indépendamment. L'ID immuable identifie la référence vidéo, tandis que le suffixe de variante explique quelle image candidate publiée a fourni les octets.

Exemple concret : enregistrement de deux tailles de vignettes pour une vidéo – la séquence de requêtes et les fichiers qui en résultent

Récupérez une vidéo publique et choisissez deux variantes JPEG disponibles. Chacun a été demandé une fois lors du sondage, décodé pour prouver les dimensions et conservé en tant que Blob ; cliquer sur Enregistrer devrait réutiliser ce résultat et produire deux fichiers clairement nommés. Avec DevTools ouvert, l'absence d'une deuxième demande d'image confirme que la sauvegarde provient de la réponse conservée plutôt que d'un nouveau téléchargement à distance.

Si un candidat renvoie HTTP 200 comme espace réservé 120×90, l'outil le marque comme manquant et ne stocke aucun Blob téléchargeable. Une 404, une autre erreur ou une réponse indécodable est également signalée plutôt que enregistrée. La désactivation de l'action de sauvegarde pour ces lignes empêche un espace réservé générique ou une charge utile d'erreur d'entrer dans un dossier d'actifs sous un nom de variante convaincant.

Ce que cela ne couvre pas : les téléchargements par lots sur de nombreuses vidéos et les hôtes qui bloquent les lectures d'origine croisée

Il n'existe pas de mode batch pour de nombreuses vidéos ni de contournement pour les hôtes qui interdisent la lecture d'origines croisées. Le produit gère une vidéo à la fois et se limite aux deux services Google divulgués. Chaque Blob conservé appartient au jeu de résultats actuel. Il ne doit donc pas être traité comme un cache durable pour les vidéos ultérieures ou les versions futures de la même vignette.

Il ne récupère pas non plus la vidéo ou l'audio, et les enregistrements privés, supprimés ou soumis à une limite d'âge restent indisponibles. Un mécanisme public de sauvegarde de fichiers ne peut pas étendre les droits d'accès ni fabriquer une vignette absente. La création de blob ne commence qu'après l'arrivée des octets d'image lisibles, elle n'offre donc aucun moyen de contourner une réponse refusée ou une variante non publiée.

JPEG récupérer, réutiliser et télécharger des Blob, avec WebP conservé comme lien

Avant Fetch, l'analyse des URL est locale. Ensuite, chaque sonde JPEG et la requête canonique oEmbed partent directement du navigateur avec les informations d'identification omises, sans référent, sans magasin et redirections suivies ; Google voit l'en-tête Origin. Datez les téléchargements importants indépendamment, car ni l'URL de l'objet ni le chemin source prévisible ne conservent une révision miniature antérieure.

Le résultat est délibérément asymétrique : JPEG octets vérifiés peuvent devenir des téléchargements Blob, tandis que cinq URL d'affiche WebP restent des liens externes car leurs réponses ne disposent pas de l'autorisation CORS. L'interface doit préserver cette frontière honnête. Les utilisateurs peuvent ouvrir ou copier une adresse WebP, mais ToolAcre ne peut pas promettre un fichier local WebP renommé à partir d'octets que le navigateur lui interdit de lire.