上传三个参数,两个接收正常,一个死活都是null?

这两天趁着周末寻思把密码管理的小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;
}

至此,问题完全解决!

相关推荐
一 乐1 天前
婚纱摄影网站|基于ssm + vue婚纱摄影网站系统(源码+数据库+文档)
前端·javascript·数据库·vue.js·spring boot·后端
码事漫谈1 天前
Protocol Buffers 编码原理深度解析
后端
码事漫谈1 天前
gRPC源码剖析:高性能RPC的实现原理与工程实践
后端
期待のcode1 天前
前后端分离项目 Springboot+vue 在云服务器上的部署
服务器·vue.js·spring boot
踏浪无痕1 天前
AI 时代架构师如何有效成长?
人工智能·后端·架构
程序员小假1 天前
我们来说一下无锁队列 Disruptor 的原理
java·后端
ProgramHan1 天前
Spring Boot 3.2 新特性:虚拟线程的落地实践
java·jvm·spring boot
武子康1 天前
大数据-209 深度理解逻辑回归(Logistic Regression)与梯度下降优化算法
大数据·后端·机器学习
maozexijr1 天前
Rabbit MQ中@Exchange(durable = “true“) 和 @Queue(durable = “true“) 有什么区别
开发语言·后端·ruby
源码获取_wx:Fegn08951 天前
基于 vue智慧养老院系统
开发语言·前端·javascript·vue.js·spring boot·后端·课程设计