1

J'ai une courte fonction JavaScript qui prendra un fichier téléchargé et affichera l'équivalent hexadécimal. Comparer le fichier original et la sortie dans un éditeur hexadécimal montre qu'ils sont partiellement différents mais pas complètement.Javascript FileReader lit le fichier incorrectement

String.prototype.hexEncode = function(){ 
    var hex, i; 

    var result = ""; 
    for (i = 0; i < this.length; i++) { 
    hex = this.charCodeAt(i).toString(16); 
    result += ("" + hex).slice(-4); 
    } 

    return result 
} 

function upload() { 
    var file = document.getElementById("fileToUpload").files[0]; 
    var reader = new FileReader(); 
    reader.readAsText(file, "windows-1252"); 
    reader.onload = function (evt) { 
    var program = evt.target.result.hexEncode(); 
    program = program; 
    console.log(program); 
    } 
} 

Voici le fichier d'origine et la sortie à côté de l'autre:

2A 2A 54 49 38 33 46 2A 1A 0A 0A 43 72 65 61 74 
2A 2A 54 49 38 33 46 2A 1A AA 43 72 65 61 74 65 

Quelle est la cause de la différence dans les résultats? Toute aide serait grandement appréciée.

+1

au lieu de '.readAsText' qui pourrait modifier le contenu, avez-vous essayé [' .readAsArrayBuffer'] (https: //developer.mozilla .org/fr-fr/docs/Web/API/FileReader/readAsArrayBuffer) à la place? –

+0

N'essayez certainement pas de générer un vidage hexadécimal à partir du résultat readAsText. De plus avec un codage non par défaut. readAsArrayBuffer est ce que vous voulez. – Kaiido

+0

Quel est le résultat attendu? – guest271314

Répondre

1

Pour générer un vidage hexadécimal dans js, vous ne voudrez pas utiliser la méthode readAsText, qui convertira vos données en UCS-2 ou UTF-16, à la place, lisez directement les données binaires que vous obtiendrez la méthode readAsArrayBuffer, et le travail à partir de là:

function hexDump(file) { 
 
    return new Promise((res, rej) => { 
 
    if (!(file instanceof Blob)) rej('wrong input'); 
 
    const reader = new FileReader(); 
 
    reader.onload = e => { 
 
     res(hex(reader.result)); 
 
    }; 
 
    reader.onerror = e => rej('error while reading'); 
 
    reader.readAsArrayBuffer(file); 
 
    }); 
 
    // gotten from https://developer.mozilla.org/en-US/docs/Web/API/SubtleCrypto/digest#Example 
 
    function hex(buffer) { 
 
    const hexCodes = []; 
 
    const view = new DataView(buffer); 
 
    for (let i = 0; i < view.byteLength; i += 4) { 
 
     // Using getUint32 reduces the number of iterations needed (we process 4 bytes each time) 
 
     let value = view.getUint32(i) 
 
     // toString(16) will give the hex representation of the number without padding 
 
     let stringValue = value.toString(16) 
 
     // We use concatenation and slice for padding 
 
     let padding = '00000000' 
 
     let paddedValue = (padding + stringValue).slice(-padding.length).toUpperCase(); 
 
     hexCodes.push(// simple prettyfying 
 
     paddedValue.slice(0,2), 
 
     paddedValue.slice(2,4), 
 
     paddedValue.slice(4,6), 
 
     paddedValue.slice(6,8) 
 
     ); 
 
    } 
 
    return hexCodes.join(' '); 
 
    } 
 
} 
 

 
// How to use it 
 
inp.onchange = e => hexDump(inp.files[0].slice(0, 100)) // for demo I slice the file 
 
    .then(hex => console.log(hex)) 
 
    .catch(e => console.error(e));
<input type="file" id="inp">