Your own web clipboard in 10 minutes
I used to be a big fan of www.kl1p.com which allows you to quickly copy & paste texts, URLs and other short fragments between different devices. You can even make up your own URLs on-the-fly by just appending something at the end, e.g. www.kl1p.com/mystuff. But as soon as you have to copy around some sensitive or personal data it suddenly makes you wonder if perhaps someone else will end up reading it, even if you carefully choose a random string for the URL and delete the content immediately after using it. And that site doesn’t even have HTTPS, so anyone on the wire can read your content. Oh and then you also notice that when opening it on Chrome on Android, you can’t actually select the text in order to copy it and it makes you wonder why oh why doesn’t this work?
But luckily such a service is so trivial to create that surely someone else made a better version of it, right? Let’s try wepaste.com shall we? But wait, if you paste emojis into that one then the content will fail to reload on at least some browsers and there’s still no HTTPS. It’s not like it’s 2018 already and HTTPS is just a luxury, right? And it also sucks on mobile.
How hard can it be to create your own service for just quickly copy pasting between devices and be sure no one else will read it? It turns out that if you keep it simple it’s just about 10 minutes. Here’s my quick version in PHP:
<?php
$data = file_get_contents('data');
?><!DOCTYPE html>
<html>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<style type='text/css'>
textarea {
display: block;
box-sizing: border-box;
width: 100%;
height: 200px;
margin-bottom: 10px;
border: none;
}
button {
float: right;
}
input, button {
padding: 10px 20px;
}
</style>
</head>
<body>
<form action='' method='POST'>
<textarea name='text' id='text' placeholder='Your notes...'><?php echo htmlspecialchars($data); ?></textarea>
<input type='submit' value='Save'>
<button type='button' onclick='document.getElementById("text").value="";'>Clear</button>
</form>
</body>
</html>
<?php
if (array_key_exists('text', $_POST)) {
file_put_contents('data', $_POST['text']);
header('Location: .');
}
Deploy this under any name you like and make sure to create the ‘data’ file in advance, do chown www-apache.www-apache data and you’re done. It’s beautifully simple, works on mobile devices, see it deployed here: https://jas.atdot.ch/mystuff/.
Mind you, it lacks many features, for instance there’s only one clipboard, not multiple. But I need only one for myself, so it’s fine. Many areas could be vastly improved, but the point is that it work just fine as long as you deploy this on a HTTPS-enabled webserver with a hard-to-guess URL or even add apache2/nginx/whatever basic authentication for even more security. And for your personal use it will end up being vastly superior to those other sites.