HTML Download Attribute - SSL Gotcha
Published:
Heads up! This content is more than six months old. Take some time to verify everything still works as expected.
I ran across a nifty QA issue today. It's certainly a fringe case, but I found no documentation about it anywhere. So I hope this helps you.
Download links are becoming hugely popular. They reduce the overhead of backend programming to force specific headers just to bypass direct navigation.
<a href="/file.pdf" download>Sample File</a>
What I found today was that my download link worked on my local
computer, but not on the development site. This was the case in
Chrome, FireFox, and Safari. At first, I blamed Angular. It turns
out Angular will attempt to navigate to file urls, and likely hit
your "otherwise" redirect. After correct that by adding a
target="_self" attribute, the file still failed to download.
I eventually copied my download link out of Angular, into just a flat little html file. Still the download link was not working. But, only on the development server.
As one of those crazy, swear, drink, set it on fire tests I decided to disable SSL on the server. Our client had asked us to run on a domain with a self signed cert. It turns out this was the problem! All of the major browsers appear to refuse to activate the download from site with an SSL issue, even if you accept the bad cert! You can download the file directly via url if you were to right click and copy the link. But it implements the same protective behavior if you use right click "Save as" functionality too.
There's no warning, no notification. Just... nothing. It's a little obtuse, but this is a very fringe case. Just one more little thing to remember about self signed certificates.