kennethjiang / js-file-download

MIT License
918 stars 119 forks source link

export CSV encoding utf-8 issue #56

Open phamxuanphuc opened 4 years ago

phamxuanphuc commented 4 years ago

I did it but 'ı,ü,ö,ğ,ş' this characters looks like 'ı ü ö ÄŸ ÅŸ' in the CSV file. Can anyone solve this problem?

SouzaJBR commented 4 years ago

I have the same problem, but in my case, it is caused by the CSV reader (LibreOffice) choosing a wrong charset to open the file. I can open the downloaded file without the issue in a text editor (like Notepad).

To help the reader detect the correct charset, I included a BOM at the beginning, as it showed here.

fileDownload("\uFEFF" + outputContent, 'myFile.csv', 'text/csv');
littlehome-eugene commented 4 years ago

I'm having same problem, SouzaJBR 's answer is not working for me unfortunately..

kindrowboat commented 4 years ago

@littlehome-eugene, sorry to hear that. Could you post some code that reproduces your issue?

littlehome-eugene commented 4 years ago
     dispatch(downloadSearchDeliveryGroup(params)).then((response) => {
       let filename =
         response.headers['content-disposition'].split('filename=')[1] ||
         'order.csv'
       // var bom = new Uint8Array([0xef, 0xbb, 0xbf])
       var mime = 'text/csv; charset=utf-8'
       FileDownload('\uFEFF' + response.data.toString(), filename, mime)
     })

I tried the above version, and the with bom version as well..

kindrowboat commented 4 years ago

Thanks for getting back so promptly. Could you also please provide a sample CSV file that reproduces the issue? Lastly, could you let me know what browser you're using, and what program you're using to open the CSV file?

littlehome-eugene commented 4 years ago

I used chrome

I used microsoft excel (not sure which version, but I was on windows 10, the computer was bought less than 6 month, so fairly new version of office I guess)

attaching the sample file as well.

order-1.csv.zip

kindrowboat commented 4 years ago

I was not able reproducing the issue. I made this codesandbox that replicates fetching the CSV through an AJAX request, and was able to download the CSV and load it into Excel 365.

Steps

  1. downloaded and unzipped your sample CSV
  2. loaded it in Excel successfully
  3. removed the BOM
  4. confirmed that Excel could no longer load the CSV (had gibberish output)
  5. made code sandbox:
    1. added the CSV without the BOM
    2. made front-end that makes a fetch API request to get the CSV
    3. save/download the file using fileDownload(blob, "out.csv", "text/csv;charset=utf-8", "\uFEFF")
  6. downloaded CSV through code sandbox output page
  7. loaded output CSV into Excel successfully

Could you try using the sandbox to download the CSV and see if it loads in your copy of Excel? Note: you can't use the IDE's built in web-browser due to permissions issues. You'll have to open the app URL in it's own tab/window.

kindrowboat commented 4 years ago

@littlehome-eugene did you have a chance to look into this more?

littlehome-eugene commented 4 years ago

@motevets

We couldn't fix it using js-file-download

      const bom = "\uFEFF"
      var csvString = response.data;
      var a = window.document.createElement('a');
      a.setAttribute('href', 'data:text/csv; charset=utf-8,'+bom + encodeURIComponent(bom+csvString));
      a.setAttribute('download', 'order.csv');
      window.document.body.appendChild(a);
      a.click();

is what we are using now.

littlehome-eugene commented 4 years ago

Oh I thought you wanted my solution..

ok i'll try what you suggested..

littlehome-eugene commented 4 years ago

I changed above line to FileDownload(response.data, 'out.csv', 'text/csv;charset=utf-8', '\uFEFF')

and the file is not readable.. I didn't try this in your sandbox(?) I tried it on our test server