I have my react project where I edit images and generate a new one. Now I want to download the generated image. I am using cloudinary for that and I have the url of the image.
But the main problem is that I am unable to download the image. I tried
<a href="link" download> Download </a>
But it didn't work. It just opens the image but does not downloads it.
I want to only download the image, nothing more.
If you have any idea please do share
Live sandbox https://codesandbox.io/s/interesting-mountain-lf4lk?file=/src/App.js
You won't need an external library to achieve that functionality. Just add the Cloudinary flags
=> attachment
transformation (fl_attachment
in URLs) and that will set the Content-Disposition
header with value 'attachment' and the file will download.
<a href="https://res.cloudinary.com/demo/image/upload/fl_attachment/sample.jpg">Download</a>
You can optionally set a custom filename of the downloaded file by using the format fl_attachment:my_custom_filename
.
<a href="https://res.cloudinary.com/demo/image/upload/fl_attachment:my_custom_filename/sample.jpg">Download</a>