VUE + Springboot + SM4前端加密 后端解密
前端比較簡單,只需在使用時引入 npm 包
const SM4 = require("gm-crypt").sm4;
下面是前端加解密操作
const sm4Config = { //配置sm4參數 key: "16位Key值",//這里這個key值是跟后端要的 mode: "cbc", // 加密的方式有兩種,ecb和cbc兩種,也是看后端如何定義的,cbc還要加一個iv的參數,ecb不用 cipherType: "base64", // iv: "16位iv值"// 這里key 和 iv 需要和后端保持一直 }; let sm4 = new SM4(sm4Config);//這里new一個函數,將上面的sm4Config作為參數傳遞進去。然后就可以開心的加密了 // let pwd = sm4.encrypt('123456'); //密碼加密
// let pwd1 = sm4.decrypt('加密后的密文'); //密碼解密
有想要細心研究的同學可以打開我們項目的 node_modules 文件夾,搜索 gm-crypt 就可以找到了,如圖所示

如果想要在其他項目使用,就把文件拷出來就行了,這里就不細說了。
后端的稍后補充。
/** * 和前端key一致 */ private static String secretKey = "XXXXXXXXXXXXXXXX"; /** * 和前端iv一致 */ private static String iv = "XXXXXXXXXXXXXXXX"; /** * cbc加密 */ public static String encrypt(String plainTxt) { String cipherTxt = ""; SymmetricCrypto sm4 = new SM4( Mode.CBC, Padding.PKCS5Padding, secretKey.getBytes(CharsetUtil.CHARSET_UTF_8), iv.getBytes(CharsetUtil.CHARSET_UTF_8)); byte[] encrypHex = sm4.encrypt(plainTxt); cipherTxt = Base64.encode(encrypHex); return cipherTxt; } /** * cbc解密 */ public static String decrypt(String cipherTxt) { String plainTxt = ""; try { SymmetricCrypto sm4 = new SM4( Mode.CBC, Padding.PKCS5Padding, secretKey.getBytes(CharsetUtil.CHARSET_UTF_8), iv.getBytes(CharsetUtil.CHARSET_UTF_8)); byte[] cipherHex = Base64.decode(cipherTxt.trim()); plainTxt = sm4.decryptStr(cipherHex, CharsetUtil.CHARSET_UTF_8); } catch (Exception e) { // TODO Auto-generated catch block e.printStackTrace(); } return plainTxt; }
工具類:hutool
不要只滿足于世界的表象,要勇于探索未知的可能

浙公網安備 33010602011771號