欢迎访问 生活随笔！
TAG聚合

生活随笔

当前位置： 首页 > 编程资源 > 编程问答 >内容正文

编程问答

angular学习笔记(二十五)-$http(3)-转换请求和响应格式

发布时间：2025/4/16 编程问答 43 豆豆
生活随笔 收集整理的这篇文章主要介绍了 angular学习笔记(二十五)-$http(3)-转换请求和响应格式 小编觉得挺不错的,现在分享给大家,帮大家做个参考.

本篇主要讲解$http(config)的config中的tranformRequest项和transformResponse项

1. transformRequest:

$http({transformRequest: function(data){//对前台发送的data进行处理 return data}})

这个在测试的时候遇到了很大的问题.只要经过transformRequest函数处理,哪怕是不做任何处理,node后台都会报错,php后台也报同样的错,so,angular的这部分是有bug的.

 

 

2. transformResponse:

$http({transformResponse: function(data){//对后台返回的data进行处理 return data}})

 

 

demo:

html:

<!DOCTYPE html> <html ng-app = 'HttpGet'> <head><title>18.4 $http(2)</title><meta charset="utf-8"><script src="angular.js"></script><script src="script.js"></script> </head> <body> <div ng-controller = "dataController"><span>{{data}}</span> </div> <script>
//自己写了一个把字符串转换成json格式对象的方法
var $ = {};$.serialize = function(data){var arr1 = data.split('&');var jsonObj = {};for(var i=0; i<arr1.length; i++) {var arr2 = arr1[i].split('=');jsonObj[arr2[0]] = arr2[1];}return jsonObj;}; </script> </body> </html>

js:

var jsonData = {name:"code_bunny"};var httpGet = angular.module('HttpGet',[]); httpGet.factory('getData',function($http,$q){return function(){var defer = $q.defer();$http({method:'post',url:'/api/user',data: jsonData,headers: {'Authorization':'code_bunny'},// transformRequest:function(data){// console.log(data === jsonData);// return data// },

 //得到的数据其实是'name=code_bunny&age=3'transformResponse:function(data){
//通过$.serialize方法转换后,得到json格式的对象,然后获取name属性的值return $.serialize(data)['name']}}).success(function(data,status,headers,config){defer.resolve(data);}).error(function(data,status,headers,config){defer.reject(data)});return defer.promise} }); httpGet.controller('dataController',function($scope,getData){$scope.data = getData() });

除了在$http(config)里配置,还可以通过$httpProvider里进行全局配置:

httpGet.config(function($httpProvider){$httpProvider.defaults.transformResponse=function(data){return $.serialize(data)['name']} });

 

nodejs: (这里用的是最新版的express,需要另外安装加载body-parser模块,具体使用参考:https://github.com/expressjs/body-parser)

var express = require('express'); var bodyParser = require('body-parser'); var app = express();// parse application/x-www-form-urlencoded app.use(bodyParser.urlencoded({ extended: false }));// parse application/json app.use(bodyParser.json());app.use(express.static(__dirname+''));var data = "name=code_bunny&age=3";app.post('/api/user',function(req,res){console.log(req.body);
 res.send(data) }); app.listen(3000);

完整代码路径: https://github.com/OOP-Code-Bunny/angular/tree/master/OREILLY/18.4%20%24http(2)

总结

以上是生活随笔为你收集整理的angular学习笔记(二十五)-$http(3)-转换请求和响应格式的全部内容，希望文章能够帮你解决所遇到的问题。

如果觉得生活随笔网站内容还不错，欢迎将生活随笔推荐给好友。