快捷導(dǎo)航

前端如何利用CryptoJS實(shí)現(xiàn)數(shù)據(jù)信息的加密詳解

更新時(shí)間：2023年11月15日 10:34:47 作者：花花世界迷人眼睛

這篇文章主要給大家介紹了關(guān)于前端如何利用CryptoJS實(shí)現(xiàn)數(shù)據(jù)信息加密的相關(guān)資料,前端解密解密工具Cryptojs提供了前端加密解密的工作,包括常用的MD5、BASE64、SHA1、AES等加密解密方法,需要的朋友可以參考下

安裝

npm install crypto-js

引入

import CryptoJS from "crypto-js";

CryptoJS是一種常用的前端加密庫，支持多種加密方式，以下是其中常用的幾種加密算法：

SHA256哈希算法

SHA256是一種常見的哈希算法，可以生成一個(gè)256位的哈希值，通常用于數(shù)據(jù)簽名和身份驗(yàn)證等場(chǎng)合。使用CryptoJS的SHA256方法可以方便地計(jì)算SHA256哈希值。

SHA256哈希算法，它是一種單向加密算法，不提供解密方法。它的作用是將任意長(zhǎng)度的明文數(shù)據(jù)，經(jīng)過哈希計(jì)算后生成一個(gè)固定長(zhǎng)度的哈希值。因?yàn)橐话闱闆r下哈希值和原始數(shù)據(jù)之間的關(guān)系不可逆

//加密
const plaintilit = 'hello world'
const hash = CryptoJS.SH256(plaintilit).toString
console.log(hash)  // "b94d27b9934d3e08a52e52d7da7dabfac484efe37a5380ee9088f7ace2efcde9"

AES對(duì)稱加密算法

AES是一種常見的對(duì)稱加密算法，通過相同的密鑰進(jìn)行加密和解密，常用于數(shù)據(jù)保護(hù)和機(jī)密信息存儲(chǔ)等場(chǎng)合。使用CryptoJS的AES方法可以方便地進(jìn)行AES加密和解密操作。

key是對(duì)稱加密算法的核心參數(shù)，同一個(gè)明文和密鑰加密后得到的密文是相同的，因此密鑰必須保密并且不易被破解。key的長(zhǎng)度可以是128位、192位或256位，不同長(zhǎng)度的key對(duì)應(yīng)著不同的安全級(jí)別。

iv是用于增加加密強(qiáng)度的參數(shù)，它需要與key一起作為輸入?yún)?shù)傳遞給加密算法。iv的長(zhǎng)度為128位，它在每次加密時(shí)都會(huì)改變，并與key一起參與加密過程。iv的作用是將相同的明文使用不同的iv加密后生成不同的密文，從而增加破解的難度和安全性。

//設(shè)置key和對(duì)應(yīng)的iv
//在CryptoJS中，CryptoJS.enc.Utf8.parse方法用于將字符串轉(zhuǎn)換為UTF-8編碼的字節(jié)數(shù)組，這是因?yàn)榧铀?
//法通常需要將字符串轉(zhuǎn)換為字節(jié)流進(jìn)行處理。在對(duì)字符串進(jìn)行加密或解密之前，需要先將其轉(zhuǎn)換為字節(jié)數(shù)組。

const plaintitle = 'hello world'
const key = CryptoJS.enc.Utf8.parse('zxcvbnm')
const iv = CryptoJS.enc.Utf8.parse('zxcvbnm')

// 加密
const ciphertext = CryptoJS.AES.encrypt(plaintitle , key, { iv: iv })
console.log(ciphertext.toString())  // "U2FsdGVkX1/z9g+JQzthGtFlKeZeBjJ92Z1nxv5vxsw="

// 解密
const decrypted = CryptoJS.AES.decrypt(ciphertext, key, { iv: iv })
console.log(decrypted.toString(CryptoJS.enc.Utf8))  // "hello world"

HMAC哈希消息認(rèn)證碼

HMAC是一種基于哈希函數(shù)和密鑰的消息認(rèn)證碼算法，可以用于驗(yàn)證數(shù)據(jù)完整性和真實(shí)性。使用CryptoJS的HmacSHA256方法可以方便地計(jì)算HMAC-SHA256哈希值。

const plaintitle = 'hello world'
const key = CryptoJS.enc.Utf8.parse('1234567890123456')
const hmac = CryptoJS.HmacSHA256(plaintitle , key).toString()
console.log(hmac)  // "f7e329a7c587374e4ed7c80b5be95c9a5997c84da20f5aaede26327bd2b705d8"

計(jì)算MD5哈希值

在使用toString()方法將其轉(zhuǎn)換為字符串類型時(shí)，我們傳入了CryptoJS.enc.Hex參數(shù)，表示將其轉(zhuǎn)換為十六進(jìn)制字符串格式。

var hash = CryptoJS.MD5("Message");
console.log(hash.toString(CryptoJS.enc.Hex)); // 輸出16進(jìn)制格式的md5哈希值

記錄一些常用的加密方式

base64轉(zhuǎn)碼和解碼

 let str = 'ImGod';
 let str64 = window.btoa(str);
console.log('轉(zhuǎn)化后：'+str64);//SW1HB2Q=
let jm = window.atob(str64);
console.log('解碼后：'+jm);//ImGod

js編碼

encodeURIComponent會(huì)將特殊字符（除了字母、數(shù)字、標(biāo)點(diǎn)符號(hào)和某些保留字符以外的所有字符）都轉(zhuǎn)換為UTF-8編碼的格式，然后再將其轉(zhuǎn)換為16進(jìn)制值。

decodeURIComponent是JavaScript中的一個(gè)內(nèi)置函數(shù)，用于將使用encodeURIComponent函數(shù)編碼的字符串進(jìn)行解碼。

const text = '阿拉斯加'
const encodedText = encodeURIComponent(text)
console.log(encodedText,'url編碼');

const textTitle = decodeURIComponent(encodedText)
console.log(textTitle,'url解碼');

總結(jié)

到此這篇關(guān)于前端如何利用CryptoJS實(shí)現(xiàn)數(shù)據(jù)信息加密的文章就介紹到這了,更多相關(guān)CryptoJS實(shí)現(xiàn)數(shù)據(jù)信息加密內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家！

您可能感興趣的文章: