SmartAdmin | 1024创新实验室

Appearance

一、背景与问题 ​

有时候我们需要对一些关键接口进行如下三种情况：

  • 前端请求参数加密，后端解密
  • 后端返回加密，前端解密
  • 请求参数和后端返回 都需要加解密

二、架构与思想 ​

通过上述三种情况，我们能清楚了解是在 controller 层进行一些拦截操作，所以自然而然想到了 ControllerAdvice，对于 RequestBodyAdviceAdapter 和 ResponseBodyAdvice 进行拦截和处理即可。
当前支持 “国产SM4” 和 “AES” 两种加密算法，后期可以自行扩展

三、具体使用 ​

3.1、选择加密算法 ​

后端：
进入到net.lab1024.sa.base.module.support.apiencrypt.service包结构，有两个实现类。
默认在ApiEncryptServiceSmImpl类上加了@Service注解，表示使用SM4加解密；若想改为其他，可以再其他 实现ApiEncryptService类上加注解。

前端:
进入到`src/lib/encrypt.js`` 文件，在 如下代码中进行 注释来选择加密算法

js
// -----------------------  对外暴露： 加密、解密 -----------------------
outline: 'deep'

// 默认使用SM4算法
const EncryptObject = SM4;
// const EncryptObject = AES

...

3.2、修改秘钥 ​

后端： 在ApiEncryptService对应的实现类中找到 KEY ，进行修改；

前端: 进入到src/lib/encrypt.js 文件，找到 KEY，进行修改，要和后端保持一致。

3.3、参数加密 ​

后端： 在需要解密的 controller方法上加上注解 @ApiDecrypt 。

前端:
1）使用 lib/axios.js 中的 postEncryptRequest 方法进行 请求加密
2）使用 src/lib/encrypt.js 中的 encryptData 方法直接进行加密

3.4、后端返回加密 ​

后端： 在需要解密的 controller方法上加上注解 @ApiEncrypt 。

前端: 不需要任何操作，因为在lib/axios.js 已经对加密过的数据进行解密了。

四、演示案例 ​

后端： 请看java类: AdminApiEncryptController

前端： 请看vue文件：\src\views\support\api-encrypt\api-encrypt-index.vue

支持请求参数加密、解密支持返回内容加密、解密

outline: 'deep'

联系我们 ​

1024创新实验室-主任：卓大，混迹于各个技术圈，研究过计算机，熟悉点 java，略懂点前端。
1024创新实验室（河南·洛阳） 致力于成为中原领先、国内一流的技术团队，以技术创新为驱动，合作各类项目（软件外包、技术顾问、培训等等）。

加微信： 卓大
拉你入群，一起学习		 公众号 ：六边形工程师
分享：赚钱、代码、生活		请 “1024创新实验室”
“烩面里加肉”
“ 咖啡配胡辣汤,提神又饱腹”		抖音 : 六边形工程师
直播：赚钱、代码、中医

阅读量：