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