4 ms·
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
by ravenstine 5y ago
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.
- bellyfullofbac 5y agoNot 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 5y agoMore like 1990s, but yes.
- ravenstine 5y agoWhat 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.
- jffry 5y agoYes, this still works just fine! https://gist.github.com/jffry/8906d4fec025c564c7b396324bedaacf https://gist.github.com/jffry/8906d4fec025c564c7b396324bedaa...
- ravenstine 5y agoNever gonna give you up...
- Meph504 5y agoYou 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 5y agoModern browsers suppress the referrer. Relying on it for functionality is not a good idea.
- Meph504 5y agoFair point, you can accomplish the same by comparing the ip adress that the image request came from against your servers.
- ichicoro 5y agoWouldn'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 5y agoThe 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.