Ajax请求传递参数遇到的问题
WebAPI传递参数遇到的问题
Ajax的格式：
$.ajax({
type: "get", //数据发送的方式（post 或者 get）
url: "/admin/index", //要发送的后台地址
data: { val1: "", val2: "" }, //要发送的数据（参数）格式为{'val1':"1","val2":"2"}
dataType: "json", //后台处理后返回的数据格式
success: function(data) {//ajax请求成功后触发的方法
alert('请求成功');
},
error: function(msg) {//ajax请求失败后触发的方法
alert(msg); //弹出错误信息
}
});
后台实体类（Person）：
namespace WebApi.Models
{
public class Person
{
public int ID { get; set; }
public string Name { get; set; }
public string EnglishName { get; set; }
}
}
后台接口：
public class TestController : ApiController
{
public Person GetEnglishName(int ID, string Name)
{
Person man = new Person();
man.ID = ID;
man.Name = Name;
man.EnglishName = "Bert";
return man;
}
}
前端Ajax请求：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="Scripts/jquery-1.10.2.min.js"></script>
<title></title>
</head>
<body>
<input type="submit" id="testId" /><input type="text" id="text1" />
</body>
</html> <script type="text/javascript">
$("#testId").click(function() {
$.ajax({
url: "/api/Test/GetEnglishName",
type: "GET",
data: { "ID": 1, "Name": "yzc" },
success: function(data) {
$("#text1").val(data.EnglishName);
}
});
});
</script>
结果：
如上，这是最普通的一次WebApi的Ajax请求，接下来我们来讲几个比较特殊的例子。代码修改如下：黄色荧光笔的都是改动的代码。
后台接口：
public class TestController : ApiController
{
public Person SetEnglishName(int ID, string Name)
{
Person man = new Person();
man.ID = ID;
man.Name = Name;
man.EnglishName = "Bert";
return man;
}
}
前端Ajax请求：
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script src="Scripts/jquery-1.10.2.min.js"></script>
<title></title>
</head>
<body>
<input type="submit" id="testId" /><input type="text" id="text1" />
</body>
</html> <script type="text/javascript">
$("#testId").click(function() {
$.ajax({
url: "/api/Test/SetEnglishName",
type: "GET",
data: { "ID": 1, "Name": "yzc" },
success: function(data) {
$("#text1").val(data.EnglishName);
}
});
});
</script>
结果：
结论：
我们仅仅只是更改了接口的名称而已，从GetEnglishName改为SetEnglishName，为什么就找不到该方法了呢？
原因是：WebAPI对于后台方法接口在没有给它添加访问方式的前提下（如：[HttpPost]），并且方法名称开头带着Get的话，默认是Get请求。
所有在上面例子中，方法名既没有标明请求方式，也不是Get开头，它自然找不到可以允许访问的方法了，建议：不管是什么类型的请求都在方法上设置访问类型。
post请求传递一个参数的时候，data并不是传的键/值对形式，而是data:{"":"yzc"},记住这种特殊情况，不然后台是获取不到前端传过去的值得，至于原因是：Web API 要求请求传递的 [FromBody] 参数，是有一个特定的格式，才能被正确的获取到。
post传递多个参数的时候 (被标记[FromBody]的参数只能出现一次，被标记为[FromUri]的参数可以出现多次，如果被标记为[FromUri]的参数是简单参数，该标记可以去掉。)
请求的时候
1、data：JSON.stringify(x)和contentType: "application/json"一起使用，或者
2、data：{为键值对}，并且不能加contentType: "application/json"，这两种情况后台[FromBody]参数都能获取到值。（经测试过，当出现交叉情况，如:data里面为键值对，且加了contentType: "application/json"，后台将不能访问数据）
当post请求的参数多的时候，就需要封装在一个类里面，这样后台也需要创建临时类来接收，而dynamic可以让我们省掉许多类。然而前端Ajax请求参数的配置目前自己试过的只有data：JSON.stringify(x)和contentType:"application/json"一起后台才能拿到数据。
后台接口：
public class TestController : ApiController
{
[HttpPost]
public Person GetEnglishName(dynamic per)
{
Person man = new Person();
man.ID = per.ID;
man.Name = per.Name;
man.EnglishName = "Bert";
return man;
}
}
前端Ajax请求：
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<script src="Scripts/jquery-1.10.2.min.js"></script>
</head>
<body>
<input type="submit" id="testId" /><input type="text" id="text1" />
</body>
</html> <script type="text/javascript">
$("#testId").click(function() {
$.ajax({
url: "/api/Test/GetEnglishName",
type: "POST",
contentType: "application/json",
data: JSON.stringify({ "ID": , "Name": "yzc" }),
success: function(data) {
$("#text1").val(data.EnglishName);
}
});
});
</script>
结果：
原文：https://www.cnblogs.com/yzcStudy/p/5767109.html
Ajax请求传递参数遇到的问题的更多相关文章
- WebAPI学习日记一：Ajax请求传递参数遇到的问题
首先,本人大学刚毕业,想把自己学习的一些东西记录下来,也是和大家分享,如有不对之处还请多加指正.声明:但凡是我博客里的文章均是本人实际操作遇到的例子,不会随便从网上拷贝或者转载,本着对自己和观众负责的 ...
- ajax请求在参数中添加时间戳
ajax请求在参数中添加时间戳 参考网址
- 资料汇总--Ajax中Put和Delete请求传递参数无效的解决方法（Restful风格）【转】
开发环境:Tomcat9.0 在使用Ajax实现Restful的时候,有时候会出现无法Put.Delete请求参数无法传递到程序中的尴尬情况,此时我们可以有两种解决方案:1.使用地址重写的方法传递参数 ...
- Ajax中Put和Delete请求传递参数无效的解决方法（Restful风格）
本文装载自:http://blog.csdn.net/u012737182/article/details/52831008 感谢原文作者分享 开发环境:Tomcat9.0 在使用Ajax实现R ...
- Ajax请求传递数组参数的方法
方法一:拼接字符串参数 var arr={params:['param','param2']}; $.ajax({url:请求地址, data:arr, type:"POST", ...
- springmvc框架下ajax请求传参数中文乱码解决
springmvc框架下jsp界面通过ajax请求后台数据,传递中文参数到后台显示乱码 解决方法:js代码 运用encodeURI处理两次 /* *掩码处理 */ function maskWord( ...
- 复用$.ajax方式传递参数错误处理
1.封装后的方法,在 data:inData 传递参数的方式和一般不一样,如果不注意会出现错误. function getDataByJsonP(methName, inData, fn) { $.a ...
- Ajax请求的参数
post请求和get请求存放参数位置 post请求和get请求存放参数位置是不同的: post方式参数存放在请求数据包的消息体中. get方式参数存放在请求数据包的请求行的URI字段中,以?开始以pa ...
- Ajax请求传递数组参数
var ids = []; var rows=$("#tt").datagrid("getSelections"); for(var i=0; i<row ...
随机推荐
- GO:格式化代码
http://www.ituring.com.cn/article/39380 Go 开发团队不想要 Go 语言像许多其它语言那样总是在为代码风格而引发无休止的争论,浪费大量宝贵的开发时间,因此他们制 ...
- shell条件测试
文件状态测试-b filename : 当filename 存在并且是块文件时返回真(返回0)-c filename : 当filename 存在并且是字符文件时返回真-d pathname : 当p ...
- 151111 sqlite3数据库学习
最近在学习数据库,想起去年做的项目里用到了sqlite3.那时候,没有任何的数据库经验,误打误撞,找到了sqlite3,然后参考网络上零碎的信息,把它嵌入到工程里,并且成功了.可惜,那时候没有好好保存 ...
- 搭建一个 简易的php版 todolist
我记得以前使用 wunderlist 但是国外..后来用了半年. 挺方便的.但是.后来慢慢忘了这工具存在 缺少了todolist.效率折半.. so.我搭建了个简单的todolist. :mytin ...
- 【POJ】1204 Word Puzzles
这道题目各种wa.首先是错了一个坐标,居然没测出来.然后是剪枝错误.搜索pen时就返回,可能还存在串pen*. #include <cstdio> #include <cstring ...
- java学习之数组（一）【内存】
在java语言当中,为了更方便多个数据的管理,这里提供数组. 比如说,现在我们有一组数据,7,8,9,9,为了保存这四个数据,我们分别要定义变量来保存,少了还好说.但是假如,有100多个数据呢,我们一 ...
- java学习之函数
讲完了语句结构还有运算符.变量,下面我们来了解下函数. 那么什么是函数,函数的定义是怎样的呢? 函数的定义: 函数是指在类当中定义的一段有特殊功能的代码段,同时函数在类中也被成为方法. class F ...
- 揭开Linux操作系统的Swap交换区之谜
揭开Linux操作系统的Swap交换区之谜 Swap,即交换区,除了安装Linux的时候,有多少人关心过它呢?其实,Swap的调整对Linux服务器,特别是Web服务器的性能至关重要.通过调整Swap ...
- SVN服务器搭建（与apache整合）
一．SVN介绍 SVN是一个版本控制工具,Subversion的版本库(repository),就是位于服务器,统一管理和储存数据的地方. 二．SVN数据存储方式 在Subversion中,版本库的数 ...
- POJ 3436 ACM Computer Factory
题意: 为了追求ACM比赛的公平性,所有用作ACM比赛的电脑性能是一样的,而ACM董事会专门有一条生产线来生产这样的电脑,随着比赛规模的越来越大,生产线的生产能力不能满足需要,所以说ACM董事会想 ...