前后端分离之模型绑定

• 查询参数绑定，如果请求方法参数是字符串、数字等非封装对象类型

/// <summary>
    /// 查询参数绑定
    /// </summary>
    /// <param name="age"></param>
    /// <param name="name"></param>
    /// <returns></returns>
    [HttpPost]
    public object QueryParamBind(int age, string name)
    {
        return new
        {
            Success = "接收成功",
            Name= name,
            Age = age
        };
    }

📌通过Curl请求可以看见请求参数是以查询参数的方式拼接到请求Url上的，并不会封装为json对象。

• 普通封装对象绑定

/// <summary>
/// 普通对象类型
/// </summary>
public class Person
{
    /// <summary>
    /// 年龄
    /// </summary>
    public int Age { get; set; } = 18;
    
    /// <summary>
    /// 姓名
    /// </summary>
    public string Name { get; set; } = "";
}

...

    /// <summary>
    /// 普通对象绑定
    /// </summary>
    /// <param name="person"></param>
    /// <returns></returns>
    [HttpPost]
    public object CommonObjectBind(Person person)
    {
        return new
        {
            Success = "接收成功",
            Name = person.Name,
            Age = person.Age
        };
    }

📌通过Curl请求可以看到请求参数已经封装为一个json对象，后端接收后通过json序列化后转换为Person对象，需要注意的是这里的普通对象指的是对象成员为数字、字符串的简单封装对象。

• 复杂封装对象绑定

/// <summary>
/// 复杂对象类型
/// </summary>
public class Person
{
    /// <summary>
    /// 年龄
    /// </summary>
    public int Age { get; set; } = 18;
    
    /// <summary>
    /// 姓名
    /// </summary>
    public string Name { get; set; } = "";

    /// <summary>
    /// 生日
    /// </summary>
    public DateTime Birthday { get; set; }

    /// <summary>
    /// 简历文件
    /// </summary>
    public IFormFile Resume { get; set; }
}
...
    /// <summary>
    /// 复杂对象绑定
    /// </summary>
    /// <param name="person"></param>
    /// <returns></returns>
    [HttpPost]
    public object ComplexObjectBind([FromForm]Person person)
    {
        return new
        {
            Success = "接收成功",
            Name = person.Name,
            Age = person.Age,
            Birthday = person.Birthday.ToString("M/d/yy"),
            ResumeName = person.Resume.FileName
        };
    }

📌在进行复杂对象(成员对象含有二进制文件)绑定时，需要设置求情报文的Conten-Type的值（表示后端接收的参数类型），否则后端不能正常解析前端发送的请求参数，常见的Conten-Type格式类型如下：

常用媒体格式

• text/html：HTML格式

• text/plain:纯文本格式

• text/xml：XML格式

• image/gif:gif图片格式

• image/jpeg:jpg图片格式

• image/png:png图片格式

以application开头的媒体格式

• application/xhtml+xml ：XHTML格式

• application/xml： XML数据格式

• application/atom+xml ：Atom XML聚合格式

• application/json： JSON数据格式

• application/pdf：pdf格式

• application/msword ： Word文档格式

• application/octet-stream ： 二进制流数据（如常见的文件下载）

• application/x-www-form-urlencoded ： <form encType=””>中默认的encType，form表单数据被编码为key/value格式发送到服务器（表单默认的提交数据的格式）

文件上传媒体格式

• multipart/form-data ： 需要在表单中进行文件上传时，就需要使用该格式

因此前端请求表单中含有文件时，需要将Content-Type的值改为multipart/form-data 。

📌几个踩坑点

• Asp.Net Core的数据模型中文件的类型为IFormFile对象。

• Asp.Net Core的数据模型中含有IFormFile对象，在请求方法中的参数前应使用[FromForm]注解，否则会绑定错误。

• 前端发送的异步请求荷载对象必须为FormData对象（亲测，自己封装的数据对象后端不能正常解析，即使数据成员和FormData添加的荷载一致）。

• FormData对象使用append(key,value)方法添加请求荷载，并且value值为string|Blob(二进制数据类型基类，JS的File类型基于Blob实现)类型，因此若有Date类型，需要使用其toISOString()方法将其打印为YYYY-MM-DDTHH:mm:ss.sssZ格式字符串，需要注意的是toISOString()会将时区设定为UTC时区，与我们国家有8个小时的时差。