How to Disable Copy Paste (Browser)

Question

I am trying 2 alternatives:

Ignore right-click
Ignore ctrl + C, ctrl + A

This is my code:

function noMenu() {
  return false;
}
function disableCopyPaste(elm) {
  // Disable cut/copy/paste key events
  elm.onkeydown = interceptKeys
  // Disable right click events
  elm.oncontextmenu = function() {
    return false
  }
}
function interceptKeys(evt) {
  evt = evt||window.event // IE support
  var c = evt.keyCode
  var ctrlDown = evt.ctrlKey||evt.metaKey // Mac support
  // Check for Alt+Gr (http://en.wikipedia.org/wiki/AltGr_key)
  if (ctrlDown && evt.altKey) return true
  // Check for ctrl+c, v and x
  else if (ctrlDown && c==67) return false // c
  else if (ctrlDown && c==86) return false // v
  else if (ctrlDown && c==88) return false // x
  // Otherwise allow
  return true
}

And this is my HTML:

<body class="node88" oncontextmenu="return noMenu();" onkeydown="return disableCopyPaste();">

The noMenu() function is working, but disableCopyPaste() doesn't work.

What's the purpose for trying to disable copy/paste? There are almost definitely better solutions, but if all you want help with is this code snippet and not the actual goal, that's OK too. The more context you provide, the better a solution you will get. — Wesley Murch, Mar 31 '12 at 18:25
@Madmartigan - I agree, context is important. But I have seen a few cases with copy-paste disabled(copyrighted?) — Caffeinated, Mar 31 '12 at 18:26
Also an important note, the user will still be able to use print screen, print to OCR, and view source to collect any data contained on the page. — Rich, Mar 31 '12 at 18:29
Until you have very good reason, disabling the context-menu is a very bad idea. Same for copy+paste. The only thing you will achieve this way is making your visitors mad. You can't prevent "stealing your content" anyways. — Christoph, Mar 31 '12 at 18:30
@Christoph +1 for 'You can't prevent "stealing your content" anyways.' ! — Engineer, Mar 31 '12 at 18:32
Please do not disable right-click. For most browsers, the right-click context menu contains legitimate actions other than copy/paste, and users could get really frustrated. — Justin Workman, Mar 31 '12 at 18:35
Maybe just [disable text selection][1]? [1]: http://stackoverflow.com/questions/69430/is-there-a-way-to-make-text-unselectable-on-an-html-page — bendataclear, Mar 31 '12 at 18:40
This is a duplicate post with an accepted solution. >> http://stackoverflow.com/questions/9955178/how-to-ignore-control-c-copy-on-web-browser — Rich, Mar 31 '12 at 18:54
@Christoph Well said! I can't believe almost 10 years later, people are still doing that! — hxin, Dec 17 '21 at 18:04

score 20 · Accepted Answer · answered Mar 31 '12 at 18:35

You can't.

You can sort of try to block some vectors (like hacks to make right clicking more difficult, intercepting ctrl+c, making it difficult to select text)… But they will only sort of work, and it's impossible to block all vectors (edit -> copy? view source? wget? etc…).

If you are trying to protect your content from less technical users, these methods might be okay… But as the comments here suggest, they will frustrate more technical users.

If you have sensitive content that must be protected, you might want to consider embedding it in a Flash blob or a DRM'd PDF. These are still possible to reverse engineer, but it will take a slightly more intelligent attacker.

I don't know many details about them beyond the fact that they exist, but here's Adobe's marketing site which might help get you started: http://www.adobe.com/ca/products/acrobat/protect-pdf-security-encryption.html — David Wolever, May 10 '14 at 16:39

score 11 · Answer 2 · edited May 10 '14 at 11:13

11

Instead of trying to control the users key commands(it is possible some browsers may detect this as malicious code) you can disable selection of text on your page. Although this will not avoid data being copied as stated in your comments.

<!-- Disable Copy and Paste-->
<script language='JavaScript1.2'>
function disableselect(e) {
    return false
}

function reEnable() {
    return true
}

document.onselectstart = new Function (&quot;return false&quot;)

if (window.sidebar) {
    document.onmousedown = disableselect
    document.onClick = reEnable
}
</script>

Place this in your

    <head> </head>

tags and the user cannot select text on your page.

Found on http://myblog-log.blogspot.com/2007/06/disable-copy-and-paste.html

edited May 10 '14 at 11:13

Pacerier

86,231
106
366
634

answered Mar 31 '12 at 18:38

Rich

