网页开发中，向服务端提交数据是一个基本功能，工作中会大量用 xhr/fetch 的 api 或者 axios 这种封装了一层的库来做。
可能大家都写过很多 http/https 相关的代码，但是又没有梳理下它们有哪几种呢?
其实通过 http/https 向服务端传递数据的方式，基本可以分为 5 种：url param、query、form-urlencoded、form-data、json。
url param
Restful 的规范允许把参数写在 url 中，比如：
- http://guang.zxg/person/1111
这里的 1111 就是路径中的参数(url param)，服务端框架或者单页应用的路由都支持从 url 中取出参数。
query
通过 url 中 ?后面的用 & 分隔的字符串传递数据。比如：
- http://guang.zxg/person?name=guang&age=20
这里的 name 和 age 就是 query 传递的数据。
其中非英文的字符和一些特殊字符要经过编码，可以使用 encodeURLComponent 的 api，或者使用封装了一层的 qeury-string 库来处理。
- const queryString = require('query-string');
- queryString.stringify({
- name: '光',
- age: 20
- });
- //?name=%E5%85%89&age=20
通过 URL 传递数据的方式就这 2种，后面 3 种是通过 body 传递数据的方式。
form-urlencoded
直接用 form 表单提交数据就是这种，它和 query 字符串的方式的区别只是放在了 body 里，然后指定下 content-type 是 application/x-www-form-urlencoded。
因为也是 query 字符串，所以也要用 encodeURIComponent 的 api 或者 query-string 库处理下。
其实这种设计也很容易理解，get 是把数据拼成 query 字符串放在 url 后面，于是设计表单的 post 提交方式的时候就直接用相同的方式把数据放在了 body 里。
通过 & 分隔的 form-urlencoded 的方式需要对内容做 url encode，如果传递大量的数据，比如上传文件的时候就不是很合适了，因为文件 encode 一遍的话太慢了，这时候就可以用 form-data。
form-data
form data 不再是通过 & 分隔数据，而是用 --------- + 一串数字做为分隔符。因为不是 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 数据基本用的是这种。
这三种是通过 body 传递数据的方式。
总结
网页开发中向服务端传送数据是一个基本功能，常用的方式就 url param、query、form urlencoded、form data、json 这 5 种。
前 2 种是通过 url 传递数据的方式(需要对数据做 url encode)，后 3 种是通过 body 传递数据。
form urlencoded 只是把 query 放在了 body 里，同样需要对数据做 url encoded，所以处理文件就不合适了。(content type 要指定为 application/x-www-form-urlencoded)
form data 是通过 boundary 分隔内容，不需要做 url encode，所以用来传文件很合适。但是如果不是传文件就没必要用了，因为多了一些 boundary 字符串比较占空间。(content type 要指定为 multipart/form-data)
json 是现在最常用的传递数据的方式，既不需要 url encoded，又不需要加没必要的 boundary。(指定 content type 为 application/json)。
当然，也可以指定别的 content type，比如 application/xml、text/plain 等，但一般不会用。
99% 情况下，我们都是通过这 5 种 http/https 的提交数据的方式和服务端交互的。
