Created
November 7, 2019 08:33
-
-
Save abdus/110a9c5cc16a52aea43dab4c1ac6f586 to your computer and use it in GitHub Desktop.
Sending Encrypted Emails from Front-End/Static Sites
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<html> | |
<body> | |
<form action=""> | |
<input | |
type="email" | |
id="email" | |
name="email" | |
placeholder="[email protected]" | |
/> | |
<br /> | |
<input type="text" id="name" name="name" placeholder="Abdus" /> <br /> | |
<textarea | |
name="message" | |
id="message" | |
cols="30" | |
rows="10" | |
placeholder="Your awesome message" | |
></textarea | |
><br /> | |
<input type="submit" value="Encrypt and Send" /> | |
</form> | |
<script | |
src="https://cdnjs.cloudflare.com/ajax/libs/openpgp/4.6.2/openpgp.min.js" | |
integrity="sha256-txcrHjb7Yt1zrebRnGkk5OwDkoBrvJTjvJx5b7qBtWc=" | |
crossorigin="anonymous" | |
></script> | |
<script> | |
const public_key = `-----BEGIN PGP PUBLIC KEY BLOCK----- | |
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 | |
=YccN | |
-----END PGP PUBLIC KEY BLOCK----- | |
`; | |
async function encrypt(message) { | |
const enc_message = await openpgp.encrypt({ | |
message: openpgp.message.fromText(message), | |
armor: true, | |
publicKeys: (await openpgp.key.readArmored(public_key)).keys, | |
}); | |
sendMail(enc_message.data); | |
} | |
document.querySelector('form').addEventListener('submit', e => { | |
// dom manipulation | |
const sender = { | |
name: document.querySelector('#name').value, | |
email: document.querySelector('#email').value, | |
message: document.querySelector('#message').value, | |
}; | |
// prevent page from reload on form submit | |
e.preventDefault(); | |
// finally call our encrypt function | |
encrypt(`${sender.name} <${sender.email}> \n\n\n ${sender.message}`); | |
}); | |
function sendMail(encrypted_message) { | |
fetch('https://formspree.io/xyyyywgd', { | |
method: 'POST', | |
mode: 'no-cors', | |
body: JSON.stringify({ | |
message: encrypted_message, | |
}), | |
}) | |
.then(console.log) | |
.catch(console.log); | |
} | |
</script> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment