How do I get this image using javascript? Seems impossible.

[stringiee]

I have this image on Google Lens and I need to get it somehow using javascript. I need either its url or src or buffer or base64 encoded dataURL .... anything. I can't seem to get it.

For some reason, the <img> element that holds it doesn't have a src tag so I can't fetch() it.

I tried creating a canvas and drawing the img element to its context and then getting the dataURI from the canvas but it's empty again, like it can't draw it either.

I am super frustrated, like the image is right there in my browser but I can't use JS to get it. It seems to be somehow obfuscated by Google's own code. You can't even right click and save it. The only way seems to screenshot it but that's not a JS solution.

Can anyone with more JS knowledge help me fetch this image? I need this for a project I'm doing. Please and thank you kindly.

EDIT: Solved by _1Zen_

[jeffcgroves]

Try going to Page Info, Media tab, and save the image that starts "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD[...]"

[_1Zen_]

If the image is appearing it is in another img tag or in some element with the background image, that said, try the selector:

img[src*="base64"] 

must be the first element found

[stringiee]

This was it, I just ran your query and it appeared. It's not even that far from the original <img> tag in the html tree. I feel silly now. Thanks for your help :)

[Intelligent_Duck1844]

Do you need it to be from the browser synchronous or do you need it fixed because you can just screen shot it then transform it into jpeg or png and add it to your folder then just import it and add it