<dependency>
   <groupId>org.bouncycastle</groupId>
   <artifactId>bcprov-jdk15on</artifactId>
   <version>1.70</version>
</dependency>

npm install sm4js

import lombok.Getter;
import lombok.SneakyThrows;
import lombok.extern.slf4j.Slf4j;
import org.bouncycastle.jce.provider.BouncyCastleProvider;
import org.bouncycastle.util.encoders.Hex;

import javax.crypto.Cipher;
import javax.crypto.KeyGenerator;
import javax.crypto.spec.IvParameterSpec;
import javax.crypto.spec.SecretKeySpec;
import java.nio.charset.StandardCharsets;
import java.security.SecureRandom;
import java.security.Security;
import java.util.Base64;

import static java.util.Objects.isNull;

@Slf4j
public class SM4Utils {

    private static final int DEFAULT_KEY_SIZE = 128;
    private static final String ALGORITHM = "SM4";
    private static final String SM4_ECB_ = "SM4/ECB/";
    private static final String SM4_CBC_ = "SM4/CBC/";
    private static final Base64.Encoder BASE64_ENCODER = Base64.getEncoder();
    private static final Base64.Decoder BASE64_DECODER = Base64.getDecoder();
    private static final BouncyCastleProvider PROVIDER = new BouncyCastleProvider();

    // 靜態(tài)代碼塊：注冊BouncyCastle加密提供者
    static {
        if (isNull(Security.getProvider(BouncyCastleProvider.PROVIDER_NAME))) {
            Security.addProvider(PROVIDER);
        }
    }

    // 填充模式枚舉，方便調(diào)用，常用PKCS5/PKCS7
    @Getter
    public enum Padding {
        PKCS5("PKCS5Padding"),
        PKCS7("PKCS7Padding"),
        ISO10126("ISO10126Padding");

        private final String name;

        Padding(String name) {
            this.name = name;
        }
    }

    // 生成Base64格式的SM4密鑰（128位，SM4默認密鑰長度）
    public static String genKeyAsBase64() {
        return genKeyAsBase64(DEFAULT_KEY_SIZE);
    }

    public static String genKeyAsBase64(int keySize) {
        return BASE64_ENCODER.encodeToString(genKey(keySize));
    }

    @SneakyThrows
    private static byte[] genKey(int keySize) {
        KeyGenerator kg = KeyGenerator.getInstance(ALGORITHM, BouncyCastleProvider.PROVIDER_NAME);
        kg.init(keySize, new SecureRandom());
        return kg.generateKey().getEncoded();
    }

    // CBC模式：Base64加密（核心業(yè)務方法，敏感數(shù)據(jù)傳輸用這個）
    public static String encryptBase64_CBC(String data, String key) {
        // 固定IV（前后端必須一致！），也可以動態(tài)生成后和密文一起傳輸
        String fixedIv = "Wqsdy3M345BV6GRXB";
        return BASE64_ENCODER.encodeToString(encrypt_CBC(
                data.getBytes(StandardCharsets.UTF_8),
                key.getBytes(StandardCharsets.UTF_8),
                fixedIv.getBytes(StandardCharsets.UTF_8),
                Padding.PKCS5
        ));
    }

    // CBC模式：底層字節(jié)數(shù)組加密實現(xiàn)
    @SneakyThrows
    private static byte[] encrypt_CBC(byte[] data, byte[] key, byte[] iv, Padding padding) {
        Cipher cipher = getCipher_CBC(padding);
        SecretKeySpec secretKeySpec = new SecretKeySpec(key, ALGORITHM);
        IvParameterSpec ivParameterSpec = new IvParameterSpec(iv);
        cipher.init(Cipher.ENCRYPT_MODE, secretKeySpec, ivParameterSpec);
        return cipher.doFinal(data);
    }

    // 獲取CBC模式的Cipher實例
    @SneakyThrows
    private static Cipher getCipher_CBC(Padding padding) {
        return Cipher.getInstance(SM4_CBC_ + padding.name, BouncyCastleProvider.PROVIDER_NAME);
    }

    // 測試方法
    public static void main(String[] args) {
        // 測試：密鑰（前后端一致，可通過genKeyAsBase64()生成）
        String key = "qwegwfdtwer234";
        // 敏感數(shù)據(jù)
        String sensitiveData = "11111";
        // 加密結果
        String encryptedData = SM4Utils.encryptBase64_CBC(sensitiveData, key);
        System.out.println("加密后的密文：" + encryptedData);
    }
}

import Sm4js from 'sm4js' 
Vue.prototype.$sm4 = Sm4js

import Sm4js from 'sm4js';

let sm4Utils = {};

// 解密方法：參數(shù)（后端約定的密鑰，后端返回的Base64密文）
sm4Utils.decryptedData = function(key, data){
    // sm4配置項：和后端完全對應！
    let sm4Config = {
        key: key, // 密鑰：和后端一致（qwegwfdtwer234）
        iv: 'Wqsdy3M345BV6GRXB', // IV：和后端固定IV一致
        mode: 'cbc', // 加密模式：CBC（和后端一致）
        padding: 'PKCS5Padding' // 填充模式：和后端一致（默認也可以，保險起見顯式指定）
    }
    // 實例化sm4對象
    let sm4 = new Sm4js(sm4Config);
    // 關鍵：后端返回的是Base64密文，先通過atob()解碼，再進行sm4解密
    return sm4.decrypt(atob(data));
}

export default sm4Utils;

<template>
  <div>
    <p>解密后的數(shù)據(jù)：{{ decryptedResult }}</p>
  </div>
</template>

<script>
// 引入sm4解密工具類
import sm4Utils from '@/utils/sm4Utils.js';

export default {
  data() {
    return {
      decryptedResult: '', // 解密結果
      key: 'qwegwfdtwer234', // 后端約定的密鑰
      encryptedData: '' // 后端返回的加密密文（接口請求獲取）
    };
  },
  mounted() {
    // 模擬接口返回密文，調(diào)用解密方法
    this.encryptedData = SM4Utils.encryptBase64_CBC("11111","qwegwfdtwer234"); // 后端返回的密文
    this.decryptedResult = sm4Utils.decryptedData(this.key, this.encryptedData);
  }
};
</script>