4,134
3
26
45

Thanks, if i need to edit tags can you say me? example: look my first post to body tags – Rys Mar 31 '12 at 18:50
I have no idea what you just asked me and you have provided no link. – Rich Mar 31 '12 at 18:55
Yes place the script above in your head tags. – Rich Mar 31 '12 at 19:11
Why are you using `new Function ("return false")` instead of just `function () { return false; }`? – Arturo Torres Sánchez May 31 '15 at 22:42

score 8 · Answer 3 · edited May 10 '14 at 08:38

Javascript:

//disable mouse drag select start

document.onselectstart = new Function('return false');

function dMDown(e) { return false; }

function dOClick() { return true; }

document.onmousedown = dMDown;

document.onclick = dOClick;

$("#document").attr("unselectable", "on"); 

//disable mouse drag select end

//disable right click - context menu

document.oncontextmenu = new Function("return false");


//disable CTRL+A/CTRL+C through key board start

//use this function


function disableSelectCopy(e) {

// current pressed key

    var pressedKey = String.fromCharCode(e.keyCode).toLowerCase();

    if (e.ctrlKey && (pressedKey == "c" || pressedKey == "x" || pressedKey == "v" || pressedKey == "a")) {

        return false;

    }

}

document.onkeydown = disableSelectCopy;


//or use this function

$(function () {

    $(document).keydown(function (objEvent) {

        if (objEvent.ctrlKey || objEvent.metaKey) {

            if (objEvent.keyCode == 65 || objEvent.keyCode == 97) {

                return false;

            }

        //}

        }

    });

});

CSS:

//disable selection through CSS for different browsers

#document, #ctl00_MasterPageBodyTag{
    user-select: none;
    -ms-user-select: none;
    -o-user-select:none;
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    -webkit-touch-callout: none;
}

//where #document is the div for which select needs to be disabled and #ctl00_MasterPageBodyTag is the id of the body tag.

score 7 · Answer 4 · answered Oct 13 '17 at 21:26

You can control what text is put into the clipboard:

document.addEventListener('copy', function(e) {
    e.clipboardData.setData('text/plain', 'Please do not copy text');
    e.clipboardData.setData('text/html', '<b>Please do not copy text</b>');
    e.preventDefault();
});

https://developer.mozilla.org/en-US/docs/Web/Events/copy

score 4 · Answer 5 · answered Jul 20 '15 at 16:12

Why not try to make the text unselectable?

.unselectable {
  -webkit-user-select: none;  /* Chrome all / Safari all */
  -moz-user-select: none;     /* Firefox all */
  -ms-user-select: none;      /* IE 10+ */
  user-select: none;          /* Likely future */       
}


/*Mobile*/

-webkit-touch-callout: default   /* displays the callout */
-webkit-touch-callout: none      /* disables the callout */

I will also very soon edit this answer. I'm looking at the same issue. But I found some info on how to over write. I'm writing a JS function that when the user has copied the clipboard gets overwritten. Anyway will post that when done. Still experimenting with it. You can read the article that I found on css tricks.

https://css-tricks.com/copy-paste-the-web/

In Vivaldi (uses Chrome engine) the text doesn't get selected, but it is copied to clipboard after Ctrl+C, which is very weird... — sjngm, Nov 16 '17 at 11:41

score 2 · Answer 6 · answered Dec 23 '20 at 18:40

You can disable "context menu", "copy", "cut" and "paste" in page with:

<script type="text/javascript">
    document.oncontextmenu = new Function('return false')
    document.body.oncut = new Function('return false');
    document.body.oncopy = new Function('return false');
    document.body.onpaste = new Function('return false');
</script>

score 1 · Answer 7 · answered Aug 24 '17 at 07:03

You can use CSS to not allow any selection of text, thus no chance of any copying of text will be there.

Add the below CSS and JS into the body:

CSS:

    <style>
    .unselectable
    {
        -moz-user-select:none;
        -webkit-user-select:none;
        cursor: default;
    }
    html
    {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        -webkit-tap-highlight-color: rgba(0,0,0,0);
    }
</style>

JS:

<script id="wpcp_css_disable_selection" type="text/javascript">
var e = document.getElementsByTagName('body')[0];
if(e)
{
    e.setAttribute('unselectable',on);
}
</script>

score 1 · Answer 8 · answered Jul 12 '18 at 21:55

1

$('some.selector').bind('cut copy paste', function (e) {
    e.preventDefault();
});

