angularjs向后台传参,后台收不到数据
angularjs中封装了一个$http服务,用来请求远程资源
参见:HTTP API
其中封装过的$http.post和$http.get使用起来比较方便
后台是php,用$_POST['name']接收,一直接收不到代码,甚是奇怪
查阅文章所知,原来angular的$http服务和jquery的不一样
原文:
By default, jQuery transmits data using Content-Type: x-www-form-urlencoded and the familiar foo=bar&baz=moe serialization. AngularJS, however, transmits data using Content-Type: application/json and { "foo": "bar", "baz": "moe" } JSON serialization, which unfortunately some Web server languages—notably PHP—do not unserialize natively.
大意:
jquery传输数据用的Content-Type是:x-www-form-urlencoded,类似url传参,而angularJS的Content-Type是 application/json,是使用JSON序列化传参,而PHP正好默认不会接收后者。
根据老外的提议,改服务端代码当然也可以,但是还是$_POST用的习惯,所以就将angular的传参方式改为jquery的方式,下面是代码,放在主module里就可以了
// Your app's root module...
angular.module('MyModule', [], function($httpProvider) {
// Use x-www-form-urlencoded Content-Type
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8'; /**
* The workhorse; converts an object to x-www-form-urlencoded serialization.
* @param {Object} obj
* @return {String}
*/
var param = function(obj) {
var query = '', name, value, fullSubName, subName, subValue, innerObj, i; for(name in obj) {
value = obj[name]; if(value instanceof Array) {
for(i=0; i<value.length; ++i) {
subValue = value[i];
fullSubName = name + '[' + i + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value instanceof Object) {
for(subName in value) {
subValue = value[subName];
fullSubName = name + '[' + subName + ']';
innerObj = {};
innerObj[fullSubName] = subValue;
query += param(innerObj) + '&';
}
}
else if(value !== undefined && value !== null)
query += encodeURIComponent(name) + '=' + encodeURIComponent(value) + '&';
} return query.length ? query.substr(0, query.length - 1) : query;
}; // Override $http service's default transformRequest
$httpProvider.defaults.transformRequest = [function(data) {
return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
}];
});
Done!
原文链接:Link
angularjs向后台传参,后台收不到数据的更多相关文章
- axios post传参后台无法接收问题
起因是在angular项目中使用axios发送post请求,向后台传参后台一直无法接收,网上查了有说是请求头设置不对,需要把Content-Type:application/x-www-form-ur ...
- angular使用post、get向后台传参的问题
一.问题的来源 我们都知道向后台传参可以使用get.put,其形式就类似于name=jyy&id=001.但是在ng中我却发现使用$http post进行异步传输的过程中后台是接收不到数据的. ...
- Web jsp开发学习——前端后台传参方法
一.前端传后台: 1.1表单数据的传递 前端的表单里定义名字name 后台通过名字获取输入的值 1.2页面点击了哪个按钮传递 登录注销的另一种方式 点击登录的地方设置参数 ...
- AngularJS中页面传参方法
1.基于ui-router的页面跳转传参 (1) 用ui-router定义路由,比如有两个页面,一个页面(producers.html)放置了多个producers,点击其中一个目标,页面跳转到对应的 ...
- angularJS 中的传参
今天总结一下 angularJS 传参的 3种方式:(配合 ui-router) 现在有两个页面,page1.html 和 page2.html, 现由 page1.html 向 page2.html ...
- angularjs $state.go 传参
在目标页面规定接受的参数:$stateProvider.state('page2', {params: {'data': null}}) 传参:$state.go('page2', {data: 'a ...
- Vue中 axios+QS 插件往后台传参
之前用Vue+element写了一个后台管理系统,在登录时使用axios请求数据传参时无法正常的获取数据.发现原因是传递参数要将参数序列化.这里使用了qs插件: 简单来说,qs 是一个增加了一些安全性 ...
- IE浏览器GET传参后台乱码
ie里面 get传递的字符串 为 gb2312 ,后台用的是utf-8类型 所以用 POST传递字符串到后端 否则进行js参数转码 encodeURI(""); 后端解码
- angular的post传参后台php无法接收
很多时候我们需要用ajax提交post数据,angularjs与jq类似,也有封装好的post. 但是jQuery的post明显比angularjs的要简单一些,人性化一些. 两者看起来没什么区别,用 ...
随机推荐
- mysql apach php
一.MySql MySQL安装文件分为两种,一种是msi格式的,一种是zip格式的.如果是msi格式的可以直接点击安装,按照它给出的安装提示进行安装(相信大家的英文可以看懂英文提示),一般MySQL将 ...
- flask+sqlite3+echarts3 系统监控
总的而言,分三部分: 1.监控器(monitor.py): 每秒获取系统的四个cpu的使用率,存入数据库. 2.路由器(app.py): 响应页面的ajax,获取最新的一条或多条数据. 3.页面(in ...
- 为什么Java不支持多继承?
没想过面试的时候,会遇到语言设计上的问题.现场答得并不好因为一直没思考过,经过了点搜索,渐渐有点思路. 1. 避免“钻石型”多继承问题:有两个类B和C继承自A.假设B和C都继承了A的方法并且进行了覆盖 ...
- OrchardNoCMS vNext如何在VS2015下调试
由于VS2015还没有出来正式版,ASP.NET 5也是没有出来正式版.所以在你下载了OrchardNoCMS vNext的代码后,需要配置一些东西,才能启动项目,开始调试. 需要注意以下几点: 1. ...
- 2016-2017-2 《Java程序设计》预备作业1 总结
2016-2017-2 <Java程序设计>预备作业1 总结 预备作业01:你期望的师生关系是什么见https://edu.cnblogs.com/campus/besti/2016-20 ...
- spring-boot-starter-amqp踩坑记
踩坑记录 近日在用spring boot架构一个微服务框架,服务发现与治理.发布REST接口各种轻松惬意.但是服务当设计MQ入口时,就发现遇到无数地雷,现在整理成下文,供各路大侠围观与嘲笑. 版本 当 ...
- CloudSim介绍和使用
本文主要介绍一下我在使用CloudSim时翻译.整理和理解的一些信息,以及我的使用经验,希望能对有需要的朋友们有所帮助~1.我翻译和理解的一些信息: 2009年4月8日,澳大利亚墨尔本大学的网格 ...
- C#-WinForm-用户控件如何获取父级窗体
1:在父窗体中定义需要在用户控件中用到的控件属性,比如,我要修改一个textbox控件.页面定义这个textbox的属性是:protected System.Web.UI.WebControls.Te ...
- debian/deepin 15.3安装jdk 1.7 (或jdk 7),配置默认环境
一.前言 Deepin 15.3是基于Debian开发的,安装jdk 1.7有所不同,默认是openjdk-8-jdk,而我们玩一些编译需要的是jdk 7. 所以本文给出安装JDK 7的教程. 二.安 ...
- 关于IE8兼容svg图片问题解决
参考 http://www.zhangxinxu.com/wordpress/2013/09/svg-fallbacks/ 对博主表示感谢,详述请参考上述链接 直接把代码复制过来了,备份记录下 < ...