I want to make a link for downloading image files. But the image is opening in browser and users have to click and save from there. I don't want this. I want user to click my link and file downloads automatically.

CodePudding user response：

Use download attribute on anchor tag. When you add the download attribute, it will turn that into a download link. The downloaded file will have the same name as the original filename. If you set a custom filename by passing a value to the download attribute, it will save with that name.

<a href="abcd.jpg" download>Download Image</a>
<a href="abcd.jpg" download="flower.jpg"> Download Image </a>

From MDN: The download attribute only works for same-origin URLs. So if the href is not the same origin as the site, it won't work. In other words, you can only download files that belongs to that website. This attribute follows the same rules outline in the same-origin policy.

Example:

www.website.com <- your domain
www.website.com/product/img.jpg <- same-origin
www.anotherwebsite.com/file.jpg <- Not work, cause it is not same-origin