后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法


Posted in Javascript onJuly 05, 2016

1.问题:

后端接收不到AngularJs中$http.post发送的数据,总是显示为null

示例代码:

$http.post(/admin/KeyValue/GetListByPage,
{ 
pageindex: 1,
pagesize: 8
})
.success(function(){ 

alert("Mr靖");

});

代码没有错,但是在后台却接收不到数据,这是为什么呢?

用火狐监控:参数是JSON格式

后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法

用谷歌监控:传参方式是request payload

后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法

可以发现传参方式是request payload,参数格式是json,而并非用的是form传参,所以在后台用接收form数据的方式接收参数就接收不到了

POST表单请求提交时,使用的Content-Type是application/x-www-form-urlencoded,而使用原生AJAX的POST请求如果不指
定请求头RequestHeader,默认使用的Content-Type是text/plain;charset=UTF-8,而此处的Content-Type是:

后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法

--------------------------------------------------------------------------------

2.解决方法:

直接上代码:

//要通过post传递的参数
var data = {
pageindex: 1,
pagesize: 8,
},
//post请求的地址
url = "/admin/KeyValue/GetListByPage",
//将参数传递的方式改成form
postCfg = {
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
transformRequest: function (data) {
return $.param(data);
}
};
//发送post请求,获取数据
$http.post(url, data, postCfg)
.success(function (response) {
alert("Mr靖");
});

接下来再看监视工具:

火狐监视:参数类型已经变成表单数据

后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法

谷歌监视:

后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法

现在传参方式就变成form方式了,然后后端就可以正常接收参数了!

以上所述是小编给大家介绍的后端接收不到AngularJs中$http.post发送的数据原因分析及解决办法的相关知识,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
jQuery对象[0]是什么含义?
Jul 31 Javascript
基于jQuery的淡入淡出可自动切换的幻灯插件
Aug 24 Javascript
ASP.NET MVC中EasyUI的datagrid跨域调用实现代码
Mar 14 Javascript
javascript中的startWith和endWith的几种实现方法
May 07 Javascript
js或jquery实现页面打印可局部打印
Mar 27 Javascript
JavaScript操作Cookie详解
Feb 28 Javascript
使用AngularJS编写较为优美的JavaScript代码指南
Jun 19 Javascript
vueJS简单的点击显示与隐藏的效果【实现代码】
May 03 Javascript
JavaScript使用forEach()与jQuery使用each遍历数组时return false 的区别
Aug 26 Javascript
Js操作DOM元素及获取浏览器高宽的简单方法
Sep 08 Javascript
JS解决移动web开发手机输入框弹出的问题
Mar 31 Javascript
微信小程序动画(Animation)的实现及执行步骤
Oct 28 Javascript
微信JS-SDK坐标位置如何转换为百度地图坐标
Jul 04 #Javascript
Bootstrap实现水平排列的表单
Jul 04 #Javascript
JSONP跨域请求实例详解
Jul 04 #Javascript
Bootstrap表单布局样式源代码
Jul 04 #Javascript
JS JSOP跨域请求实例详解
Jul 04 #Javascript
json格式的javascript对象用法分析
Jul 04 #Javascript
jQuery简单动画变换效果实例分析
Jul 04 #Javascript
You might like
十天学会php(3)
2006/10/09 PHP
PHP常用代码大全(新手入门必备)
2010/06/29 PHP
Laravel 4.2 中队列服务(queue)使用感受
2014/10/30 PHP
Smarty日期时间操作方法示例
2016/11/15 PHP
扩展jQuery 键盘事件的几个基本方法
2009/10/30 Javascript
Jquery中getJSON在asp.net中的使用说明
2011/03/10 Javascript
js二级地域选择的实现方法
2013/06/17 Javascript
js判断上传文件类型判断FileUpload文件类型代码
2014/05/20 Javascript
javascript检查浏览器是否支持flash的实现代码
2014/08/14 Javascript
jquery实现鼠标滑过小图时显示大图的方法
2015/01/14 Javascript
详解Bootstrap的iCheck插件checkbox和radio
2016/08/24 Javascript
详解Vue CLI3 多页应用实践和源码设计
2018/08/30 Javascript
详解webpack 最简打包结果分析
2019/02/20 Javascript
对layui中的onevent 和event的使用详解
2019/09/06 Javascript
Vue的Options用法说明
2020/08/14 Javascript
Python基于matplotlib绘制栈式直方图的方法示例
2017/08/09 Python
Python中int()函数的用法浅析
2017/10/17 Python
Python实战小程序利用matplotlib模块画图代码分享
2017/12/09 Python
Python 安装第三方库 pip install 安装慢安装不上的解决办法
2019/06/18 Python
python实现对图片进行旋转,放缩,裁剪的功能
2019/08/07 Python
python连接mongodb集群方法详解
2020/02/13 Python
pycharm运行程序时看不到任何结果显示的解决
2020/02/21 Python
python 伯努利分布详解
2020/02/25 Python
Python pip install之SSL异常处理操作
2020/09/03 Python
乌克兰网上服装店:Bolf.ua
2018/10/30 全球购物
领先的英国注册在线药房 :Simply Meds Online
2019/03/28 全球购物
乌克兰电子和家用电器商店:Foxtrot
2019/07/23 全球购物
本科生详细的自我评价
2013/09/19 职场文书
2014坚持党风廉政建设思想汇报
2014/09/18 职场文书
2014党委书记四风对照检查材料思想汇报
2014/09/21 职场文书
基层工作经验证明样本
2014/11/16 职场文书
《追风筝的人》:人心中的成见是座大山,但请不忘初心
2019/11/15 职场文书
MySQL Innodb关键特性之插入缓冲(insert buffer)
2021/04/08 MySQL
Python中相见恨晚的技巧
2021/04/13 Python
Spring mvc是如何实现与数据库的前后端的连接操作的?
2021/06/30 Java/Android
Java日常练习题,每天进步一点点(38)
2021/07/26 Java/Android