FormData 文件上传提交表单请求400的问题

项目场景：

前端使用 formData 提交带文件上传的表单请求报400

问题描述：

前端将参数拼成 FormData 的格式，代码如下：

			let formData = new FormData();
            if (this.$refs.basicInfo.$refs.licenseNumberPhoto.$children[0].fileList[0]) {
    
    
                formData.append("licenseNumberPhoto", this.$refs.basicInfo.$refs.licenseNumberPhoto.$children[0].fileList[0].raw);
            }
            for (let key in this.form) {
    
    
                if (this.form.hasOwnProperty(key)) {
    
    
                    formData.append(key, this.form[key] || '')
                }
            }
            this.$refs.form.validate(valid => {
    
    
                    addCar(formData).then((response) => {
    
    
                        if (response.code === 200) {
    
    
                            this.msgSuccess("新增成功");
                            this.form.disabled = true;
                            this.changeMode();
                        }
                    }
                } 
            })

后端是用一个对象和 HttpServletRequest 来接收的：

	@PostMapping("/update")
    public AjaxResult edit(TzCar tzCar, HttpServletRequest request) {
    
    
        int result;
        try {
    
    
            result = tzCarService.updateTzCar(tzCar, request);
        } catch (Exception e) {
    
    
            logger.error(e.getMessage());
            return AjaxResult.error(e.getMessage());
        }
        return toAjax(result);
    }

调试的时候控制台有异常信息：

[Failed to convert property value of type 'java.lang.String' to required type 'java.lang.Long' for property 'allowedPassenger'; nested exception is java.lang.NumberFormatException: For input string: "null"]

---

原因分析:

从控制台异常信息可以看到：出现了 “null” String类型的值，然后出现了类型转换异常。
思考这个 “null” 值，应该是前端 FormData 拼进去的，于是看了下 FormData 的 append 方法：

interface FormData {
    
    
    append(name: string, value: string | Blob, fileName?: string): void;
    ...
}

很明显可以看到 append 接收的 value 值只能是 string | Blob 类型，应该是将 null 自动转化为了字符串“null” 。

---

解决方案：

前端也很好处理，append 的时候将 null 转化为空字符串：

			for (let key in this.form) {
    
    
                if (this.form.hasOwnProperty(key)) {
    
    
                    formData.append(key, this.form[key] || '')
                }
            }