Voici le binaire pour une image .JPEG valide.http://Pastebin.ca/raw/2314500
J'ai essayé d'utiliser Python pour enregistrer ces données binaires dans une image.
Comment puis-je convertir ces données en une image .JPEG visible avec Extjs 4?
J'ai essayé ça, mais ça ne marche pas.
data:image/jpeg;base64,+ binary data
Besoin de le convertir en base64.
JS ont la fonction btoa () pour cela.
Par exemple:
var img = document.createElement('img');
img.src = 'data:image/jpeg;base64,' + btoa('your-binary-data');
document.body.appendChild(img);
Mais je pense que ce que vos données binaires dans Pastebin sont invalides - les données JPEG doivent être terminées sur 'ffd9'.
Mettre à jour:
Besoin d'écrire un convertisseur hexadécimal simple en base64:
function hexToBase64(str) {
return btoa(String.fromCharCode.apply(null, str.replace(/\r|\n/g, "").replace(/([\da-fA-F]{2}) ?/g, "0x$1 ").replace(/ +$/, "").split(" ")));
}
Et utilisez-le:
img.src = 'data:image/jpeg;base64,' + hexToBase64('your-binary-data');
Voir exemple de travail avec vos données hex sur jsfiddle
Le format de l'URI des données est:
data:<headers>;<encoding>,<data>
Il vous suffit donc d’ajouter vos données à la chaîne "data: image/jpeg ;,":
var your_binary_data = document.body.innerText.replace(/(..)/gim,'%$1'); // parse text data to URI format
window.open('data:image/jpeg;,'+your_binary_data);
Dans ExtJs, vous pouvez utiliser
xtype: 'image'
rendre une image.
Voici un violon montrant le rendu des données binaires avec extjs.
atob -> convertit ascii en binaire
btoa -> convertit le binaire en ascii
Ext.application({
name: 'Fiddle',
launch: function () {
var srcBase64 = "data:image/jpeg;base64," + btoa(atob("iVBORw0KGgoAAAANSUhEUgAAAAEAAAABCAYAAAAfFcSJAAAADUlEQVR42mP8H8hYDwAFegHS8+X7mgAAAABJRU5ErkJggg=="));
Ext.create("Ext.panel.Panel", {
title: "Test",
renderTo: Ext.getBody(),
height: 400,
items: [{
xtype: 'image',
width: 100,
height: 100,
src: srcBase64
}]
})
}
});