使用 jQuery 将多个参数发布到 Web API答案

【问题标题】：Posting multiple parameters to Web API using jQuery使用 jQuery 将多个参数发布到 Web API
【发布时间】：2013-06-17 21:15:39
【问题描述】：

像我之前的许多人一样，我正在尝试将多个参数传递给 Web API 项目。我已经尝试了这个网站上提供的几种解决方案，但都没有成功。我最近失败的迭代如下所示：

控制器

public class UserDTO
{
   public int userID;
   public string username;
}

[HttpPost]
public string Post([FromBody]UserDTO userDTO)
{
   return userDTO.userID.ToString() + " " + userDTO.username;
}

Web API 路由配置

config.Routes.MapHttpRoute(
   name: "DefaultApi",
   routeTemplate: "api/{controller}/{id}",
   defaults: new { id = RouteParameter.Optional }
);

jQuery

var apiUrl = "http://localhost:55051/api/User/Post";
var userDTO = {
   userID: 5,
   username: "testuser"
};

$.ajax({
   type: "POST",
   url: apiUrl,
   data: JSON.stringify(userDTO),
   datatype: "json",
   contenttype: "application/json; charset=utf-8"
)};

提琴手输出

Fiddler 显示正确传递的 JSON 变量，在原始视图中我可以看到：

{"userID":5,"username":"testuser"}

执行中

userID = 0
username = null

救命！

我认为问题出在 Web API 上，鉴于我的 POST 在 Fiddler 中的格式似乎正确，因此很难使用 JSON 参数。有什么想法吗？

【问题讨论】：

这可能与当前问题有关，但datatype: "json", 应该是dataType: "json",
contentType 实际上也是如此
感谢 Sushanth 和 Joppe，您的建议奏效了！

标签： c# jquery json asp.net-web-api

【解决方案1】：

您的 jQuery ajax 调用不会失败吗？检查一下？

var apiUrl = "http://localhost:55051/api/UserController/Post";

看到你的代码应该是这样的：

var apiUrl = "http://localhost:55051/api/User";

“控制器”一词通常不属于您的网址。您不必显式调用 POST，它应该按照惯例选择它，因为您的 ajax 调用是一个 POST。

编辑：

上面的内容和您在 ajax 调用中的大小写已被评论。

我个人使用 Firebug（Firefox 扩展）来调试这些案例。如果在这种情况下发现它比 fiddler 更方便。

【讨论】：

很好看。我在创建问题时手动编辑了代码以删除一些命名并留下该错误。但是，原始问题仍然存在，但是您的区分大小写的答案已解决。太感谢了！ :)

【解决方案2】：

我的猜测是您必须通过： { userDTO : { userID ... } } 作为 jquery 中的数据。请求被包装。当然，您必须对此进行字符串化。

现在您传递参数，但它们都不匹配 userDTO，因此它获取默认值。

在这里查看我之前的回答：Jquery post

【讨论】：