一、SM4算法及加密库gm-crypt介绍（可忽略）

SM4：SM4算法是一种分组密码算法，也称为中国商用密码，由中国国家密码管理局于2006年公开发布。它是一种对称密码算法，意味着加密和解密使用相同的密钥。

SM4算法采用了类似于AES的结构，但具有自己独特的设计特点。其基本结构包括以下几个要素：

1. 密钥长度： SM4算法的密钥长度为128位，即16字节。 分组长度： SM4算法将明文和密钥都分成128位（16字节）的数据块进行处理。
2. Feistel网络：SM4采用了类似于DES的Feistel网络结构，通过多轮迭代来实现加密和解密操作。每轮中，数据块被分成两半，经过一系列的轮函数和密钥运算后，两半再进行交换。
3. 非线性变换： SM4算法使用了S盒和线性变换来增强密码的非线性性。
4. 密钥扩展：在SM4算法中，密钥会被扩展成多个轮密钥，以供每轮迭代使用。

SM4算法的安全性经过了广泛的评估和分析，并且已经被国际标准化组织ISO/IEC采纳为国际标准（ISO/IEC 18033-3:2010）。它在保护信息安全、加密通信和数据传输等方面具有广泛的应用。

gm-crypt：gm-crypt是一个提供了对SM4算法实现的js库，能在前端环境中进行加密和解密操作。这个库允许开发者在客户端使用JavaScript来处理敏感数据，而无需将数据传输到服务器端进行加密解密，在一些安全性要求较高的场景中非常有用。简单易用的API，使开发者能够轻松地集成加密功能到他们的Web应用中。
gm-crypt地址：
https://www.npmjs.com/package/gm-crypto

二、 实操流程

1.安装gm-crypto库

可以使用npm 或者yarn 来安装:

npm install gm-crypto

或者

yarn add gm-crypto

2.代码中引入并使用它来实现加密解密的功能。

import gmCrypt from 'gm-crypt';   // 导入 gm-crypt 库

const pwdKey = "后端给的密钥字符串"; //后端给的密钥
let gmCryptConfig = {
  key: pwdKey, //这里这个key值要与后端的一致，后端解密是根据这个key
  mode: "ecb",  // 加密的方式，ecb和cbc两种，也是看后端如何定义的，不过要是cbc的话下面还要加一个iv的参数，ecb不用
  cipherType: "base64"
};
const sm4Util = new gmCrypt.sm4(gmCryptConfig);   // new一个sm4函数，将上面的gmCryptConfig作为参数传递进去

// 定义sm4加密方法
context.pageContextRegistry.register('encryptText', (text: string) => {
  // 使用 gm-crypt 库对文本进行加密
  const encryptedText = sm4Util.encrypt(text);
  return encryptedText;
});

// 定义解密方法
context.pageContextRegistry.register('decryptText', (text: string) => {
  // 使用 gm-crypt 库对文本进行解密
  const decryptedText = sm4Util.decrypt(text);
  return decryptedText;
});

ps：关于ecb和cbc两种加密方式的比较（可忽略）。

• 优点:
  ECB模式：1、简单；2、有利于并行计算；3、误差不会被传送；
  CBC模式：1、不容易主动攻击,安全性好于ECB,适合传输长度长的报文,是SSL、IPSec的标准。
• 缺点:
  ECB模式：1、不能隐藏明文的模式；2、可能对明文进行主动攻击；
  CBC模式：1、不利于并行计算；2、误差传递；3、需要初始化向量IV
• 概念：
  1、ECB模式又称电子密码本模式：Electronic codebook，是最简单的块密码加密模式，加密前根据加密块大小（如AES为128位）分成若干块，之后将每块使用相同的密钥单独加密，解密同理。
  2、密码分组链接（CBC，Cipher-block chaining）模式，由IBM于1976年发明，每个明文块先与前一个密文块进行异或后，再进行加密。在这种方法中，每个密文块都依赖于它前面的所有明文块。同时，为了保证每条消息的唯一性，在第一个块中需要使用初始化向量IV。

3.验证

至此已实现SM4加密。