formdata请求接口传递参数格式

在前后端交互的过程中，我们常常需要使用ajax请求来向服务端发送数据。其中，常用的一种传参方式就是FormData。本文将详细介绍FormData的使用方法以及注意事项。

什么是FormData

FormData 是一种表单序列化的方式，用于将表单数据格式化为 key/value 的形式，从而方便地用于ajax异步请求。

FormData 的使用方法

使用 FormData 时，需要通过JS获取到页面中的表单元素，进而获取到表单的数据。示例代码如下：

var formData = new FormData();

var nameValue = document.getElementById('name').value;
formData.append('name', nameValue);

var ageValue = document.getElementById('age').value;
formData.append('age', ageValue);

上面的代码中，我们通过 document.getElementById 获取了表单中两个元素的值，并将其添加到formData中。

接着，我们就可以向服务端发送请求了。使用ajax发送FormData的示例代码如下：

$.ajax({
    url: '/example',
    data: formData,
    type: 'POST',
    contentType: false,
    processData: false,
    success: function(data) {
        // 请求成功
    },
    error: function() {
        // 请求失败
    }
});

此处需要注意的是，需要将 contentType 和 processData 设置为 false。这样，jQuery就会将Data作为一个FormData对象进行处理。

FormData 的注意事项

• 使用FormData时，浏览器必须支持HTML5
• 不支持二进制数据，如文件的上传需要使用特殊的方式
• FormData的每个属性对应的值是一个数组，可以通过append方法添加值，如 append('history[]', '1989') 和 append('history[]', '1990') 这两行代码添加的数据就是数组

总结

FormData 是前端开发中非常常用的一种数据格式化方式。在使用时需要注意以上的注意事项，在此基础上合理地使用FormData可以大大提升后端数据处理效率。