標籤：style blog http color 使用 os io 資料
本篇主要講解$http(config)的config中的tranformRequest項和transformResponse項
1. transformRequest:
$http({ transformRequest: function(data){ //對前台發送的data進行處理 return data }})
這個在測試的時候遇到了很大的問題.只要經過transformRequest函數處理,哪怕是不做任何處理,node後台都會報錯,需要嘗試使用php
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-urlencodedapp.use(bodyParser.urlencoded({ extended: false }));// parse application/jsonapp.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)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
