Trying to get this file to be downloaded and renamed to "image.png", but every time I click on the download button, the file is always downloaded with the name: "leisa_christmas_false_color.png". Would appreciate any help, thanks.
<a id="download" href="https://www.nasa.gov/sites/default/files/styles/image_card_4x3_ratio/public/thumbnails/image/leisa_christmas_false_color.png" download="image.png">Download</a>
Firefox only allows users to download files of the same origin due to a security concern. The file must come from your own server or domain name, otherwise it will be opened in the browser.
While downloading cross-origin files is allowed in Chrome and the latest Opera (with Chromium/Blink), they will both ignore the attribute value. In other words, the file name will remain unchanged.
Don't use an extension like '.png' in the download attribute. You can't change the extension; it will be automaticly added.
Btw not every Browser actually support the download attribute. For more information take a look here: http://www.w3schools.com/tags/att_a_download.asp
Related
I'm trying to upload my resume to a company's website and I'm getting a C:\fakepath\myfilename,
Does this means that my file can't be uploaded to the website? or is it just for security reasons?
(I tried uploading with Microsoft Edge and Chrome)
When a file is chosen using an <input type="file">, the real path to the source file is not shown in the input's value attribute for obvious security reasons. Instead, the filename is shown, with C:\fakepath\ appended to the beginning of it. There are some historical reasons for this quirk, but it is supported across all modern browsers, and in fact is defined in the spec.
So, the browser shows the fake path for security reasons and it will not cause any issue with the file upload functionality. The file upload will work fine.
References:
Refer to the second point of the Notes section
FileUpload in Chrome giving some fake path value
FakePath issue in Chrome browser
Update: I have concluded that this is a firefox issue. Chrome, Chromium Edge and Safari all work well with my solution. I have created a bug on the firefox bugtracker: https://bugzilla.mozilla.org/show_bug.cgi?id=1658877
I have a front-end that can download a file in 2 ways:
Click button 1 to open the file in the browser
Click button 2 to download the file to the hard drive
The way this works in the front-end is by using the <a download="FILENAME.EXTENSION"> tag and attribute for forcefully downloading the file, and to use <a> (without download) to make it open in the browser.
This works because the API never returns a content-disposition header (We use ASP.NET Core's File() method without the fileName parameter, which doesnt add a content-disposition header in this case) so the download attribute ensures it is downloaded.
Please read the background information before continuing
To try the fix the mentioned background information's issue, I changed our API to always return the following header for a file:
content-disposition: inline; filename=FILENAME.EXTENSION.
My idea is that the browser should open the file in the browser. if this is not possible, it will open a download pop-up and use the filename bit of the content-disposition header to give it a correct name. If it can open the file in the browser but the user pressed the download button, the <a download> should have higher priority and download.
The problem is that when using the <a download> way of downloading, that it STILL tries to open the file in the browser. I can understand why, but I would rather that it would respect the download attribute. I am using Firefox and the front-end and back-end run on the same domain!
Any clues?
For some background info:
We use ASP.NET Core 2.0. And if you use the built-in BaseController.File() method WITH the fileName parameter, it FORCES the attachment bit in a content-disposition header which makes it always download the file. We do not want that, so we used the variant of File() without specifiying a filename, which would not add a content-disposition header; this worked fine...
UNTIL we had to support MS word and MS excel files. When trying to use option 1, the user gets a pop-up like this:
As you can see, the filename is missing because the browser is not sending it in the content-disposition header. And I can't use the download attribute to specify it, because I pressed option 1 which means the file should be opened in the browser. If the file would be a PNG, it would then be forced to download.
At this point, I tried using inline;filename="FILENAME.EXTENSION as my content-disposition header, but this takes priority over the <a download> bit, defeating the purpose.
I can come up with 2 workarounds:
MS Word and MS Excel files must have a attachment bit in their content-disposition header so I can specify the filename and they download to disk, even if you tried opening it directly in browser.
But this isn't pretty; if some user would not have image/pdf support and downloaded an image or PDF file, my issue would still exist because the filename would be download again...
Have a download queryparam with the value 0 or 1 that specifies if the file should be downloaded with a INLINE or ATTACHMENT content-disposition header.
this might, compared to my current situation, be prettier, perhaps. but it is more work, and I wish that <a download> could just work.
I'm trying to access a document template (.dot) that's linked from a company portal, using chrome. When I click on the link, the browser shows me a bunch of garbage. Is there a setting to force chrome to download this type of file and open it in word?
Example of garbage:
For HTML5:
<a href='file.dot' download>Click here to download</a>
'Download' attribute documentation can be read at:
http://www.w3schools.com/tags/att_a_download.asp
Supported since chrome 14.0.
EDIT: However this is controlled by the site. As for client-side settings, i think only changing the .DOT extension to match Word files in Windows, and perhaps even that won't work if chrome uses its own list.
In any case, you can right-click and "Save file as...", but yes, it's annoying.
The download attribute on an anchor element should set the name of the downloaded resource to the value of the download attribute. In the current version of chrome, the download attribute doesn't, however, change the name. Is this not anymore supported? Anything changed?
Here is a post explaining the functioning of the download attrib: http://updates.html5rocks.com/2011/08/Downloading-resources-in-HTML5-a-download
If it worked as expected, the name of the downloaded resource would be MyGoogleLogo. It is, however, the last element (file) of the href.
It seems that the download attribute works only when the resource is retrieved via HTTP from the same server as the linking document. So if you have
<a href=foo.txt download=something.txt>xxx</a>
on a web page, it works, but if it is in a local file, it does not; neither does it work if a web page refers to a resource on another server. By “works” I mean setting the filename; even when it does not “work” in this sense on Chrome (or Firefox), it causes a pure download instead of navigation to the resource, i.e. the resource is downloaded as a file but not opened in the browser.
According to MDN info, “In Firefox 20 this attribute is only honored for links to resources with the same-origin.” This seems to apply to current Firefox, too, in the stronger sense that the download attribute is completely ignored for cross-origin requests.
A client wants a url to be a download link.
Use case is like so:
user gets linked to example.com/download once there, it downloads a pdf file.
Can I do this without php ?
HTML5 introduced the download attribute.
Supporting user-agents will offer to download the file foo.png when clicking this link:
<a href="foo.png" download>Save the image</a>
You can also specify a different default file name that should be used:
<a href="foo.png" download="image.png>Save the image</a>
Read more at http://www.w3.org/TR/html5/links.html#downloading-resources.
Note that this only works for links. When users enter the URL directly into their browsers, this will have no effect, of course. If you want that, you need to send specific HTTP headers. See for example the question: How to force download of a file?. You don’t necessarily need a programming language like PHP for that. You can do it with, for example, .htaccess, too: Force File(image) Download with .htaccess
How a file is displayed is browser specific. Some may force you to download while some directly render it on the browser.
If you want to force the browser to download the file then you can set in Header the
Content-Type : application/octet-stream
You only need a link (anchor tag). The way the link behaves on click will depend on what browser you are and what settings you have in that particular browser. Some browsers will prompt you to open or save the file, other browsers will open the PDF file on a new tab or window.
Download PDF
You'll also need to make sure that the path to the PDF file is correct on the href property of your anchor tag.
Use this (HTML) not PHP:
Download pdf
Use the full url including the pdf file like.
Download