后端接收不到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 相关文章推荐
在Javascript中定义对象类别
Dec 22 Javascript
开发跨浏览器javascript常见注意事项
Jan 01 Javascript
location.search在客户端获取Url参数的方法
Jun 08 Javascript
幻灯片带网页设计中的20个奇妙应用示例小结
May 27 Javascript
详解AngularJS中$http缓存以及处理多个$http请求的方法
Feb 06 Javascript
深入理解js函数的作用域与this指向
May 28 Javascript
localStorage的黑科技-js和css缓存机制
Feb 06 Javascript
原生JS实现的放大镜特效示例【测试可用】
Dec 08 Javascript
JavaScript中.min.js和.js文件的区别讲解
Feb 13 Javascript
uni-app之APP和小程序微信授权方法
May 09 Javascript
微信小程序实现类似微信点击语音播放效果
Mar 30 Javascript
解决await在forEach中不起作用的问题
Feb 25 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 Mysql编程之高级技巧
2008/08/27 PHP
PHP mail()函数使用及配置方法
2014/01/14 PHP
WordPress中对访客评论功能的一些优化方法
2015/11/24 PHP
php+ajax实现带进度条的上传图片功能【附demo源码下载】
2016/09/14 PHP
写出更好的JavaScript之undefined篇(上)
2009/11/22 Javascript
JQuery动态给table添加、删除行 改进版
2011/01/19 Javascript
网页编辑器ckeditor和ckfinder配置步骤分享
2012/05/24 Javascript
window.onload和$(function(){})的区别介绍
2013/10/30 Javascript
ajax请求get与post的区别总结
2013/11/04 Javascript
浅析js设置控件的readonly与enabled属性问题
2013/12/25 Javascript
javascript创建和存储cookie示例
2014/01/07 Javascript
jquery实现人性化的有选择性禁用鼠标右键
2014/06/30 Javascript
jQuery修改class属性和CSS样式整理
2015/01/30 Javascript
使用命令对象代替switch语句的写法示例
2015/02/28 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
2015/12/03 Javascript
总结十个Angular.js由浅入深的面试问题
2016/08/26 Javascript
jQuery在header中设置请求信息的方法
2017/03/06 Javascript
JavaScript基于对象方法实现数组去重及排序操作示例
2018/07/10 Javascript
angular中子控制器向父控制器传值的实例
2018/10/08 Javascript
ES6 Class中实现私有属性的一些方法总结
2019/07/08 Javascript
[02:44]2014DOTA2 国际邀请赛中国区预选赛 大神红毯秀
2014/05/25 DOTA
[43:58]DOTA2上海特级锦标赛C组败者赛 Newbee VS Archon第二局
2016/02/27 DOTA
[04:16]完美世界DOTA2联赛PWL S2 集锦第一期
2020/11/23 DOTA
Python中操作mysql的pymysql模块详解
2016/09/13 Python
Python中的函数作用域
2018/05/07 Python
Python 运行.py文件和交互式运行代码的区别详解
2019/07/02 Python
html5给汉字加拼音加进度条的实现代码
2020/04/07 HTML / CSS
美国婚礼礼品网站:MyWeddingFavors
2018/09/26 全球购物
德国消费电子产品购物网站:Guter Kauf
2020/09/15 全球购物
儿媳婚宴答谢词
2014/01/14 职场文书
就业推荐表自我评价范文
2015/03/02 职场文书
教师学习十八届五中全会精神心得体会
2016/01/05 职场文书
私人贷款担保书该怎么写呢?
2019/07/02 职场文书
2019年教师节活动策划方案
2019/09/09 职场文书
php随机生成验证码,php随机生成数字,php随机生成数字加字母!
2021/04/01 PHP
springboot拦截器无法注入redisTemplate的解决方法
2021/06/27 Java/Android