http請求頭中的Content-Type屬性在angular 和 node中的用法

post請求的請求體有以下兩種格式:

1. 字符串: 'name=code_bunny&age=12'

    這種格式的請求體,需要配置請求頭 'Content-Type':'application/x-www-form-urlencoded'

2. json: {name:'code_bunny',age:12}

    這種格式的請求體,需要配置請求頭 'Content-Type':'application/json;charset=UTF-8'

注意: 請求體格式和請求頭的Content-Type類型必須保持一致,如果1的格式,設置Content-Type是application/json,或者2的格式,設置Content-Type是application/x-www-form-urlencoded,后台接收到的請求提都會是空的.

 

在jquery的ajax中,默認都是第一種,雖然在寫請求體參數的時候,寫的是json格式,但是jquery內部已經對json做了轉換,最后還是以字符串的格式進行發送的.

所以,jquery的ajax,采用的是第一種方式提交請求體

 

但是在angular的$http中,默認是第二種,所以使用$http(config)提交請求體,config中的data項,必須是json格式的值.

如果需要提交的請求體是第一種格式,那么就需要配置$http(config)中的headers中的Content-Type值為'application/x-www-form-urlencoded'

 

再來說說node后台對這兩種請求格式的處理:

1. 首先是最新express版本4.7.2:

    4.7.2版本的express沒有了bodyParser方法,需要另外安裝body-parser模板:

    於是另外安裝了body-parser模板1.5.2版本

    使用代碼如下:

    

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());

 

使用bodyParser.urlencoded(),使node后台支持了第一種請求體.

使用bodyParser.json(),使node后台支持了第二種請求體.

后定義的不會覆蓋先定義的... 也就是說,這段代碼同時支持了這兩種請求體. 另外,雖然請求體的格式不同,但是經過node解析后,他們最終得到的都是json格式的對象.

(參數的作用目前不太清楚,看不懂英文...)

demo地址: https://github.com/OOP-Code-Bunny/angular/tree/master/OREILLY/18.4%20%24http(2) 

 

2. 舊版的express(舉例3.4.7)

使用 app.use(express.bodyParser())后,直接支持了這兩種格式.

demo地址: https://github.com/OOP-Code-Bunny/angular/tree/master/OREILLY/18.2%20%24http.post