用Ajax调用web api,解决URL太长的问题;
本来是用的WCF,但是服务需要多种方式调用(后台+前端Ajax),最终局面就是我在WCF每个服务中都判断一下↓
#region 解决接收不到Ajax中传来的参数...
if (jsonParames == null && HttpContext.Current.Request.QueryString["参数"] != null)
jsonParames = HttpContext.Current.Request.QueryString["参数"];
else if (jsonParames == null && HttpContext.Current.Request.QueryString["参数"] == null)
return JSON.Instance.ToJSON("{\"ret\":\"0\",\"msg\":\"参数为空.\"}");
#endregion
但是Ajax中用QueryString传输数据的话,有长度限制。
找了下,还有人说可以用form来解决提交的
<form id='form0' method='POST' action='http://localhost:22377/api/Article_/Article_Update/' onsubmit = "set_v()"> <input id='id_v' type='hidden' value='value_default' name='jsonParames'/> <input type="submit" value="XXX" class="" /> </form>
不过提交完了之后直接就会将页面跳转到'action'所指向的页面。。。
最后还是决定再发布一个web api,然后用Ajax来解决
<form id="form1">
<div>
ID:<input type="text" id="id_ID" />
<br />
<input type="button" value="POST" id="getPersons" />
</div>
<div id="ret">
</div>
</form>
<script type="text/javascript">
function set_v(){
alert('set value!');
var v = 'too long data .';
document.getElementById("id_v").value = v;
alert(document.getElementById("id_v").val());
}
$('#getPersons').click(function () {
document.getElementById("ret").innerHTML = '';//清楚上次查询内容...
var ID = $("#id_ID").val();
$.ajax({
type: 'POST',
url: 'http://localhost:22377/api/Article_/Article_Update',//?jsonParames=' + jsonParames,
//dataType: 'JSONP',//如果这行不注释请求的'type'就是GET,(哪怕第一行就规定了type:'POST')
//contentType:"application/json; charset=utf-8;",//这行不注释说不允许跨域调用!!!
data: {
"jsonParames": '{"id":"0"}'//jsonParames和web api中的参数名对应;
},
success: function (_data) {
alert(_data);
var info = eval('(' + _data + ')');
//alert(data);
var list = eval('(' + info.list + ')');
var fragment = document.createDocumentFragment();
$.each(list, function (i, field_list) {
$.each(field_list, function (i, field) {
var item = document.createElement("li");
item.appendChild(document.createTextNode('[' + i + ']' + '...' + field));
fragment.appendChild(item);
//alert(i + "...is..." + field);
})
})
$("#ret").append(fragment);
},
error: function () { }
});
});
</script>
web api 中;
[HttpPost, HttpGet]
public string Article_Update([FromBody]string jsonParames)
{
if (string.IsNullOrEmpty(jsonParames) || jsonParames.ToLower() == "jsonparames")
{
jsonParames = System.Web.HttpContext.Current.Request.Form["jsonParames"];
}
return "xx";
}
用Ajax调用web api,解决URL太长的问题;的更多相关文章
- 开发程序过程中遇到的调用Web Api小问题
在用Umbraco Web Api开发程序时,前端使用React调用Web Api 当时是有一个页面Search.cshtml,把用React产生的脚本代码,在这个页面进行引用 写了一个Api, 调用 ...
- ASP.NET MVC4中调用WEB API的四个方法
http://tech.it168.com/a2012/0606/1357/000001357231_all.shtml [IT168技术]当今的软件开发中,设计软件的服务并将其通过网络对外发布,让各 ...
- WebApi系列~通过HttpClient来调用Web Api接口
回到目录 HttpClient是一个被封装好的类,主要用于Http的通讯,它在.net,java,oc中都有被实现,当然,我只会.net,所以,只讲.net中的HttpClient去调用Web Api ...
- 通过HttpClient来调用Web Api接口
回到目录 HttpClient是一个被封装好的类,主要用于Http的通讯,它在.net,java,oc中都有被实现,当然,我只会.net,所以,只讲.net中的HttpClient去调用Web Api ...
- ajax调用.net API项目跨域问题解决
ajax调用.net API项目,经常提示跨域问题.添加如下节点代码解决:httpProtocol <system.webServer> <handlers> <remo ...
- jQuery跨域调用Web API
我曾经发表了一篇关于如何开发Web API的博客,链接地址:http://www.cnblogs.com/guwei4037/p/3603818.html.有朋友说开发是会开发了,但不知道怎么调用啊? ...
- Identity Server 4 从入门到落地(五)—— 使用Ajax访问Web Api
前面的部分: Identity Server 4 从入门到落地(一)-- 从IdentityServer4.Admin开始 Identity Server 4 从入门到落地(二)-- 理解授权码模式 ...
- Http下的各种操作类.WebApi系列~通过HttpClient来调用Web Api接口
1.WebApi系列~通过HttpClient来调用Web Api接口 http://www.cnblogs.com/lori/p/4045413.html HttpClient使用详解(java版本 ...
- React Native教程 - 调用Web API
react-native官网Fetch介绍:https://facebook.github.io/react-native/docs/network.html#content react-native ...
随机推荐
- Mongodb FAQ fundamentals(基础篇)
Mongodb FAQ(基础篇),是官方文档的翻译.如有翻译不到之处,还请谅解. 1.Mongdb是什么数据库? mongodb是一个面向文档(document)的数据库,既不支持表连接,也不支持事务 ...
- 异常: http://www.ly.com/news/visa.html: java.io.IOException: unzipBestEffort returned null
nutch 运行时异常: http://www.ly.com/news/visa.html: java.io.IOException: unzipBestEffort returned null 参考 ...
- JS数组整理
1. 检测数组的方法: 1. instanceof[操作符]: var arr = []; console.log(arr instanceof Array);//true 1. instanceof ...
- OpenVPN下载、安装、配置及使用详解
OpenVPN下载.安装.配置及使用详解 OpenVPN简介 OpenVPN是一个用于创建虚拟专用网络(Virtual Private Network)加密通道的免费开源软件.使用OpenVPN可 ...
- throw 与 throws的应用
throws---------->把异常交给调用处. 可以结合throw来同时使用. throws 用在方法声明处,表示本方法不处理异常.可以结合throw使用 throw 表示在方法中手工抛出 ...
- 对C语言中sizeof细节的三点分析
转自对C语言中sizeof细节的三点分析 1.sizeof是运算符,跟加减乘除的性质其实是一样的,在编译的时候进行执行,而不是在运行时才执行. 那么如果编程中验证这一点呢?ps:这是前两天朋友淘宝面试 ...
- HDU4515+计算日期
模拟! /* 计算过了D天后的日期 之前D天的日期 */ #include<stdio.h> int judge_year( int year ){ ==&&year%!= ...
- php smarty insert用法
insert用于模板中. 用法:{insert name="method_name"} 此时会寻找php文件中方法名为:insert_method_name的函数, 将其返回值作为 ...
- javaweb学习总结(三十九)——数据库连接池
一.应用程序直接获取数据库连接的缺点 用户每次请求都需要向数据库获得链接,而数据库创建连接通常需要消耗相对较大的资源,创建时间也较长.假设网站一天10万访问量,数据库服务器就需要创建10万次连接,极大 ...
- 从 Android 静音看正确的查找 bug 的姿势
0.写在前面 没抢到小马哥的红包,无心回家了,回公司写篇文章安慰下自己TT..话说年关难过,bug多多,时间久了难免头昏脑热,不辨朝暮,难识乾坤...艾玛,扯远了,话说谁没踩过坑,可视大家都是如何从坑 ...