欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

前端vue2使用國(guó)密SM4進(jìn)行加密、解密具體方法

 更新時(shí)間:2024年07月29日 10:16:48   作者:hibiscusxin  
SM4是一種對(duì)稱加密算法,類似于AES,主要用于數(shù)據(jù)的批量加密,如文件加密、數(shù)據(jù)庫加密、網(wǎng)絡(luò)通信數(shù)據(jù)加密等,這篇文章主要給大家介紹了關(guān)于前端vue2使用國(guó)密SM4進(jìn)行加密、解密的相關(guān)資料,需要的朋友可以參考下

SM4是一種對(duì)稱加密算法,也被稱為國(guó)標(biāo)SM4。它是在中國(guó)的國(guó)家密碼標(biāo)準(zhǔn)下開發(fā)的,主要用于保護(hù)電子數(shù)據(jù)的機(jī)密性和完整性。

SM4算法采用分組密碼工作方式,其分組長(zhǎng)度為128位,密鑰長(zhǎng)度為128位、192位或256位。它是一種分組長(zhǎng)度和密鑰長(zhǎng)度都可變的分組密碼,其使用的密鑰長(zhǎng)度取決于實(shí)際應(yīng)用場(chǎng)景的安全需求。

SM4加密有兩種模式:ECB和CBC。

ECB模式是最簡(jiǎn)單的塊密碼加密模式,加密前根據(jù)加密塊大小分成若干塊,之后將每塊使用相同的密鑰單獨(dú)加密,解密同理。這種模式的優(yōu)點(diǎn)在于簡(jiǎn)單和有利于并行計(jì)算,而且誤差不會(huì)被傳送。然而,ECB模式不能隱藏明文的模式,可能對(duì)明文進(jìn)行主動(dòng)攻擊。

CBC模式則是一種循環(huán)模式(鏈?zhǔn)剑耙粋€(gè)分組的密文和當(dāng)前分組的明文操作后再加密,這樣做的目的是增強(qiáng)破解難度。這種模式不容易主動(dòng)攻擊,安全性好于ECB,適合傳輸長(zhǎng)度長(zhǎng)的報(bào)文,是SSL、IPSec的標(biāo)準(zhǔn)。然而,CBC模式不利于并行計(jì)算,誤差傳遞,還需要初始化向量IV。

這里是在vue2的項(xiàng)目里使用,具體使用方法如下:

1、安裝gm-crypt依賴

npm install gm-crypt

2、在utils文件下新建sm4Util.js

// sm4Utils.js
const SM4 = require("gm-crypt").sm4;
const pwdKey = "pwdKeyketihuan"; //"pwdKeyketihuan"; 密鑰  前后端一致即可,后端提供
let sm4Config = {
      key: pwdKey, //這里這個(gè)key值要與后端的一致,后端解密是根據(jù)這個(gè)key
      mode: "cbc",  // 加密的方式有兩種,ecb和cbc兩種,也是看后端如何定義的
      iv: 'woshiiv', //iv是cbc模式的第二個(gè)參數(shù),也需要跟后端配置的一致, ecb不用iv。 iv是initialization vector的意思,就是加密的初始話矢量,初始化加密函數(shù)的變量,也叫初始向量。(本來應(yīng)該動(dòng)態(tài)生成的,由于項(xiàng)目沒有嚴(yán)格的加密要求,直接寫死了)
      cipherType: "base64"
    };

const sm4Util = new SM4(sm4Config); // new一個(gè)sm4函數(shù),將上面的sm4Config作為參數(shù)傳遞進(jìn)去。
    
/* 
 * 加密工具函數(shù)
 * @param {String} text 待加密文本
 */
export function encrypt(text) {
	try {
  		return sm4Util.encrypt(text, pwdKey);
  	} catch {
  		return text;
  	}
}

/*
 * 解密工具函數(shù)
 * @param {String} text 待解密密文
 */
 export function decrypt(text) {
  try {
  		return sm4Util.decrypt(text, pwdKey);
  	} catch {
  		return text;
  	}
}

3、可以直接在使用的文件里面引用使用

方法一

import { encrypt, decrypt } from "@/utils/sm4Util.js" //引入sm4.js  
let passWord = '1q2w3e4r';
// 加密
let passSm4en = encrypt(passWord);
// 解密
let passSm4de = decrypt(passSm4en);

4、或者在utils下面新建propFormat.js

// propFormat.js
import { encrypt, decrypt } from "@/utils/sm4Util.js" //引入sm4.js  
let propFormat = {
    // sm4加密
    encryptFormat: function(str) {
        if (str) {
            return encrypt(str);
        } else {
            return '';
        }
    },
    // sm4解密
    decryptFormat: function(str) {
        if (str) {
            return decrypt(str);
        } else {
            return '';
        }
    }
}

export default propFormat; 

方法二

let passWord = '1q2w3e4r';
// 加密
let passSm4en = this.$util.propFormat.encryptFormat(passWord);
// 解密
let passSm4de = this.$util.propFormat.decryptFormat(passSm4en);

方法三

這種一般用在div展示的時(shí)候,直接解密展示

在propFormat.js同級(jí)的index.js里面引入工具類,并導(dǎo)出

// index.js
// 引入所有的工具類
...
import propFormat from './propFormat.js'
...
// 導(dǎo)出在一個(gè)對(duì)象上
export default {
    ...
    propFormat,
    ...
}

在main里面注入全局

// main.js
...
import vueFilter from './utils/propFormat.js'
...

for (let i in vueFilter) {
    Vue.filter(i, vueFilter[i])
}

// 使用

// 解密
<div class='password'>{{ password | decryptFormat }}</div>

總結(jié) 

到此這篇關(guān)于前端vue2使用國(guó)密SM4進(jìn)行加密、解密的文章就介紹到這了,更多相關(guān)vue2國(guó)密SM4加密解密內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!

相關(guān)文章

最新評(píng)論