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向后台传参,后台收不到数据的更多相关文章

  1. axios post传参后台无法接收问题

    起因是在angular项目中使用axios发送post请求,向后台传参后台一直无法接收,网上查了有说是请求头设置不对,需要把Content-Type:application/x-www-form-ur ...

  2. angular使用post、get向后台传参的问题

    一.问题的来源 我们都知道向后台传参可以使用get.put,其形式就类似于name=jyy&id=001.但是在ng中我却发现使用$http post进行异步传输的过程中后台是接收不到数据的. ...

  3. Web jsp开发学习——前端后台传参方法

    一.前端传后台: 1.1表单数据的传递   前端的表单里定义名字name   后台通过名字获取输入的值         1.2页面点击了哪个按钮传递 登录注销的另一种方式   点击登录的地方设置参数 ...

  4. AngularJS中页面传参方法

    1.基于ui-router的页面跳转传参 (1) 用ui-router定义路由,比如有两个页面,一个页面(producers.html)放置了多个producers,点击其中一个目标,页面跳转到对应的 ...

  5. angularJS 中的传参

    今天总结一下 angularJS 传参的 3种方式:(配合 ui-router) 现在有两个页面,page1.html 和 page2.html, 现由 page1.html 向 page2.html ...

  6. angularjs $state.go 传参

    在目标页面规定接受的参数:$stateProvider.state('page2', {params: {'data': null}}) 传参:$state.go('page2', {data: 'a ...

  7. Vue中 axios+QS 插件往后台传参

    之前用Vue+element写了一个后台管理系统,在登录时使用axios请求数据传参时无法正常的获取数据.发现原因是传递参数要将参数序列化.这里使用了qs插件: 简单来说,qs 是一个增加了一些安全性 ...

  8. IE浏览器GET传参后台乱码

    ie里面 get传递的字符串 为 gb2312  ,后台用的是utf-8类型  所以用 POST传递字符串到后端 否则进行js参数转码 encodeURI(""); 后端解码

  9. angular的post传参后台php无法接收

    很多时候我们需要用ajax提交post数据,angularjs与jq类似,也有封装好的post. 但是jQuery的post明显比angularjs的要简单一些,人性化一些. 两者看起来没什么区别,用 ...

随机推荐

  1. .net 账号异地登录

    第一步:给用户名一个对应的字段记录登陆状态,比如 online , 登陆后就为1, 同时还应增加记录用户活动时间,比如actionTime, 在基类(比如初始化Conn的类), 加上 update [ ...

  2. bench.sh 跑分测速

    #!/bin/bash #==============================================================# # Description: bench te ...

  3. vi command

    进入vi的命令 vi filename :打开或新建文件,并将光标置于第一行首 vi +n filename :打开文件,并将光标置于第n行首 vi + filename :打开文件,并将光标置于最后 ...

  4. java图形处理-Java Graphics2D

    java.awt 类 Graphics2D java.lang.Object 继承者 java.awt.Graphics 继承者 java.awt.Graphics2D public abstract ...

  5. git-添加公钥

    安装完git后,打开开git bush 输入以下命令 git config --global user.name "Your Name" git config --global u ...

  6. 【USACO 2.3】Zero Sum(dfs)

    按字典序输出所有在123..n之间插入'+','-',' '结果为0的表达式.. http://train.usaco.org/usacoprob2?a=jUh88pMwCSQ&S=zeros ...

  7. icon图标

     http://images2015.cnblogs.com/blog/575577/201609/575577-20160901194344636-1596119396.png  http://im ...

  8. firefox屏蔽广告真是太好了

    在ubuntu上使用firefox有些页面的广告很多,很讨厌. 突然想到是否可以把这些广告屏蔽掉.在网上搜索了一下,发现有个 adblock plus插件,安装上发现广告没有了,很干净. 开源软件就是 ...

  9. java 集合 Connection 栈 队列 及一些常用

    集合家族图 ---|Collection: 单列集合 ---|List: 有存储顺序 , 可重复 ---|ArrayList: 数组实现 , 查找快 , 增删慢 ---|LinkedList: 链表实 ...

  10. elk系列5之syslog的模块使用

    preface rsyslog是CentOs系统自带的的一个日志工具,那么我们就配置logstash来接受rsyslog的日志. logstash的syslog模块 linux-node2上操作 lo ...