Download png from link, Cannot get download of png to work with a link |
Download png from link, Cannot get download of png to work with a link |
Urgaan |
May 16 2018, 06:04 AM
Post
#1
|
Group: Members Posts: 3 Joined: 16-May 18 Member No.: 26,646 |
Hi all,
I've been wanting to get an export function to work on my site, which almost works perfectly, it just does not download automatically. Currently it generates this: <a target="_blank" download="MediumRandomNewick_treemap_outer.png" href="blob:http://localhost:8080/c02ebb93-19b9-43fa-872d-b32fc02dc56f">Export</a> But this is not clickable and also does not force the download, can anyone tell me how I would go about force downloading? Preferably with JavaScript. |
Christian J |
May 16 2018, 08:53 AM
Post
#2
|
. Group: WDG Moderators Posts: 9,658 Joined: 10-August 06 Member No.: 7 |
It seems to work if the URL in the HREF value is valid (even if the file doesn't exist). I don't know anything about blob:http, so I can't tell what's going on there.
The TARGET attribute is not necessary for this, neither is javascript. |
Urgaan |
May 17 2018, 03:47 AM
Post
#3
|
Group: Members Posts: 3 Joined: 16-May 18 Member No.: 26,646 |
Removing the target attribute made it clickable, I got the force download to work but sadly it is the SVG element with the CSS in-line (which is partially what I wanted).
If I can get the SVG element out of the link I can easily download it as a png, any idea how I could go about doing that? can I use the link in the <a>? |
Christian J |
May 17 2018, 07:14 AM
Post
#4
|
. Group: WDG Moderators Posts: 9,658 Joined: 10-August 06 Member No.: 7 |
|
pandy |
May 17 2018, 03:28 PM
Post
#5
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
I guess the blob URL leads to an SVG image.
|
Christian J |
May 17 2018, 04:34 PM
Post
#6
|
. Group: WDG Moderators Posts: 9,658 Joined: 10-August 06 Member No.: 7 |
Seems the DOWNLOAD attribute at least works with data URIs like this:
CODE <a download="test.png" href="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg==">Example</a> (the above should generate an image file depicting a red dot). |
pandy |
May 18 2018, 12:53 AM
Post
#7
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
Duh. I didn't notice the 'data:image/png;base64' bit. Well, then I'm stumped too.
|
Urgaan |
May 18 2018, 01:41 AM
Post
#8
|
Group: Members Posts: 3 Joined: 16-May 18 Member No.: 26,646 |
Yeah the link downloads an SVG element as a png (as in, it is a png file, but opening it in a text editor just shows a standard html SVG element).
Sorry if I don't explain things well, not really good at explaining. This post has been edited by Urgaan: May 18 2018, 01:46 AM |
Christian J |
May 18 2018, 05:08 AM
Post
#9
|
. Group: WDG Moderators Posts: 9,658 Joined: 10-August 06 Member No.: 7 |
Assuming the blob URI does reference a SVG correctly (I can't tell), maybe you could convert it to a base64 data URI? Seems there are javascript functions for that nowadays.
|
pandy |
May 18 2018, 08:04 AM
Post
#10
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
Duh. I didn't notice the 'data:image/png;base64' bit. Well, then I'm stumped too. ... because it was never there. I thought you quoted from the OP's post. I googled some and if I understand it right, the blob protocol can't be used like this at all, hardcoded. It can only be used programmatically. If that is true only the URL in the download attribute is used. An image can't be an SVG and a PNG at the same time. Does it open normally in an image editor? I know for example Irfan View opens images with the wrong extension but warns about it an offers to rename them properly. Most standard image editors or viewers don't handle SVG at all. |
Christian J |
May 18 2018, 08:21 AM
Post
#11
|
. Group: WDG Moderators Posts: 9,658 Joined: 10-August 06 Member No.: 7 |
I thought you quoted from the OP's post. No it's from Wikipedia. QUOTE only the URL in the download attribute is used. Note that the attribute value only suggests a filename, it's not a actual URL. QUOTE Does it open normally in an image editor? I know for example Irfan View opens images with the wrong extension but warns about it an offers to rename them properly. Most standard image editors or viewers don't handle SVG at all. That doesn't affect how the browser handles the download though, you can name the download file "foo.bar" and it will still download. But if you want the downloaded file to be usable (once downloaded), you must of course use a working file extension (at least in Windows). |
pandy |
May 18 2018, 03:00 PM
Post
#12
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
only the URL in the download attribute is used. Note that the attribute value only suggests a filename, it's not a actual URL. I see. I confess I haven't looked into the download attribute, just noted it exists. QUOTE QUOTE Does it open normally in an image editor? I know for example Irfan View opens images with the wrong extension but warns about it an offers to rename them properly. Most standard image editors or viewers don't handle SVG at all. That doesn't affect how the browser handles the download though, you can name the download file "foo.bar" and it will still download. But if you want the downloaded file to be usable (once downloaded), you must of course use a working file extension (at least in Windows). Well, the OP said he downloaded it and opened it in a text editor. Anyway, the blob thing must somehow work anyway, but what does it do? |
Christian J |
May 19 2018, 04:07 PM
Post
#13
|
. Group: WDG Moderators Posts: 9,658 Joined: 10-August 06 Member No.: 7 |
I think we need more information about what the OP is doing.
- Where does the BLOB come from? If it's from a database, maybe it's simplest to convert it to a base64 data URI on the server side, and then use that for the download. - How and where is a SVG generated, and where is it used? The OP haven't shown any code example of that. |
pandy |
May 20 2018, 09:10 AM
Post
#14
|
🌟Computer says no🌟 Group: WDG Moderators Posts: 20,731 Joined: 9-August 06 Member No.: 6 |
I read that a blob URL references an object that is in the browser's memory and not a physical file. Beats me how it, in this case, got into the memory to start with.
|
Lo-Fi Version | Time is now: 26th April 2024 - 02:27 PM |