Maison >interface Web >js tutoriel >Comment puis-je convertir une image en chaîne Base64 à l'aide de JavaScript ?

Comment puis-je convertir une image en chaîne Base64 à l'aide de JavaScript ?

Susan Sarandon
Susan Sarandonoriginal
2024-12-18 06:25:10462parcourir

How Can I Convert an Image to a Base64 String Using JavaScript?

Conversion d'une image en chaîne Base64 avec JavaScript

L'exigence :

Vous devez convertir une image dans une chaîne Base64 pour l'envoyer à un serveur.

Le Solutions :

JavaScript propose plusieurs approches pour la conversion d'image en Base64.

1. Approche FileReader :

Cette approche utilise l'API FileReader (en particulier, readAsDataURL()) pour convertir un blob chargé à partir d'une URL d'image en une URL de données.

Exemple de code :

function toDataURL(url, callback) {
  var xhr = new XMLHttpRequest();
  xhr.onload = function() {
    var reader = new FileReader();
    reader.onloadend = function() {
      callback(reader.result);
    }
    reader.readAsDataURL(xhr.response);
  };
  xhr.open('GET', url);
  xhr.responseType = 'blob';
  xhr.send();
}

toDataURL('https://www.gravatar.com/avatar/d50c83cc0c6523b4d3f6085295c953e0', function(dataUrl) {
  console.log('RESULT:', dataUrl)
})

Cette approche consiste à utiliser XMLHttpRequest pour récupérer l'image sous forme de blob, puis en utilisant FileReader pour le convertir en dataURL.

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn