Convertir un fichier image de données base64 en angularjs

obtenir un fichier corrompu lors de la conversion d’un fichier base64 en image dans angularjs quelqu’un peut-il me suggérer comment convertir un fichier base64 en image dans angularjs

J’utilise cette méthode pour convertir un fichier base64 en image

var imageBase64 = “image base64 data”; var blob = new Blob ([imageBase64], {type: ‘image / png’});

À partir de ce blob, vous pouvez générer un object fichier.

var fichier = nouveau fichier ([blob], ‘imageFileName.png’);

Tout d’abord, vous convertissez dataURL en Blob

var blob = dataURItoBlob(imageBase64); function dataURItoBlob(dataURI) { // convert base64/URLEncoded data component to raw binary data held in a ssortingng var byteSsortingng; if (dataURI.split(',')[0].indexOf('base64') >= 0) byteSsortingng = atob(dataURI.split(',')[1]); else byteSsortingng = unescape(dataURI.split(',')[1]); // separate out the mime component var mimeSsortingng = dataURI.split(',')[0].split(':')[1].split(';')[0]; // write the bytes of the ssortingng to a typed array var ia = new Uint8Array(byteSsortingng.length); for (var i = 0; i < byteString.length; i++) { ia[i] = byteString.charCodeAt(i); } return new Blob([ia], {type:mimeString}); } 

puis

 var file = new File([blob], 'fileName.jpeg', {type: "'image/jpeg"}); 

Votre code a l’air correct sauf pour un point:

Les données que vous donnez à l’object Blob ne sont pas des données blob, c’est un texte qui est codé en base64. Vous devez décoder les données avant de les insérer.

Une fois que je ne sais pas quelle API vous souhaitez utiliser, je vais utiliser une pseudo-fonction appelée decodeBase64, que nous comprendrons faire l’inverse de l’encodage Base64 (il existe de nombreuses implémentations pour cette fonction sur le Web).

Votre code devrait ressembler à ceci:

 // base64 already encoded data var imageBase64 = "image base64 data"; //this is the point you should use decodedImage = decodeBase64(imageBase64) //now, use the decodedData instead of the base64 one var blob = new Blob([decodedImage], {type: 'image/png'}); ///now it should work properly var file = new File([blob], 'imageFileName.png'); 

En tout cas, je ne vois pas la nécessité d’utiliser AngularJS là-bas une fois que vous n’utilisez pas déjà.