righettod/clear-sensitive-info-from-clipboard.html

## clear-sensitive-info-from-clipboard.html
<!DOCTYPE html>
<html>
   <!--
      POC to remove a "sensitive" information from the clipboard after a short period of time.
      It is used, as an hardening measure, for a legit feature to copy the info into the clipboard.

      Here the info taken is an IBAN for the example.

      https://developer.mozilla.org/en-US/docs/Web/API/Clipboard
      -->
   <head>
      <title>POC</title>
      <style>
         body {
         background-color: white;
         color: black;
         font: normal 14px Consolas, Arial, sans-serif;
         padding-left: 5px;
         padding-right: 5px;
         padding-top: 5px;
         padding-bottom: 5px;
         }
      </style>
      <script>
         const delay=15000;

         async function clearClipboard() {
         	try {
         		const ibanRegex = new RegExp('^[A-Z0-9]{20,34}$');
         		const clipboardContents = await navigator.clipboard.read();
         		for (const item of clipboardContents) {
         			const blob = await item.getType("text/plain");
         			let blobText = await blob.text();
         			blobText = blobText.replace(" ","");
         			//if the clipboard content a IBAN then overwrite it
         			if(ibanRegex.test(blobText)){
         				console.info("Clipboard overwritten.");
         				await navigator.clipboard.writeText("REDACTED");
         			}
         		}
         	}catch (error) { console.error(error); }
         }

         async function copyIbanToClipboard(iban){
         	navigator.clipboard.writeText(iban);
         	setTimeout(clearClipboard,delay);
         	console.log("IBAN copied to clipboard.");
         }

         window.addEventListener("load", (event) => {
         	document.addEventListener("copy", (event) => {
         	  console.log("Manual copy detected.");
         	  setTimeout(clearClipboard,delay)
         	});
         });
      </script>
   </head>
   <body>
      <button onclick="copyIbanToClipboard('FI211234569876543210')">Copy IBAN</button>
      <br>
      <code>FI211234569876543210<code>
   </body>
</html>
	<!DOCTYPE html>
	<html>
	<!--
	POC to remove a "sensitive" information from the clipboard after a short period of time.
	It is used, as an hardening measure, for a legit feature to copy the info into the clipboard.

	Here the info taken is an IBAN for the example.

	https://developer.mozilla.org/en-US/docs/Web/API/Clipboard
	-->
	<head>
	<title>POC</title>
	<style>
	body {
	background-color: white;
	color: black;
	font: normal 14px Consolas, Arial, sans-serif;
	padding-left: 5px;
	padding-right: 5px;
	padding-top: 5px;
	padding-bottom: 5px;
	}
	</style>
	<script>
	const delay=15000;

	async function clearClipboard() {
	try {
	const ibanRegex = new RegExp('^[A-Z0-9]{20,34}$');
	const clipboardContents = await navigator.clipboard.read();
	for (const item of clipboardContents) {
	const blob = await item.getType("text/plain");
	let blobText = await blob.text();
	blobText = blobText.replace(" ","");
	//if the clipboard content a IBAN then overwrite it
	if(ibanRegex.test(blobText)){
	console.info("Clipboard overwritten.");
	await navigator.clipboard.writeText("REDACTED");
	}
	}
	}catch (error) { console.error(error); }
	}

	async function copyIbanToClipboard(iban){
	navigator.clipboard.writeText(iban);
	setTimeout(clearClipboard,delay);
	console.log("IBAN copied to clipboard.");
	}

	window.addEventListener("load", (event) => {
	document.addEventListener("copy", (event) => {
	console.log("Manual copy detected.");
	setTimeout(clearClipboard,delay)
	});
	});
	</script>
	</head>
	<body>
	<button onclick="copyIbanToClipboard('FI211234569876543210')">Copy IBAN</button>
	<br>
	<code>FI211234569876543210<code>
	</body>
	</html>