JSFiddle - React, Tailwind, and code Playground

by imbolc

HTML

<script src="http://crypto-js.googlecode.com/svn/tags/3.1.2/build/rollups/aes.js"></script>
<input id="open_text" type="text" placeholder="text to crypt" value="Я открытый текст">
<br>
<input id="password" type="text" placeholder="password" value="Я пароль">
<br>
<button id="cryptaction">Crypt and Decrypt</button>
<br>
    
<p id="text1">Открытый</p>
<p id="text2">Зашифрованный</p>
<p id="text3">Расшифрованный</p>

JavaScript

$("#cryptaction").click(function () {
    var open_text = $("#open_text").val();
    var password = $("#password").val();
    $("#text1").text(open_text);

    var encrypted = CryptoJS.AES.encrypt(open_text, password);
    $("#text2").text(encrypted);
    var decrypted = CryptoJS.AES.decrypt(encrypted, password);
    $("#text3").text(decrypted.toString(CryptoJS.enc.Utf8));
    
    console.log(open_text);
    console.log(encrypted);
    console.log(decrypted.toString(CryptoJS.enc.Utf8));

});