[ravenstine]

There's another way to achieve this in a more malicious way. Granted I haven't tried it in years, but it was possible back in 2017 when I tested it.

The idea is to fake the image that's being displayed in the IMG element by forcing it to show a `background-image` using `height: 0;` and `padding-top`.

In theory, you could make an IMG element show a photo of puppies and if the person chose to Right-click > Save Image As then instead of the dog photo it could be something else.

For some reason I can't Oauth into Codepen so for now I can't recreate it publicly.

[jffry]

Yes, this still works just fine! https://gist.github.com/jffry/8906d4fec025c564c7b396324bedaa...

[ravenstine]

Never gonna give you up...

[Meph504]

You could also just do like we did for years and check the refer for the image request, and if it wasn't your web server you redirect the file to whatever you want, the end user has know what of knowing. and because the trick is done on the server side then viewing your source won't get around it.

This is the same method used to prevent hot linking to images back in the day.

[still_grokking]

Modern browsers suppress the referrer. Relying on it for functionality is not a good idea.

[Meph504]

Fair point, you can accomplish the same by comparing the ip adress that the image request came from against your servers.

[ichicoro]

Wouldn't that just mean comparing the user's public address? It is the browser that is trying to download the image from your servers.

[Meph504]

The shortest route yes, but I'd rather whitelist check, because depending on your infra, there might be a lot more things that make request for the content.

But the concept is the same, server side check the ip of the request, and take action based on that check.

[bellyfullofbac]

Not very new, the technique's probably been around since the 2000's... e.g. you can't right click, save as on the web version of Instagram because all the images are background-images attached to DIVs. In the "old days" there'd be a 1x1 transparent GIF above the image, so any downloader would download that instead.

[trulyme]

More like 1990s, but yes.

[ravenstine]

What you and I describe isn't new, except you're talking about the use with DIV elements which don't have a "Save image as" menu item on right-click.

IMO, browsers should remove `background-image` support from IMG elements for that reason.