33

I have one simple text file and I want to download that file on any anchor tag link.

But when I click on that link txt file shown me but not downloaded.

I have try this code

<html>
    <head>
        <title>File</title>
    </head>
    <body>
        <a href="test.txt">Click here</a>
    </body>
</html>
Allan Pereira
  • 2,572
  • 4
  • 21
  • 28
Dhaval
  • 825
  • 1
  • 9
  • 9
  • possible duplicate of [forcing a file to download](http://stackoverflow.com/questions/925854/forcing-a-file-to-download) – Mr. Alien Jan 13 '14 at 10:04

5 Answers5

71

Download file when clicking on the link (instead of navigating to the file):

<a href="test.txt" download>Click here</a>

Download file and rename it to mytextdocument.txt:

<a href="test.txt" download="mytextdocument">Click here</a>

The download attribute specifies that the target will be downloaded when a user clicks on the hyperlink.

This attribute is only used if the href attribute is set.

The value of the attribute will be the name of the downloaded file. There are no restrictions on allowed values, and the browser will automatically detect the correct file extension and add it to the file (.img, .pdf, .txt, .html, etc.).

If the value is omitted, the original filename is used.

Efekan
  • 1,497
  • 12
  • 31
  • 7
    Please note that this does not work in IE nor Safari. http://caniuse.com/#search=download – SKuijers Aug 27 '15 at 14:13
  • 4
    It doesn't work if the file is serverd by another site or another application in your own site – user1156544 Aug 13 '18 at 16:41
  • 1
    This doesn't work if I try to do this inside of markdown on GitHub. The link just opens the text directly as a webpage as if the `download` was not there. – Aaron Franke Nov 25 '21 at 00:32
6

You can do this

<a href="data:text/plain;charset=UTF-8,test.txt" download>Click here</a>

Or in my case I needed something more dynamic

var downloadFile = function(url){
  let a = document.createElement('a');
  a.href = 'data:text/plain;charset=UTF-8,' + '' + url;
  a.download = url.substr(url.lastIndexOf('/') + 1);
  document.body.appendChild(a);
  a.click();
  document.body.removeChild(a);
}

The main difference was appending

data:text/plain;charset=UTF-8,

to my text file url

downloadFile('http://my.txt');

Winnipass
  • 904
  • 11
  • 22
  • this is awesome! thanks so much, but did you mean prepending the value as opposed to appending? it definitely works when prepending. – Crashalot Feb 15 '20 at 06:28
5

You can use the Content-Disposition header.

You can do it with PHP or with .htaccess.

PHP:

<?php
header("Content-Disposition: attachment");
header("Content-Type: text/plain"); // optional
readfile("yourfile.txt");
?>

And then you can either use the PHP's URL or redirect the TXT's one to it. If you want to use the PHP's URL but want to save the file with the original name you can swap this line in there:

header("Content-Disposition: attachment; filename=yourfile.txt");

.htaccess:

<Files yourfile.txt>
    Header set Content-Disposition attachment
</Files>
PurkkaKoodari
  • 6,703
  • 6
  • 37
  • 58
2

Text files are displayed in the browser when the content-type is sent as text. You'd have to change the server to send it with a different content-type or use a language such as PHP to send it as a download.

0

This will download your text file, and rename it : 

 <a href="http://www.example.com/myfile.txt" download="My Text File">click here</a>
David
  • 4,785
  • 7
  • 39
  • 63
  • 1
    http://caniuse.com/#feat=download - unfortunately it's not working in IE & Safari (OSX + iOS) – Yves Dec 07 '14 at 20:52