Genera CSV per Excel tramite JavaScript con caratteri Unicode

Question

Sto provando a generare un file CSV sul lato client utilizzando javascript. Ho seguito the answer on this stackoverflow question. Ho caratteri unicode nel contenuto (caratteri ebraici nel mio caso).

La generazione del file ha esito positivo, tuttavia quando apro il file in Excel - tutti i caratteri Unicode vengono visualizzati come caratteri divertenti. I caratteri ASCII (inglese e numeri) sono presentati bene.

La cosa strana è che se apro il file nel blocco note, i caratteri Unicode mostrano bene. Quindi immagino che questo abbia qualcosa a che fare con Excel e il modo in cui sto salvando il file.

Qualche idea?

Answer 1

Seguendo il commento di Jack Cole e this question, il problema risolto era l'aggiunta di un prefisso DB (\ uFEFF) all'inizio del file.

Questo è il codice di lavoro:

var csvContent = "...csv content..."; 
var encodedUri = encodeURI(csvContent); 
var link = document.createElement("a"); 
link.setAttribute("href", "data:text/csv;charset=utf-8,\uFEFF" + encodedUri); 
link.setAttribute("download","report.csv"); 
link.click(); 

Answer 2

Su un server Nodo/Express, ho cercato la risposta di Shay, ma mi è stato sempre un errore per caratteri non validi nella mia intestazione. Invece, ho aggiunto lo \uFEFF all'inizio del corpo della risposta e ha funzionato.

app.get('/', function (req, res) { 
    var csv = Papa.unparse(...); 
    res.set({ 
     'Content-Type': 'text/csv; charset=UTF-8', 
     'Content-Disposition': 'attachment; filename="file.csv"', 
    }); 
    res.send('\uFEFF' + csv) 
}) 

Answer 3

La soluzione proposta non ha funzionato con tutti i browser, ma ho trovato un modo per farlo funzionare in tutti i browser (Chrome, Firefox, IE11 e anche Edge, ... non so su IE9- 10 dal momento che non ho più accesso a loro).

Devo usare una libreria esterna per codificare encoding.js e funziona incredibilmente bene con unicode (posso vedere il mio emoji unicorno nell'esportazione CSV in Excel).

Quindi, ecco il codice

data = new TextEncoder('utf-16be').encode(csvContent); 

// create a Blob object for the download 
const blob = new Blob(['\uFEFF', data], { 
    type: 'text/csv;charset=utf-8'; 
}); 

// when using IE/Edge, then use different download call 
if (typeof navigator.msSaveOrOpenBlob === 'function') { 
    navigator.msSaveOrOpenBlob(blob, filename); 
} else { 
    // this trick will generate a temp <a /> tag that you can trigger a hidden click for it to start downloading 
    const link = document.createElement('a'); 
    const csvUrl = URL.createObjectURL(blob); 

    link.textContent = 'download'; 
    link.href = csvUrl; 
    link.setAttribute('download', filename); 

    // set the visibility hidden so there is no effect on your web-layout 
    link.style.visibility = 'hidden'; 

    // this part will append the anchor tag and remove it after automatic click 
    document.body.appendChild(link); 
    link.click(); 
    document.body.removeChild(link); 
} 

e il gioco è fatto, funziona in IE/Edge/Chrome/Firefox