You’re probably no stranger to banning copy and paste from web pages. Some pages are directly forbidden to copy and paste; Some web pages, it is required to log in before you can copy and paste; And some sites, copy and paste with the site’s source identification information.

How to prevent web page copy and paste

const html = document.querySelector('html'); Html.oncopy = () => {alert(' you copy me '); return false; }; html.onpaste = () => false;Copy the code

Do something else while copying, such as jump to the login page ##

const html = document.querySelector('html'); html.oncopy = (e) => { console.log(e); // For example, to point to Baidu or to the login page window.location.href='http://www.baidu.com'; }; html.onpaste = (e) => { console.log(e); };Copy the code
  • How to set/get clipboard content using JS
/ / set the clipboard contents document. AddEventListener (' copy '() = > {const clipboardData = event. The clipboardData | | event. The originalEvent? .clipboardData; clipboardData? .setData('text/plain', 'Whatever I copy, it's me! '); event.preventDefault(); }); / / get the contents of the clipboard document. The addEventListener (' paste '() = > {const clipboardData = event. The clipboardData | | event. The originalEvent? .clipboardData; const text = clipboardData? .getData('text'); console.log(text); event.preventDefault(); });Copy the code
  • What’s the use of
  • For the scenario where the same content is entered twice, such as the registration and password input, it should be forbidden to paste. In this case, you can prohibit the copy and paste action of the corresponding input box.
  • Log in to copy. On many web sites, page content is not allowed to be copied to prevent users or programs from grabbing page data maliciously.