-1

For example in this page : https://www.monstermmorpg.com/

I want to download this image into my given target folder

enter image description here

The url of the image is

https://static.monstermmorpg.com/images/HowToPlayTheGame/Main-Game-Screen.webp

So what kind of function i can use in console window of the chrome that would download this image when this page is open without opening any new window tab, or change current window and such

I mean console window of the chrome here

enter image description here

Simply without affecting currently opened window, without changing anything

Furkan Gözükara
  • 22,964
  • 77
  • 205
  • 342
  • Does this answer your question? [How to save a base64 image to user's disk using JavaScript?](https://stackoverflow.com/questions/7951326/how-to-save-a-base64-image-to-users-disk-using-javascript) – jsejcksn Jun 08 '23 at 19:14

3 Answers3

0

You wouldn't be able to download it without opening another window or adding things to the page, as far as I know. You would need to create some kind of link and then emulate a click, but for that you would need to add things to the current page (or create a new page with the link). Someone please correct me if I'm wrong.

CalPal
  • 165
  • 1
  • 2
  • 10
  • You could emulate a click with JavaScript (see [this question](https://stackoverflow.com/questions/30088897/trying-to-download-all-of-the-images-on-the-website-using-javascript) for example), but it would just open the image in the same tab. – drak Jun 08 '23 at 19:12
  • I interpreted OP's requirements of not "changing the current window" to mean not adding anything or altering the dom, but to be honest I'm not exactly sure what they meant. – CalPal Jun 08 '23 at 19:25
  • They later clarified: "Simply without affecting currently opened window", so I assumed they want it downloaded to the device storage – drak Jun 08 '23 at 19:30
0

I am not sure if this will work for your usecase. There is a download attribute available for <a>-tags. As far as i can tell it is meant to specify a name for the file downloaded.

So its meant to be used something like this

<a 
  href="https://example.com/some-file-with-an-ugly-name/as9872uj21a8d792uads32.pdf" 
  download="report.pdf"
>
  Download report
</a>

But it seems that some browser will also treat links with the download attribute as download-links instead of actual links so you may be able to fix this by just putting the download attribute on the <a>-tag like:

<a href="<some-url>" download>Download image</a>
0

Depends... what user gesture would be suitable to initiate such an image download?

I’ll use the right-click for this example...

function DownloadImage(Src){

let A=document.createElement('A'); 

A.target='_blank'; A.href=Src; 

A.download='someimage'; A.click();

}

In your HTML you need to add a oncontextmenu parameter to kick-start the function upon a user right-clicking on the image like this...

<img src="https://static.monstermmorpg.com/images/HowToPlayTheGame/Main-Game-Screen.webp" oncontextmenu="DownloadImage(this.src);" width="500" height="600">

PS: Greetings from Cyprus neighbor :)

Btw, seeing that you’re an expert in C/C++ I need some help too so I’d be happy to help in all things web if you can return the favor in C. Write to me at support@theclassictools.com

Cypriot
  • 1
  • 1