FileSaver télécharger fichier ZIP corrompu

Question

Mon code frontal (réagir) reçoit une réponse de mon backend (nœud) et télécharge un fichier zip comme prévu, mais le fichier zip, lorsqu'il est cliqué, va produire un fichier CPGZ au lieu de décompresser le Zip *: français.

React code

downloadResultsFile() { 

fetch(`https://XXXXXXXX/api/download-results-file?jobName=${this.props.selectedRun.jobs[0].env.MIC_JOB_ID}`, { 
    origin: 'same-origin', 
}) 
.then((res) => res.blob()) 
.then((file) => FileSaver.saveAs(file, this.props.selectedRun.jobs[0].env.MIC_JOB_ID + '-results.zip')); 


} 

code Noeud

downloadResults: function(app, s3){ 
app.use('/api', apiRoutes) 

apiRoutes.get('/download-results-file', function(req, res, next){ 
    res.set({'Content-type': 'text/plain'}) 

    var params = { 
    Bucket: 'xxxxx', 
    Delimiter: '/', 
    Prefix: 'xxxxxx' 
    }; 


    var filesArray = [] 
    var files = s3.listObjectsV2(params).createReadStream() 
    var xml = new XmlStream(files) 
    xml.collect('Key') 

    xml.on('endElement: Key', function(item) { 
    filesArray.push(item['$text'].substr(params.Prefix.length)) 
    }) 

    var data = zip(filesArray, req.query.jobName, params) 
    xml.on('end', function() { 

    res.send(data.toString()) 

    })   
}) 
} 

Quand je console.log(res) sur le front-end je reçois un "flux inscriptible" pour un objet. Je convertis cela en un blob puis j'utilise FileSaver pour créer le fichier zip. Toute aide est la bienvenue. Je vous remercie!

Answer 1

Votre serveur envoie un fichier zip, pas un fichier texte. N'utilisez pas 'Content-type': 'text/plain', utilisez plutôt 'Content-type': 'application/zip' ou 'Content-type': 'application/octet-stream'.

Que retourne zip(...)? Je m'attendrais à un buffer nodejs. Si c'est le cas, res.send(data.toString()) décode votre contenu de UTF-8 (the default encoding). Comme ce n'est pas un texte mais un contenu binaire, vous allez corrompre votre contenu ici. Au lieu de cela, utilisez res.send(data).