Comment convertir une image en chaîne Base64 en JavaScript ?

Convertir une image en chaîne Base64 en JavaScript

Lors de l'interaction avec des serveurs distants ou de la gestion de données d'image en JavaScript, la conversion d'images en chaînes Base64 devient un nécessité. Une chaîne Base64 représente des données binaires au format texte, permettant une transmission sécurisée d'images sur les réseaux.

Il existe plusieurs techniques disponibles pour cette conversion :

1. Approche FileReader :

Cette approche consiste à charger l'image en tant que blob à l'aide de XMLHttpRequest, puis à utiliser la méthode readAsDataURL() de l'API FileReader pour la transformer en dataURL. Une dataURL se compose d'un en-tête (indiquant le format des données) et des données d'image encodées en Base64.

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)
})

En transmettant l'URL de données à la fonction de rappel, vous pouvez récupérer la chaîne d'image encodée en Base64.

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!