这是我参与「第五届青训营 」伴学笔记创作活动的第 4 天
课堂重点
这节课学的是网络相关知识，着重介绍http部分，讲述了http的概念，主要部分，使用场景，http是前端开发的重要一环，涉及到与服务端的连接，这么发送和请求也是ajax的主要部分，下面查阅结合面试题来讲讲相关的一些重点。
http 与 https 的区别
http超文本传输协议加上安全套结协议TSL（ssl）进行对http明文传输的通道加密，使http的连接更安全。 简单来说，HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，要比http协议安全。 主要区别如下： HTTPS和HTTP的区别主要如下：
1、https协议需要到ca申请证书，一般免费证书较少，因而需要一定费用。
2、http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。
3、http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。
4、http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。 最后TSL如何安全加密的，最关键的就是对称加密和非对称加密的合并运用。这里就不做展开
跨域方法
- JSONP：是民间的跨域方法，通过页面调用 JS 脚本是不受同源策略的影响，来对后端发送一个请求函数，后端拿到函数名，动态计算出返回结果并返回给前端执行 JS 脚本，相当于是一种 "动态 JS 脚本"。但他也只支持http且只支持GET请求。
- CORS：是一个 W3C 标准,它允许浏览器向跨源服务器，发出 XMLHttpRequest 请求，从而克服了 ajax 只能同源使用的限制。只要服务器实现了 CORS 接口，就可以跨域通信,前端逻辑很简单，只要正常发起 ajax 请求即可。
- 服务端代理：当你需要有跨域的请求操作时发送请求给后端，让后端帮你代为请求，然后最后将获取的结果发送给你。因为跨域是浏览器端的问题，服务器不存在跨域限制。 最主要的三种已经介绍完毕，后面的是拓展的其他页面通信方式且属于技巧不是特别常用
- location.hash：在 url 中，
http://www.baidu.com#helloworld的 "#helloworld" 就是 location.hash，改变 hash 值不会导致页面刷新，所以可以利用 hash 值并通过制造一个隐藏的ifram来进行数据的传递，不过数据也会直接暴露在url上。 - window.name：window.name（一般在 js 代码里出现）的值不是一个普通的全局变量，而是当前窗口的名字，这里要注意的是每个 iframe 都有包裹它的 window，而这个 window 是 top window 的子窗口，而它自然也有 window.name 的属性，window.name 属性的神奇之处在于 name 值在不同的页面（甚至不同域名）加载后依旧存在（如果没修改则值不会变化），并且可以支持非常长的 name 值（2MB）。因此同样通过iframe可以实现跨域。
- postMessage：创建一个 iframe，使用 iframe 的一个方法 postMessage 可以向另一个域发送消息，然后监听 message，可以获得其文档发来的消息。
- document.domain：对于主域相同而子域不同的情况下，可以通过设置 document.domain 的办法来解决，然后通过创建一个 iframe，去控制 iframe 的 window，从而进行交互，当然这种方法只能解决主域相同而二级域名不同的情况。
个人总结
http还有非常多的知识，这里只讲了一点点，学习计网是前端非常重要的一环，可以去看b站的技术蛋老师的计网系列，讲的比较生动形象，有一定帮助。
