这两天趁着周末寻思把密码管理的小App开发完了,省的在公司没办法知道家里的那套密码,在家里没办法知道公司的这套密码。
新的密码管理器直接把数据上传到服务器上了,哪儿都能访问。加密方案可以参考以前的文章:《前端使用Web Cryptography API进行内容加密,几乎无法破解》
但是数据保存的时候遇到一个邪门的问题:
上传三个参数,两个参数是后台服务能正常接收到的,一个参数接收到是null。但是在Network中看接口三个参数又是整整齐齐排列的,这不仅让我头大。

问题分析
前端就是一个非常非常正常传参操作,绝对没错,毕竟Network中是正常的。
js
let payload = {
encryptedData: encrypted.encryptedData,
iv: encrypted.iv,
salt: 'salt',
authTag: encrypted.authTag,
}
if(props.status === 'edit' && props.info.id) {
payload.id = props.info.id;
}
submitLoading.value = true;
const res = SystemApi.saveData(payload);
后端代码看起来也没啥错。
java
@PostMapping("/saveData")
public void saveData(@RequestBody EncryptedData endata) {
if (endata.getId() == null || endata.getId() <= 0) {
encryptedDataService.create(endata);
} else {
encryptedDataService.update(endata);
}
}
从这里开始就报错,打断点显示endata中的encryptedData参数就是null。
排查问题
首先是不是前端的问题,数据在传输过程中丢了?
但是Network中是能够正常显示数据的,所以不是前端的问题。
但是在后端处理过程中丢了也不可能,因为接收都没接到。
那就只能是接收过程中出现了问题。
一般问题只能是几种:
- 字段名不一致?(排查一遍,不是,都叫
encryptedData
) - MyBatis字段映射问题?(不是,还没到那儿呢)
- 反序列化问题?(应该是,因为只有最长的这个数据丢了,其他两个没事儿)
问题定位到了:实体类字段定义是byte[] encryptedData
,但前端发送的是Integer[]
类型的数组
修改问题
解决方案一
修改实体类字段类型为List<Integer>
。
java
public class EncryptedData {
private List<Integer> encryptedData; // 改为 List<Integer>
...
}
解决方案二
在 Controller 层手动转换为 byte[]
。
java
@PostMapping("/saveData")
public ResponseEntity<String> saveData(@RequestBody Map<String, Object> payload) {
try {
EncryptedData encryptedData = new EncryptedData();
...
// encryptedData 处理
mm.setEncryptedData(convertToByteArray((List<Integer>) payload.get("encryptedData")));
...
} catch (Exception e) {
e.printStackTrace();
return ResponseEntity.status(500).body("保存失败:" + e.getMessage());
}
}
// 辅助方法:将 List<Integer> 转为 byte[]
private byte[] convertToByteArray(List<Integer> list) {
if (list == null || list.isEmpty()) {
return new byte[0];
}
byte[] result = new byte[list.size()];
for (int i = 0; i < list.size(); i++) {
result[i] = list.get(i).byteValue();
}
return result;
}
至此,问题完全解决!