Disable to download image from canvas

Question

I added image to canvas element, but visitor than can save that image to local comp. Is there any way to disable that option? I don\'t know, putting some transparent image o

Answer 1

None of this (not even image slicing) stops a user from simply copying the screen on to the clipboard and pasting it into MSpaint or any other image utility, and saving the result. Its trivial to do; And a transparency image is no impediment to this.

The only effective options that I know of are (as was said), watermarking or low quality. *Avoid 1 pixel wide lines or dot watermarks that can be removed easily with a Photoshop filter.

~If its commercial... You could have a pay-wall, and steganographically embed the purchaser's name and or information into the image (or preview), such that if it does get used without permission, at least you know who did it.

Answer 2

I found this question in review of an HTML5 captcha alternative I'm developing. My goal is not to "prevent" users from downloading the image as much as blocking OCR on the image capture. To prevent it, I added a onclick event to the canvas object that resets the canvas element on click. The user can "download" it, but it no longer is the original code presented.

Answer 3

Basicly: if your image is loaded by the Browser you can never protect the user to download it, because if the browser knows where to find the image, the user can find this out as well. So all this download protection only works for users not familiar with computers and the internet and nowadays i think most people are able to download such an image if they really want to.

If you want to prevent users to use your images for their work, you can use images with watermarks or in a lower resolution otherwise can you tell what reason do you have to prevent users from downloading?

Answer 4

So i thought this can help you just disable rightclicks:

    $('#canvas').bind("contextmenu",function(e){
        return false;
    });