Comment puis-je obtenir l'URL des données d'une image en JavaScript sans la retélécharger ?

Obtention de l'URL des données d'image en JavaScript

Cette question recherche une méthode pour récupérer l'URL des données d'une image qui a déjà été chargée sur un page Web utilisant JavaScript, spécifiquement destinée à être utilisée dans les scripts Greasemonkey avec Firefox. L'objectif est d'obtenir le contenu encodé en base64 de l'image sans encourir la surcharge liée à son nouveau téléchargement.

Solution :

1. Créer un canevas Élément : Créez un élément de canevas vide dont les dimensions correspondent à l'image à créer. encodé.
2. Copier les données de l'image : Utilisez la fonction "drawImage" pour copier les données de l'image sur l'élément canevas. Cette étape suppose que l'image a déjà été entièrement chargée.
3. Obtenir l'URL de données : Utilisez la fonction "toDataURL" pour récupérer une URL de données dans le format souhaité, qui peut être soit PNG ou JPEG. La solution fournie utilise une RegExp pour extraire uniquement le contenu encodé en base64 de l'URL de données.

Remarque :

a. Cette méthode ne fonctionne que lorsque l'image est hébergée sur le même domaine que la page Web.
b. L'image résultante est une version réencodée, et non une réplique exacte du fichier original.
c. Le code JavaScript fourni suppose un environnement Greasemonkey.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!