要在前端使用 AES アルゴリズムでバックエンドからのデータを復号化するには、JavaScript で提供される暗号化ライブラリである CryptoJS を使用することができます。
インストール / インポート#
- まず、フロントエンドの HTML ファイルで CryptoJS ライブラリをインポートすることを確認してください。
1.1 以下のコードを HTML ファイルのタグ内に追加することで、CryptoJS をインポートすることができます:
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/4.0.0/crypto-js.min.js"></script>
1.2 CryptoJS を npm でインストールするには、以下の手順を実行してください:
1.2.1 プロジェクトディレクトリでターミナルまたはコマンドラインインターフェースを開きます。
1.2.2 以下のコマンドを実行して CryptoJS をインストールします:
npm install crypto-js
これにより、npm リポジトリから CryptoJS ライブラリとその依存関係がダウンロードされ、プロジェクトの node_modules ディレクトリに保存されます。
- JavaScript ファイルで、必要な CryptoJS モジュールを require または import ステートメントを使用してインポートします。例:
// requireを使用する場合
const CryptoJS = require('crypto-js');
// importを使用する場合
import CryptoJS from 'crypto-js';
適切なインポート方法を選択するには、プロジェクトのモジュールシステム(CommonJS または ES モジュール)に依存します。
これで、CryptoJS ライブラリのさまざまな暗号化アルゴリズムやユーティリティ関数、AES アルゴリズムを含むものをフロントエンドのコードで使用することができます。
npm で CryptoJS をインストールする場合、フロントエンドプロジェクトがビルドツール(Webpack、Parcel、Rollup など)を使用してパッケージングおよびビルドされていることを確認する必要があります。これにより、ビルドツールはインストールされたライブラリを正しく最終的なプロジェクトファイルに含めます。単純な HTML ファイルで CryptoJS を直接使用する場合は、npm のインストールを使用する必要はありません。
- 次に、以下のコード例を使用して、フロントエンドで AES アルゴリズムを使用してバックエンドからのデータを復号化する方法を示します:
// 暗号化されたデータ
const encryptedData = "バックエンドからの暗号化されたデータ";
// 鍵
const key = CryptoJS.enc.Utf8.parse("あなたの秘密の鍵");
// 初期化ベクトル
const iv = CryptoJS.enc.Utf8.parse("あなたのIV");
// 復号化
const decryptedData = CryptoJS.AES.decrypt(encryptedData, key, {
iv: iv,
mode: CryptoJS.mode.CBC,
padding: CryptoJS.pad.Pkcs7
});
// 復号化された元のデータ
const decryptedText = decryptedData.toString(CryptoJS.enc.Utf8);
console.log(decryptedText);
上記のコードでは、encryptedData をバックエンドからの暗号化されたデータに置き換える必要があります。次に、your-secret-key を暗号化および復号化に使用するキーに置き換えます。your-iv は AES アルゴリズムの初期化ベクトルです。キーと初期化ベクトルは、バックエンドで使用される値と一致する必要があります。
復号化の手順では、CryptoJS.AES.decrypt () メソッドを呼び出して復号化操作を実行します。提供されたキー、初期化ベクトル、および対応するモードとパディングを使用して、暗号化されたデータを元のデータに復号化します。最後に、toString () メソッドを呼び出して指定された文字エンコーディング(例:CryptoJS.enc.Utf8)で復号化されたデータを読みやすい文字列形式に変換します。
注意:復号化に暗号化アルゴリズムを使用する場合、フロントエンドとバックエンドの間で同じキー、初期化ベクトル、モード、およびパディングを協議および使用することが重要です。また、データの安全性を確保するために、キーと初期化ベクトルは適切に保管および管理され、権限のある人のみがアクセスおよび使用できるようにする必要があります。