'Downloading/Opening .csv file using Google chrome, it changes extension of .csv file to .xls

I have an a tag in my html file that is pointed to a .csv file. Every time I click on the link it downloads the same file in .xls extension. Why?

I tried the following: 

<a href="./example.csv" target="_blank">File download</a>
<a href="./example.csv" download>File download</a>
<a href="./example.csv" type="text/comma-separated-values">File download</a>
<a href="./example.csv" type="text/csv">File download</a>

I tried to open the file with the file:///myfolder/example.csv protocol but all of these had the same outcome.

Whereas in Firefox, IE, Edge this downloads the file in .csv extension.

How can I get chrome to download the .csv file in the .csv extension?

htmlcsvgoogle-chromedownloadanchor


Solution 1:[1]

Locally on Windows 10 machine Google Chrome downloaded .csv file with .xls extension. But when I uploaded the same project to GitHub Pages, Google Chrome started downloading file with correct .csv extension.

So the solution is either in webserver settings or just to test outside of the local environment.

Solution 2:[2]

I didn't find any solution for it so I have made a work around:

      if (fileType === 'text/csv') {
        FileSaver.saveAs(newBlob, `${data}.csv`);
      } else {
        FileSaver.saveAs(newBlob, `${data}`);
      }

This is working for me, if you find that browser makes the same issue for any other file and this file is not csv, try to implement it like this and it will also work.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 Fyodor Menshikov
Solution 2 halfer

Related Questions