JSencrypt 라이브러리는 RSA 방식으로 데이터를 암/복호화한다
RSA 방식 이란
JSencrypt 라이브러리 다운 주소
다운 후 압축풀고 bin/jsencrypt.min.js 만 필요하다.
우선은 개인키와 공개키를 만들어야하는데
openssl을 이용해서 만들 수 있다
openssl 설치 및 키 발급법
코드
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Document</title>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script type="text/javascript" src="./jsencrypt.min.js"></script>
<script type="text/javascript">
//<![CDATA[
$(document).ready(function () {
// 암호화 하기
$("#encrypt").click(function () {
// 객체 생성
var crypt = new JSEncrypt(); // 키 설정
console.log("crypt", crypt);
crypt.setPrivateKey($("#publicKey").val());
var plainText = $("#plainText").val(); // 암호화
console.log("plainText", plainText);
var encryptedText = crypt.encrypt(plainText);
console.log("encryptedText", encryptedText);
$("#encryptedText").val(encryptedText);
}); // 복호화 하기
$("#decrypt").click(function () {
var crypt = new JSEncrypt();
crypt.setPrivateKey($("#privateKey").val());
var encryptedText = $("#encryptedText").val(); // 복호화
var decryptedText = crypt.decrypt(encryptedText);
$("#decryptedText").val(decryptedText);
});
}); //]]>
</script>
</head>
<body>
<div style="display: flex">
<div>
<label for="privateKey">Private key</label><br /><textarea
id="privateKey"
cols="66"
rows="16"
>
-----BEGIN RSA PRIVATE KEY-----MIICXQIBAAKBgQDLZL7JkIAxVOLqtEZr+SjJZYqS59ARp3/Z/l5Q6AOWryyrCJI4A/4RjFiZ2lN2a08WGgZuYrM+rk7mXmxQdAX1aUTXk9xxZX2YrO9g2TMxpJzrdDD6AKbDSqz9TLx2mBuLFKr+dJXX4FSg6GQF9ZAlP/PxuriRMQ5kbnqGPiMCvwIDAQABAoGAMlaw0XouAAeeUbBkbXyxF4dGEK3G1Ve7UNyfwy5pFPYt+/aXGb4DN5ygoRNj7L8KR9IRHWjYK/9AD8v2ysKsZmuXNt23ojkKHq5wirSCpO2vb244ApMQAlvZYdoAeUaYjMyq9RLBsPXh8yLAMrLGU6Yxsv5evRjrHnStW8LcImECQQDwnypVThxZP5d5vxDHV4xFvS0PFucR05TIEtpLvGIGQ8bzol9jz+A4irpIRHnyRfydyJQziS7Svp9EsSlWiOaVAkEA2GR8XZPTXTwtotF4dSSqu0sdERUCyShTAK4/vRjGviH0qITGPk+ZeCQp2ZV0WsY84/6mMRviiBn92+J7hS5TAwJAASRQOB1pxwalOl+svbVtpfsS1qp+KDh/0T89p/RZ5ru1mvxfRYL8BmiqH6OrjHnGjB0ijugMv9VFvja1AoMdzQJBALjo1SUZpunq/Iw/NxHS7Vnyi7oHHERMgvD39VtfCqV6WpiOLOEeH+R78o8NmUngUDP7bIRWcbMfksAMvsRFm4UCQQC3suGb43vEPOv8dGaIX7DxRCuvbgI+3mRn07bZe//iaxiQXphcMJArJB4bpxl+Sdq59miHPhHpTIYGN9fVHYr+-----END RSA PRIVATE KEY-----</textarea
><br /><label for="publicKey">Public key</label><br /><textarea
id="publicKey"
cols="66"
rows="7"
>
-----BEGIN PUBLIC KEY-----MIGfMA0GCSqGSIb3DQEBAQUAA4GNADCBiQKBgQDLZL7JkIAxVOLqtEZr+SjJZYqS59ARp3/Z/l5Q6AOWryyrCJI4A/4RjFiZ2lN2a08WGgZuYrM+rk7mXmxQdAX1aUTXk9xxZX2YrO9g2TMxpJzrdDD6AKbDSqz9TLx2mBuLFKr+dJXX4FSg6GQF9ZAlP/PxuriRMQ5kbnqGPiMCvwIDAQAB-----END PUBLIC KEY-----</textarea
>
</div>
<div style="padding-left: 10px">
<label for="plainText">평문</label><br /><input
type="text"
id="plainText"
style="width: 400px"
/><br /><label for="encryptedText">암호화된 문장</label><br /><input
type="text"
id="encryptedText"
style="width: 400px"
/><br /><label for="decryptedText">복호화된 문장</label><br /><input
type="text"
id="decryptedText"
style="width: 400px"
/><br /><button id="encrypt">암호화</button><button id="decrypt">복호화</button>
</div>
</div>
</body>
</html>
아까 받았던
jsencrypt.min.js 파일이 RSA를 구현하는 알고리즘 부분이라 읽어와야한다
$를 쓰기위해서 jquery를 읽어와야하는데 파일로 받거나 위 코드처럼 주소를 읽어오면된다
이렇게 평문을 암호화하고 복호화 할 수 있다.
참고
'코딩 공부 > 보안' 카테고리의 다른 글
모노 알파베틱 암호화 (Monoalphabetic Cipher) (0) | 2022.06.03 |
---|---|
카이사르 암호(Caesar cipher) (0) | 2022.06.03 |
RSA (0) | 2022.05.31 |
openssl 설치 및 키 발급 (0) | 2022.05.31 |
Hash와 Salt 그리고 Bcrypt (2) | 2022.05.26 |