解决angular跨域问题
- 后台添加可访问的地址来源(*代表全部)
response.setHeader("Access-Control-Allow-Origin", "*");
删除默认的请求头信息,并添加x-www-form-urlencoded的请求头类型(便于服务器端解析)
angular 和 jQuery ajax传值的区别
angualr默认以json的格式传递数据{‘a’:1,’b’:3,’n’:’ss’},而jquery会对数据进行处理类似a=1&m=3&c=9这样。所以后台按照原来的方法会解析不到数据
基于此,为了实现和jq一样的效果,需要在post之前对数据进行序列化。完整的代码如下:
// 删除默认的请求头
delete $httpProvider.defaults.headers.common["X-Requested-With"];
// 添加请求头类型 x-www-form-urlencoded
$httpProvider.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded;charset=utf-8';
/**
* 把json对象转为x-www-form-urlencoded 序列化的形式.
* @参数类型 {Object} obj
* @返回值 {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;
};
// 重写 $http 服务的默认请求
$httpProvider.defaults.transformRequest = [function(data) {
return angular.isObject(data) && String(data) !== '[object File]' ? param(data) : data;
}];
将以上至于Angular应用的默认设置中,则就可以用默认的angular方式实现jquery一样的ajax请求。