http五种传输数据模式

url param

我们可以把参数写在url中,比如:

1
http://localhost:3000/person/1111

这里的 1111 就是路径中的参数(url param),服务端框架或者单页应用的路由都支持从 url 中取出参数

query

通过 url 中 ?后面的用 & 分隔的字符串传递数据。比如:

1
http://guang.zxg/person?name=guang&age=20

这里的 name 和 age 就是 query 传递的数据。

其中非英文的字符和一些特殊字符要经过编码,可以使用 encodeURIComponent 的 api 来编码:

1
const query = "?name=" + encodeURIComponent('程') + "&age=" + encodeURIComponent(20) // ?name=%E5%85%89&age=20

form-urlencoded

直接用 form 表单提交数据就是这种,它和 query 字符串的方式的区别只是放在了 body 里,然后指定下 content-type 是 application/x-www-form-urlencoded

因为内容也是 query 字符串,所以也要用 encodeURIComponent 的 api处理下。

这种格式也很容易理解,get 是把数据拼成 query 字符串放在 url 后面,于是表单的 post 提交方式的时候就直接用相同的方式把数据放在了 body 里

通过 & 分隔的 form-urlencoded 的方式需要对内容做 url encode,如果传递大量的数据,比如上传文件的时候就不是很合适了,因为文件 encode 一遍的话太慢了,这时候就可以用 form-data

form-data

form data不再是通过&分隔数据,而是用 ——— + 一串数字做为 boundary 分隔符。因为不是 url 的方式了,自然也不用再做 url encode

form-data 需要指定 content type 为 multipart/form-data,然后指定 boundary 也就是分割线。

body 里面就是用 boundary 分隔符分割的内容。

很明显,这种方式适合传输文件,而且可以传输多个文件。

但是毕竟多了一些只是用来分隔的 boundary,所以请求体会增大

json

form-urlencoded 需要对内容做 url encode,而 form data 则需要加很长的 boundary,两种方式都有一些缺点。如果只是传输 json 数据的话,不需要用这两种。

可以直接指定content type 为 application/json 就行

我们平时传输 json 数据基本用的是这种

Comments