はじめに
情報セキュリティを勉強しており、AES暗号化の基礎について書いてみようと思います。
とはいえ、このページにたどり着く人は、とりあえず暗号化できる方法を知りたい人かと思うので、ちゃちゃっとやり方を記載することにします。
本来であれば、暗号化のオプションの指定もありますが、ここでは初級編としてとりあえず、動く最低限だけ記載しておきます。
AESとは
- Advanced Encryption Standard
- 現在（2020年）のアメリカで採用・標準化されている暗号化方式
- 暗号時と復号時に同じ暗号鍵（パスフレーズ）を使う、共通化暗号方式の１つです。
なんてことはないですね。
データをパスフレーズで暗号化／復号化するだけです。
暗号化されたデータが漏れてしまっても、暗号鍵がわからなければただのゴミデータですねぇ。
当然、クラッカーの方々は、暗号鍵を狙ってくるわけですけどね。
サンプル
テスト環境
- OS: Windows 10 Home
- ブラウザ: Firefox 75.0 / Chrome81.0.4044.129 (64bit)
使用モジュール
- crypt-js (4.0.0)
今回は、古くからオープンソースで使われているモジュールを使おうと思います。
cdnjs にもあるので、そのまま参照することにします。
ソースコード
とりあえず、すぐに試せるように、html として記載しておきます。ソースコードエリアを copy して、html ファイルとして保存してもらえれば動作します。
- 動作確認：2020-05-03
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>[プログラム] AES 暗号化</title>
<style> input { width: 500px; } </style>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
</head>
<body>
<p>
<input type="text" name="data" id="data" placeholder="" value="Hello World!">
<label for="">データ / Data</label>
</p>
<p>
<input type="text" name="pass_phrase" id="pass_phrase" value="0123456789ABCDEF0123456789ABCDEF">
<label for="">パスフレーズ / Path Phrase</label>
</p>
<p>
<input type="submit" id="execute" value="実行">
</p>
<div id="output"></div>
<script>
window.onload = () => {
let buttonExecute = document.getElementById('execute')
buttonExecute.addEventListener('click', () => {
execute()
});
}
function execute () {
// パスフレーズ（暗号鍵）
let passPhrase = document.getElementById('pass_phrase').value;
// 暗号化したい元のデータ
let data = document.getElementById('data').value;
let utf8_plain = CryptoJS.enc.Utf8.parse(data);
// 暗号化
let encrypted = CryptoJS.AES.encrypt( utf8_plain, passPhrase );
// 復号化
let decrypted = CryptoJS.AES.decrypt( encrypted , passPhrase );
let txt_dexrypted = decrypted.toString(CryptoJS.enc.Utf8);
// 表示
document.getElementById("output").innerHTML =
"key : " + passPhrase +"<br />" +
"data : " + data + "<br />" +
"encrypted : " + encrypted + "<br />" +
"decrypted : " + txt_dexrypted;
}
</script>
</body>
</html>
解説
（8行目）モジュールの読み込み
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
AES暗号化のための、 javascript モジュールは「crypto-js」を使いました。
CDNから、直接読み込んでます。
（34～35行目）パスフレーズ
// パスフレーズ（暗号鍵）
let passPhrase = document.getElementById('pass_phrase').value;
（36～38行目）暗号化したいデータ
// 暗号化したい元のデータ
let data = document.getElementById('data').value;
let utf8_plain = CryptoJS.enc.Utf8.parse(data);
今時は、UFT-8で統一しておいたほうが便利なので UTF-8 に変換しています。
（39～40行目）暗号化
// 暗号化
let encrypted = CryptoJS.AES.encrypt( utf8_plain, passPhrase );
実行結果は、base64 でエンコードされた文字列です。
（41～43行目）復号化
// 復号化
let decrypted = CryptoJS.AES.decrypt( encrypted , passPhrase );
let txt_dexrypted = decrypted.toString(CryptoJS.enc.Utf8);
暗号化されたデータを、復号化します。復号化直後のデータはバイナリなので UTF-8 で元の文字列に変更しています。
コメント