让AngularJS的$http服务像jQuery.ajax()一样工作
$http的post.请求默认的content-Type=application/json.提交的是json对象的字符串化数据,.后端无法从post中获取,.跨域请求是复杂请求,会发送OPTIONS的验证请求,成功后才真正发起post请求
jQuery.post.使用的是content-Type=application/x-www-form-urlencoded-.提交的是formdata,.后端可以从post中获取,.简单跨域请求,直接发送
解决办法有两个:
1.是后端支持复杂的跨域请求那么后端就需要设置如下的信息
defoptions(self):
self.set_header(''Access-Control-Allow-Methods'',''POST,GET,OPTIONS'')
self.set_header(''Access-Control-Max-Age'',86400)
self.set_header(''Access-Control-Allow-Headers'',''Origin,X-Requested-With,Content-Type,Accept'')
self.write('''')
后端post中拿不到数据,我们需要自己处理request的body,看看python和php的处理方式:python
#这种写法支持多种content-Type提交
defPOST(self):
ifself.request.headers[''Content-Type''].find(''application/json'')>=0:
body=self.request.body
ifbody:
returnjson.loads(body.decode())
else:
return{}
else:
paras={}
fork,vinself.request.body_arguments.items():
paras[k]=v[-1].decode()
returnparas
php
$params=json_decode(file_get_contents(''php://input''));
?>
2.配置AngularJS配置$http服务的默认content-Type=application/x-www-form-urlencoded,如果是指配置这个的话,虽然提交的content-Type改了,但是提交的数据依然是个json字符串,不是我们想要的formdata形式的键值对,需要实现param方法.Talkischeap,ishowyouthecode.
angular.module(''MyModule'',[www.visa158.com],function($httpProvider){
//Usex-www-form-urlencodedContent-Type
$httpProvider.defaults.headers.post[''Content-Type'']=''application/x-www-form-urlencoded;charset=utf-8'';
/
Theworkhorse;convertsanobjecttox-www-form-urlencodedserialization.
@param{Object}obj
@return{String}
/
varparam=function(obj){
varquery='''',
name,value,fullSubName,subName,subValue,innerObj,i;
for(nameinobj){
value=obj[name];
if(valueinstanceofArray){
for(i=0;i subValue=value[i];
fullSubName=name+''[''+i+'']'';
innerObj={www.hunanwang.net};
innerObj[fullSubName]=subValue;
query+=param(innerObj)+''&'';
}
}elseif(valueinstanceofObject){
for(subNameinvalue){
subValue=value[subName];
fullSubName=name+''[''+subName+'']'';
innerObj={};
innerObj[fullSubName]=subValue;
query+=param(innerObj)+''&'';
}
}elseif(value!==undefined&&value!==null)
query+=encodeURIComponent(name)+''=''+encodeURIComponent(value)+''&'';
}
returnquery.length?query.substr(0,query.length-1):query;
};
//一个function数组,负责将请求的body,也就是postdata,转换成想要的形式
//Override$httpservice''sdefaulttransformRequest
$httpProvider.defaults.transformRequest=[function(data){
returnangular.isObject(data)&&String(data)!==''[objectFile]''?param(data):data;
}];
});
配合一点$resource的API参考,这个代码就好懂了:
Note:上述param方法定义的地方不要使用jQuery.param方法,因为jQuery.param方法会将要处理的对象上的function全执行一边,把返回的值当做参数的值,这是我们不期望的,我们写的这个param方法也是为了解决上面说的content-Type=x-www-form-urlencoded,但是提交的数据依然是json串的问题。
|
|