后端接收不到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中的常见排序算法
Mar 27 Javascript
JavaScript 权威指南(第四版) 读书笔记
Aug 11 Javascript
JavaScript 图片预览效果 推荐
Dec 22 Javascript
JavaScript实现找出字符串中第一个不重复的字符
Sep 03 Javascript
JQuery实现鼠标移动图片显示描述层的方法
Jun 25 Javascript
jQuery实现带延迟的二级tab切换下拉列表效果
Sep 01 Javascript
Angular 应用技巧总结
Sep 14 Javascript
js实现的光标位置工具函数示例
Oct 03 Javascript
基于jquery实现二级联动效果
Mar 30 jQuery
React通过父组件传递类名给子组件的实现方法
Nov 13 Javascript
微信小程序实现收藏与取消收藏切换图片功能
Aug 03 Javascript
layui异步加载table表中某一列数据的例子
Sep 16 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
15个小时----从修改程序到自己些程序
2006/10/09 PHP
用PHP和ACCESS写聊天室(四)
2006/10/09 PHP
php面向对象全攻略 (三)特殊的引用“$this”的使用
2009/09/30 PHP
PHP学习笔记之数组篇
2011/06/28 PHP
php程序的国际化实现方法(利用gettext)
2011/08/14 PHP
php 使用GD库为页面增加水印示例代码
2014/03/24 PHP
PHP环境搭建(php+Apache+mysql)
2016/11/14 PHP
Yii框架中用response保存cookie,用request读取cookie的原理解析
2019/09/04 PHP
window.onload 加载完毕的问题及解决方案(下)
2009/07/09 Javascript
javascript 通用简单的table选项卡实现
2010/05/07 Javascript
深入理解JavaScript系列(16) 闭包(Closures)
2012/04/12 Javascript
js 输出内容到新窗口具体实现代码
2013/05/31 Javascript
JS获得URL超链接的参数值实例代码
2013/06/21 Javascript
JavaScript的事件代理和委托实例分析
2015/03/25 Javascript
jquery ajax分页插件的简单实现
2016/01/27 Javascript
jQuery添加和删除输入文本框标签代码
2016/05/20 Javascript
jquery checkbox的相关操作总结
2016/10/17 Javascript
使用BootStrap实现标签切换原理解析
2017/03/14 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
2017/04/01 Javascript
Ajax验证用户名或昵称是否已被注册
2017/04/05 Javascript
浅谈 Vue v-model指令的实现原理
2017/06/08 Javascript
基于easyui checkbox 的一些操作处理方法
2017/07/10 Javascript
微信小程序实现表单校验功能
2020/03/30 Javascript
javascript中的replace函数(带注释demo)
2018/01/07 Javascript
基于Node.js搭建hexo博客过程详解
2019/06/25 Javascript
JS removeAttribute()方法实现删除元素的某个属性
2021/01/11 Javascript
Python中的yield浅析
2014/06/16 Python
Python切片用法实例教程
2014/09/08 Python
Python循环语句之break与continue的用法
2015/10/14 Python
用Python+OpenCV对比图像质量的几种方法
2019/07/15 Python
python Opencv计算图像相似度过程解析
2019/12/03 Python
英国鲜花递送:Blossoming Gifts
2020/07/10 全球购物
中专毕业生自荐信范文
2013/11/28 职场文书
文秘人员工作职责
2014/01/31 职场文书
扩展多台相同的Web服务器
2021/04/01 Servers
仅仅使用 HTML/CSS 实现各类进度条的方式汇总
2021/11/11 HTML / CSS