后端接收不到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 相关文章推荐
收集的一些Array及String原型对象的扩展实现代码
Dec 05 Javascript
javascript 图片裁剪技巧解读
Nov 15 Javascript
javascript 拷贝节点cloneNode()使用介绍
Apr 03 Javascript
JavaScript获取当前网页最后修改时间的方法
Apr 03 Javascript
jquery Easyui快速开发总结
Aug 20 Javascript
BootStrap table使用方法分析
Nov 08 Javascript
jquery实现轮播图效果
Feb 13 Javascript
Vue-cli中为单独页面设置背景色的实现方法
Feb 11 Javascript
详解JS实现系统登录页的登录和验证
Apr 29 Javascript
layui表单验证select下拉框实现验证的方法
Sep 05 Javascript
vue h5移动端禁止缩放代码
Oct 28 Javascript
基于Vue中使用节流Lodash throttle详解
Oct 30 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 Memcached + APC + 文件缓存封装实现代码
2010/03/11 PHP
PHP json_decode函数详细解析
2014/02/17 PHP
PHP基于GD库的图像处理方法小结
2016/09/27 PHP
PHP Class SoapClient not found解决方法
2018/01/20 PHP
google地图的路线实现代码
2009/08/20 Javascript
js中把JSON字符串转换成JSON对象最好的方法
2014/03/21 Javascript
jQuery使用$获取对象后检查该对象是否存在的实现方法
2016/09/04 Javascript
JavaScript组成、引入、输出、运算符基础知识讲解
2016/12/08 Javascript
jquery hover 不停闪动问题的解决方法(亦为stop()的使用)
2017/02/10 Javascript
JavaScript瀑布流布局实现代码
2017/05/06 Javascript
vue实现一个移动端屏蔽滑动的遮罩层实例
2017/06/08 Javascript
jquery在启动页面时,自动加载数据的实例
2018/01/22 jQuery
详解使用React进行组件库开发
2018/02/06 Javascript
浅谈js获取ModelAndView值的问题
2018/03/28 Javascript
使用 electron 实现类似新版 QQ 的登录界面效果(阴影、背景动画、窗体3D翻转)
2018/10/23 Javascript
教你搭建按需加载的Vue组件库(小结)
2019/07/29 Javascript
[01:03:37]Secret vs VGJ.S Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
讲解Python中for循环下的索引变量的作用域
2015/04/15 Python
编写Python的web框架中的Model的教程
2015/04/29 Python
python检查序列seq是否含有aset中项的方法
2015/06/30 Python
遗传算法之Python实现代码
2017/10/10 Python
pandas 使用均值填充缺失值列的小技巧分享
2019/07/04 Python
Pandas读取csv时如何设置列名
2020/06/02 Python
Python中Selenium库使用教程详解
2020/07/23 Python
python实现移动木板小游戏
2020/10/09 Python
布局和排版教程 纯css3实现图片三角形排列
2014/10/17 HTML / CSS
不可轻视HTML5!App三年内将被html5顶替彻底消失
2015/11/18 HTML / CSS
健身场所或家用健身设备:Life Fitness
2017/11/01 全球购物
意大利顶级奢侈品电商:LUISAVIAROMA(支持中文)
2020/05/26 全球购物
大整数数相乘的问题
2012/07/22 面试题
毕业生精彩的自我评价分享
2013/10/06 职场文书
学生病假条怎么写
2015/08/17 职场文书
2016年小学六一儿童节活动总结
2016/04/06 职场文书
WebRTC记录音视频流(web技术分享)
2022/02/24 Javascript
详解pytorch创建tensor函数
2022/03/22 Python
WinServer2012搭建DNS服务器的方法步骤
2022/06/10 Servers