フロントエンド暗号化は以前に使用されていました。暗号化の概要は次のとおりです
1. 暗号化アルゴリズムの紹介
古典的な暗号化アルゴリズムは、ハッシュ ハッシュ アルゴリズム、対称暗号化アルゴリズム、非対称暗号化アルゴリズムです。
1.1 ハッシュ ハッシュ アルゴリズム
- ハッシュ (Hash) アルゴリズム: ハッシュ アルゴリズムを介してターゲット情報のハッシュ値を生成できますが、このハッシュ値を介してターゲット情報を取り戻すことはできません。
- アプリケーション シナリオ: 不可逆的なパスワード ストレージ、情報の完全性検証などで一般的に使用されます。
- 一般的なハッシュ アルゴリズム: MD2、MD4、
MD5HAVAL、SHA。
一方向ハッシュ関数 MD5
MD5 は固定長で、入力内容が何バイトであっても、最終的な出力は 128 ビット、つまり 16 バイトです。これは、MD5 やその他の一方向ハッシュ関数が元に戻せない理由も説明しています。出力の固定長は、データが失われることを意味します。
通常、16 進数のリテラル値を使用して表すことができ、4 ビットごとに 16 進数のリテラル値が表示され、得られるのは長さ 32 ビットの文字列です。MD5 などの一方向ハッシュ関数は非常に離散的であることに注意してください。つまり、入力平文が異なる限り、スペースが 1 つだけ残っていても、結果はまったく異なります。
MD5 には、次の使用シナリオがあります。
- パスワード保護: たとえば、ユーザーのパスワードを直接保存する代わりに、パスワードの MD5 結果を保存します。しかし現在では、暗号化に MD5 を使用することはあまり安全ではないと一般に考えられており、MD5 の高度に分離された特性を利用して、デジタル署名、完全性検証、クラウド ディスクの即時転送などに使用することの方が一般的です。
- デジタル署名: プログラムのリリースと同時に MD5 を発行できます。このように、他の人がプログラムをダウンロードした後、自分で MD5 を計算し、比較した後、トロイの木馬を埋め込むなど、プログラムが改ざんされていないかどうかを知ることができます。
- 整合性チェック: たとえば、フロント エンドが非常に大きなデータをバック エンドに送信する場合、ネットワーク送信中のデータ損失を防ぐために、データの MD5 をフロント エンドで生成し、バックエンドが一緒に、データ MD5 を受信した後にバックエンドが再度計算できるようにすると、データが完全かどうかがわかります。
1.2 対称暗号化アルゴリズム
- 対称暗号化アルゴリズム:
相同密钥暗号化と復号化に使用される暗号化アルゴリズム。 - 長所と短所: 対称暗号化アルゴリズムの利点は、暗号化と復号化の高速性と、長いキーを使用した場合のクラッキングの難しさにあります。
- 一般的な対称暗号化アルゴリズム: DES、3DES、DESX、Blowfish、IDEA、RC4、RC5、RC6
AES、.
1.3 非対称暗号化アルゴリズム
- 対称暗号化アルゴリズム:
不同密钥暗号化とも呼ばれる、暗号化と復号化に使用される暗号化アルゴリズムを指します公私钥。 - 長所と短所: 非対称暗号化の短所は、暗号化と復号化の速度が対称暗号化よりもはるかに遅いことです. 極端な場合には、非対称暗号化よりも 1000 倍も遅くなる可能性があります.
- 一般的な対称暗号化アルゴリズム:
RSA、ECC (モバイル デバイス用)、Diffie-Hellman、El Gamal、DSA (デジタル署名用)。
暗号化アルゴリズムのパフォーマンスは、通常、アルゴリズム自体の複雑さ、キーの長さ (キーが長いほど安全性が高くなります)、暗号化と復号化の速度などの観点から測定できます。上記のアルゴリズムのうち、DES の鍵長の不足と MD2 の速度の遅さを除けば、現在の暗号システム製品では他のアルゴリズムが引き続き使用されています。
2. Vue3 で使用される暗号化アルゴリズム
暗号化ライブラリ crypto-js または jsencrypt をインストールします
JSEncrypt の暗号化および復号化プロセスでは、OpenSSL を使用して秘密鍵を生成する必要があります. OpenSSL は、SSL プロトコルを実装するオープン ソース ソフトウェアです。証明書の生成、証明書の署名、秘密鍵の生成、暗号化と復号化などに使用できます。たとえば、私の会社の最近のプロジェクトでは、localhost が https プロトコルを使用する場合、openssl を使用する必要があります。
以下は、2 つの一般的なオープン ソース暗号化ライブラリです。
# 官网 https://www.npmjs.com/package/crypto-js
# crypto-js进行AES加密,安装:
npm i --save crypto-js
# 官网 https://www.npmjs.com/package/jsencrypt
# jsencrypt进行RSA加密,安装:
npm i --save jsencrypt
コードで使用されます (公開鍵は通常、バックエンドによって提供され、バックエンドは独自の秘密鍵を保存します):
import JSEncrypt from 'jsencrypt';
const crypt = new JSEncrypt();
crypt.setKey(import.meta.env.VITE_PUBLIC_kEY); // 设置公钥-此处是引用环境变量
console.log("passWord",crypt.encrypt(userInfo.password));
ネットワーク図を入れる
暗号化サンプルコード https://blog.csdn.net/qq_32247819/article/details/120821664