Angular 5向Asp.NET MVC Controller传值为Null问题求助

看起来你遇到了前后端数据绑定的典型问题，我来帮你拆解两种Content-Type场景下的问题原因和解决方案：

一、使用application/json时请求无法被接收的问题 #

这是因为ASP.NET MVC的[HttpPost] Action默认不会自动从JSON格式的请求体中绑定复杂类型参数，需要明确指定参数来源。

修复步骤： #

1. Angular端代码调整：
   不用手动调用JSON.stringify()，Angular的HttpClient.post会自动将传入的对象序列化为JSON字符串，只需确保请求头正确设置为application/json：

   adduser(userdata: User) {
     const httpOpt = {
       headers: new HttpHeaders({
         'Content-Type': 'application/json'
       })
     };
     // 直接传入userdata对象，无需手动stringify
     return this.httpClient.post("http://localhost:21936/UserRegistration/Registration", userdata, httpOpt);
   }
   

2. ASP.NET MVC Controller调整：
   在Action的参数上添加[FromBody]特性，告诉框架从请求体中读取并绑定JSON数据：

   [HttpPost]
   public ActionResult Registration([FromBody] User userdata)
   {
       // 这里现在应该能接收到正确的userdata了
       // 你的业务逻辑代码
       return Json(new { Status = "Success" });
   }
   

3. 额外检查：

   • 确保前后端User类的属性名一致（比如Angular里的userName对应C#里的UserName，如果大小写或命名不一致，可以用[JsonProperty]特性做映射，比如C#里写[JsonProperty("userName")] public string UserName { get; set; }）
   • 确认后端已经配置了CORS（因为你是跨域请求localhost不同端口），避免请求被拦截

二、使用application/x-www-form-urlencoded时数据为Null的问题 #

这种情况下请求能到达控制器，但数据为Null，是因为你传入的是JSON字符串，而框架期望的是键值对格式的表单数据，无法自动解析JSON字符串到User对象。

修复步骤： #

1. Angular端代码调整：
   将User对象转换为表单键值对格式，使用Angular的HttpParams来构建请求体：

   adduser(userdata: User) {
     let formParams = new HttpParams()
       .set("UserName", userdata.userName)
       .set("Email", userdata.email)
       .set("Password", userdata.password); // 按你的User属性依次添加
       
     const httpOpt = {
       headers: new HttpHeaders({
         'Content-Type': 'application/x-www-form-urlencoded'
       })
     };
     return this.httpClient.post("http://localhost:21936/UserRegistration/Registration", formParams.toString(), httpOpt);
   }
   

2. ASP.NET MVC Controller调整：
   这里不需要加[FromBody]，框架会自动从表单请求体中绑定参数到User对象：

   [HttpPost]
   public ActionResult Registration(User userdata)
   {
       // 现在应该能接收到正确的userdata了
       // 你的业务逻辑代码
       return Json(new { Status = "Success" });
   }
   

总结推荐 #

更推荐使用application/json的方式，这是RESTful API的标准做法，也更适合传递复杂对象。如果必须使用表单格式，一定要确保请求体是键值对而不是JSON字符串。

内容的提问来源于stack exchange，提问作者Manoj devinvent