This works in Chrome, Firefox, Safari, IE11 and Edge. For my testing, I was working with a <div contenteditable>. Source article:

https://www.codexworld.com/disable-mouse-right-click-cut-copy-paste-using-jquery

answered Jul 12 '18 at 21:55

Matt Sgarlata

1,761
1
16
13

This works best (assuming you have loaded jquery). It doesn't prevent highlighting and using the right-click copy or Ctrl+C, but the highlighed text doesn't get into the clipboard. See also here https://www.w3docs.com/snippets/javascript/how-to-disable-text-selection-copy-cut-paste-and-right-click-on-a-web-page.html#example-14 (scroll down a bit). The Javascript example didn't work, but the jQuery example worked for me (in FF v 102). – Rick Hellewell Jul 06 '22 at 02:42

score 1 · Answer 9 · answered Mar 16 '22 at 10:56

You can use the following JS functions and CSS definiton to completely prevent copy-paste on your page:

<script>  
    if (document.layers) {
        document.captureEvents(Event.MOUSEDOWN);
        document.onmousedown = clickNS4;
    }
    else if (document.all && !document.getElementById) {
        document.onmousedown = clickIE4;
    }

    $('body').bind('cut copy paste', function (e) {
        e.preventDefault();
        return false;
    });

    $("body").on("selectstart", function (e) {
        e.preventDefault();
        return false;
    });

    $("body").on("dragstart", function (e) {
        e.preventDefault();
        return false;
    });

    $("body").on("drop", function (e) {
        e.preventDefault();
        return false;
    });

    $(document).keydown(function (event) {
        if (event.ctrlKey == true && event.which == '86') {
            event.preventDefault();
            return false;
        }

        if (event.ctrlKey && (event.keyCode === 83 || event.keyCode === 65)) {
            event.preventDefault();
            return false;
        }
        else if (event.ctrlKey && event.keyCode === 80) {
            event.preventDefault();
            return false;
        }
    });

    $("body").addClass('unselectable');
</script>

unselectable class will look like:

.unselectable {
    -webkit-user-select: none;
    -webkit-touch-callout: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

Prem Acharya · Answer 10 · 2018-07-26T14:29:33.267

0

If you are looking for simple HTML to disable COPY and PASTE on a specific element then use below code. You can even block on the whole page by putting it on the body tag.

<div oncontextmenu="return false" onkeydown="if ((arguments[0] || window.event).ctrlKey) return false"></div>

oncontextmenu="return false" onkeydown="if ((arguments[0] || window.event).ctrlKey) return false"

edited Jul 26 '18 at 14:29

answered Jul 26 '18 at 14:24

Prem Acharya

491
4
3

score 0 · Answer 11 · answered Apr 19 '20 at 19:41

If you do not want to block highlighting or want to allow user to only copy a limited number of characters :

  function anticopy(event: ClipboardEvent) {    
    // @ts-ignore
    const clipboardData = event.originalEvent.clipboardData || window.clipboardData || event.originalEvent.clipboardData;
    const txt = window.getSelection().toString() || editor.getWin().getSelection().toString();
    if (txt.length > 200) {
      const no = 'You cannot copy more than 200 characters.';
      clipboardData.setData('text', no);
      clipboardData.setData('text/html', `<p>${no}</p>`);
    } else {
      const html = `<p><span data-user="${user.data.id}"></span> ${txt}</p>`;
      clipboardData.setData('text', txt);
      clipboardData.setData('text/html', html);
    }

    event.preventDefault();
  }

score 0 · Answer 12 · answered May 05 '23 at 22:39

Vanilla JS

It's 2023, so here's the simple vanilla JS alternative to the jQuery solutions that seem to be prevalent in the rest of the answers.

To just protect content from being copied or cut:

oncut = (e) => {
    e.preventDefault();
    e.stopPropagation();
    return false;
};

oncopy = (e) => {
    e.preventDefault();
    e.stopPropagation();
    return false;
};

For a more robust solution that will protect content from being copied, cut, selected or dragged (mainly for images):

oncut = (e) => {
    e.preventDefault();
    e.stopPropagation();
    return false;
};

oncopy = (e) => {
    e.preventDefault();
    e.stopPropagation();
    return false;
};

onselectstart = (e) => {
    e.preventDefault();
    e.stopPropagation();
    return false;
};

ondragstart = (e) => {
    e.preventDefault();
    e.stopPropagation();
    return false;
};

How to Disable Copy Paste (Browser)

12 Answers12

Vanilla JS

Linked

Related