CODEWITHSUNDEEP
phpjavascripthtmlimagescreenshot
sourcingsynergy
sourcingsynergy

Reputation: 605

How to Prevent Image SaveAs + Prevent Image Drag&Drop to Desktop + Prevent Screenshot on a Desktop Browser

What are the best practices/methods/languages for Preventing the following:

..on a desktop browser

(have witnessed the use of a 'blacked-out-screen' when a screenshot is attempted, and the implementation of images that are 'untouchable'..)

Upvotes: 0

Views: 460

Answers (2)

toastrackengima
toastrackengima

Reputation: 8732

To prevent the user right-clicking on the image and choosing Save As, you can add the code oncontextmenu="return false". oncontextmenu detects the user right-clicking and return false stops the action.

Then if you do the code draggable="false" the user can't drag the image, even if they select it. I don't think there is a way to stop people using screengrabbers, but here is some code that stops Google Images and other search engines grabbing the image: <meta name="robots" content="noimageindex"></meta>.

So all in all, try this method: place <meta name="robots" content="noimageindex"></meta> in the head of your document, and then <img src="mygreatimage.png" alt="An awesome image" oncontextmenu="return false" draggable="false"> in the document body.

Upvotes: 1

JT Nolan
JT Nolan

Reputation: 1210

No Drag & Drop

document.getElementById('my-image').ondragstart = function() { return false; };

One way to prevent Save As (not really prevent but slow down a bit) would be to create a div with the inline styling that links to an image.

<div style="width: 200px; height: 200px; background: url('yourcraphere.jpg');"></div>

I'm almost certain you cannot disable screenshots. Screenshots are not contingent on browser permission, that's an OS thing. You could try and white everything out if the user clicks the print screen button?

Users will always be able to look in your resources with a developer tool and grab whatever image you're using. Hopefully these methods will help prevent most people from stealing whatever content you may want to keep safe... you could also try a watermark. Hope that helps.

Upvotes: 5

Related Questions