大家好，我是IT修真院成都分院第三期的学员王奎智，一枚正直纯洁善良的WEB前端程序员。
今天给大家分享一下，修真院官网JS任务5相关内容，get与post的区别，以及application json 与form表单的区别。
1.背景介绍
基本概念HTTP：在Web应用中，服务器把网页传给浏览器，实际上就是把网页的HTML代码发送给浏览器，让浏览器显示出来。而浏览器和服务器之间的传输协议是HTTP。
HTTP协议是Hyper Text Transfer Protocol（超文本传输协议）的缩写,是用于从万维网（WWW:World Wide Web ）服务器传输超文本到本地浏览器的传送协议。
工作原理：HTTP协议工作于客户端-服务端,浏览器作为HTTP客户端通过URL(统一资源定位符)向HTTP服务端发送请求,服务器接收到请求后,向客户端发送响应信息。
三大特点：1.无连接 2.灵活快速 3.无状态
消息结构客户端请求消息：由请求行、请求头部、空行、请求数据组成。
2.知识剖析
1.get与post的区别首先我们要知道GET和POST都是HTTP定义的和服务器互交的不同方法。
1.语义上的不同:GET：获取指定URL上的资源，是读操作。
POST：向指定资源“追加/添加”数据。
2.对于“安全”所代表的设定。根据HTTP规范，GET用于信息获取，而且应该是安全的和幂等的。所谓的安全意味着该操作用于获取信息而非修改信息。换句话说，GET 请求一般不应产生副作用。就是说，它仅仅是获取资源信息，就像数据库查询一样，不会修改，增加数据，不会影响资源的状态。这里安全的含义仅仅是指是非修改信息。幂等意味着对同一URL的多个请求应该返回同样的结果。
根据HTTP规范，POST表示可能修改变服务器上的资源的请求。对于传递过程来说，指的是提交的数据不会直接在地址栏看见。
POST的安全性要比GET的安全性高。注意：这里所说的安全性和上面GET提到的“安全”不是同个概念。上面“安全”的含义仅仅是不作数据修改，而这里安全的含义是真正的Security的含义，比如：通过GET提交数据，用户名和密码将明文出现在URL上，因为：
(1)登录页面有可能被浏览器缓存
(2)其他人查看浏览器的历史纪录，那么别人就可以拿到你的账号和密码了，除此之外，使用GET提交数据还可能会造成Cross-site request forgery攻击。
3.请求数据方法不同:GET请求的数据会附在URL之后（就是把数据放置在HTTP协议头中），以?分割URL和传输数据，参数之间以&相连，如：
login.action?name=hyddd&password=idontknow&verify=%E4%BD%A0%E5%A5%BD
如果数据是英文字母/数字，原样发送，如果是空格，转换为+，如果是中文/其他字符，则直接把字符串用BASE64加密，得出如：%E4%BD%A0%E5%A5%BD，其中％XX中的XX为该符号以16进制表示的ASCII。HTTP协议没有对get和post做长度的限制，但是浏览器会对url长度做限制最多1024字节，所以get方法传递数据受限制。
POST把提交的数据则放置在是HTTP包的包体中。如：name1=value1&name2=value2
4.GET是幂等的，POST是非幂等的先介绍下幂等的概念：如果一个操作没有副作用，或者多次操作对资源产生的副作用相同，我们就说这个操作是幂等的。
get方法用户获取资源，没有副作用，所以是幂等的；post用于创建资源，是有副作用的，且副作用不同，所以post不是幂等的。（两次相同的POST请求会在服务器端创建两份资源，它们具有不同的URI）
上图是在W3C上找到的答案.
因为POST请求的协议并没有规定数据必须使用什么编码方式，而数据发送出去，还要服务器解析成功才行。服务器则通常根据请求头里的Content-Type字段来获知消息是以什么方式编码，再以对应方式解析。而有的接口服务器则不能解析某些编码方式的数据。因此需要对Content-Type进行设置。
2.application json 与form表单的区别?application/json 这个 Content-Type 作为响应头大家肯定不陌生。实际上， 现在越来越多的人把它作为请求头，用来告诉服务端消息主体是序列化后的 JSON 字符串。 由于 JSON 规范的流行，除了低版本 IE 之外的各大浏览器都原生支持 JSON.stringify， 服务端语言也都有处理 JSON 的函数，使用 JSON 不会遇上什么麻烦。angular中默认的就是这个格式。
application/x-www-form-urlencoded 这应该是最常见的 POST 提交数据的方式了。浏览器的原生 form 表单，如果不设置 enctype 属性， 那么最终就会以 application/x-www-form-urlencoded 方式提交数据。请求的时候，首先，Content-Type 被指定为 application/x-www-form-urlencoded； 其次，提交的数据按照 key1=val1&key2=val2 的方式进行编码，key 和 val 都进行了 URL 转码。 大部分服务端语言都对这种方式有很好的支持。
3.常见问题GET和POST使用环境
4.解决方案应该符合语义的使用;即获取数据使用GET，增加数据使用POST.
当请求无副作用时（如进行搜索），便可使用GET方法；当请求有副作用时（如添加数据行），则用POST方法。
5.编码实战参考任务代码
6.扩展思考被提问get和post如何唬倒面试官
普通回答:GET在浏览器回退时是无害的，而POST会再次提交请求。
GET产生的URL地址可以被Bookmark，而POST不可以。
GET请求会被浏览器主动cache，而POST不会，除非手动设置。
GET请求只能进行url编码，而POST支持多种编码方式。
GET请求参数会被完整保留在浏览器历史记录里，而POST中的参数不会被保留。
GET请求在URL中传送的参数是有长度限制的，而POST么有。
对参数的数据类型，GET只接受ASCII字符，而POST没有限制。
GET比POST更不安全，因为参数直接暴露在URL上，所以不能用来传递敏感信息。
GET参数通过URL传递，POST放在Request body中。
清新回答：GET和POST是什么？HTTP协议中的两种发送请求的方法。
HTTP是什么？HTTP是基于TCP/IP的关于数据如何在万维网中如何通信的协议。
HTTP的底层是TCP/IP。所以GET和POST的底层也是TCP/IP，也就是说，GET/POST都是TCP链接。GET和POST能做的事情是一样一样的。你要给GET加上request body，给POST带上url参数，技术上是完全行的通的。 GET产生一个TCP数据包；POST产生两个TCP数据包。
对于GET方式的请求，浏览器会把http header和data一并发送出去，服务器响应200（返回数据）； 而对于POST，浏览器先发送header，服务器响应100 continue，浏览器再发送data，服务器响应200 ok（返回数据）。
7.参考文献参考一：理解本真的REST架构风格
参考二：W3C
参考三：99%的人理解错 HTTP 中 GET 与 POST 的区别
8.更多讨论
视频链接
PPT链接
今天的分享就到这里啦，欢迎大家点赞、转发、留言、拍砖~
技能树.IT修真院
“我们相信人人都可以成为一个工程师，现在开始，找个师兄，带你入门，掌控自己学习的节奏，学习的路上不再迷茫”。
这里是技能树.IT修真院，成千上万的师兄在这里找到了自己的学习路线，学习透明化，成长可见化，师兄1对1免费指导。快来与我一起学习吧 ！