kennethjiang / js-file-download

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

export CSV encoding utf-8 issue

phamxuanphuc opened this issue · comments

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

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');

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

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

     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..

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?

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

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.

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

@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.

Oh I thought you wanted my solution..

ok i'll try what you suggested..

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