网络方面

[lyre2468]

网络结构

TCP/IP五层模型协议

应用层
传输层
网络层
数据链路层
物理层

为什么要从多个域名加载资源

• 并行加载（浏览器对同一个域有6个并行下载的限制）
• cdn(js/css)
• 减少请求头部（节省带宽），如更少的cookie

描述输入url道展示页面，所发生的事

• 浏览器网络线程，发起http请求

  • DNS 考虑负载均衡
  • TCP握手
  • 收据传输
  • 缓存 浏览器缓存，304
  • http2 （多路复用、一个tcp/ip请求可以请求多个资源）
  • https

• 页面解析

  • 解析html（字节->transform->node），渲染dom树
  • 解析css，生成css树
  • 合并dom树和css树，生成render数
  • 布局render树（Layout/reflow），负责各元素尺寸、位置的计算
  • 绘制render树（paint），绘制页面像素信息
  • 浏览器会将各层的信息发送给GPU，GPU会将各层合成（composite），显示在屏幕上

• js解析

  js的解释，预处理，执行上下文，VO，作用域链，this，回收机制(标记清除,引用计数)

TCP和UDP

http常用method. 哪些是幂等？

• GET， 用于获取数据
• POST， 将实体提交到指定的资源，通常导致状态或服务器上的副作用的更改
• PUT 用请求有效载荷替换目标资源的所有当前表示
• HEAD 获得报文首部，与GET方法类似，只是不返回报文主体，一般用于验证URI是否有效
• DELETE 删除指定的资源
• OPTIONS 用于描述目标资源的通信选项 预请求
• PATCH 对资源应用部分修改

幂等：无论调用多少次都不会有不同结果， GET PUT DELETE方式是幂等。

http中get和post的区别

	GET	POST
后退按钮/刷新	无害	数据会被重新提交（浏览器应该告知用户数据会被重新提交）。
书签	可收藏为书签	不可收藏为书签
缓存	能被缓存	不能缓存
编码类型	application/x-www-form-urlencoded	application/x-www-form-urlencoded 或 multipart/form-data。为二进制数据使用多重编码。
历史	参数保留在浏览器历史中。	参数不会保存在浏览器历史中。
对数据长度的限制	是的。当发送数据时，GET 方法向 URL 添加数据；URL 的长度是受限制的（URL 的最大长度是 2048 个字符）。	无限制。
对数据类型的限制	只允许 ASCII 字符。	没有限制。也允许二进制数据。
安全性	与 POST 相比，GET 的安全性较差，因为所发送的数据是 URL 的一部分。在发送密码或其他敏感信息时绝不要使用 GET ！	POST 比 GET 更安全，因为参数不会被保存在浏览器历史或 web 服务器日志中。
可见性	数据在 URL 中对所有人都是可见的。	数据不会显示在 URL 中。
幂等性	有	无

http 常见header

http2 和http 区别

影响因素：带宽和延迟

http 1.1（1999年）相比http1.0（1996年）的优点

• 缓存处理，HTTP1.1则引入了更多的缓存控制策略例如Entity tag，If-Unmodified-Since, If-Match, If-None-Match等更多可供选择的缓存头来控制缓存策略
• 带宽优化及网络连接的使用，HTTP1.1则在请求头引入了range头域，它允许只请求资源的某个部分，即返回码是206（Partial Content），这样就方便了开发者自由的选择以便于充分利用带宽和连接
• 错误通知的管理，HTTP1.1中新增了24个错误状态响应码
• Host头处理
• 长连接， Connection： keep-alive

http2 的优点

• 多路复用，即连接共享，即每一个request都是是用作连接共享机制的。http1 浏览器客户端在同一时间，针对同一域名下的请求有一定数量限制，超过限制数目的请求会被阻塞。
• 新的二进制格式
• header压缩
• 服务端推送

对比网站 https://http2.akamai.com/demo

http 和 https

.http的默认端口号是80，https的默认端口号是443

HTTPS􏰤采用共享密钥加密和公开密钥加密两者并用的混􏲋合加密机制，非对称加密-验证身份，对称加密（密钥是随机的）-加密解密传送的数据

数字认证机构（第三方）

youngwind/blog#108

http状态返回码

https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Status

ajax

跨域方案有哪些

• JSONP原理 -> response callback原理 -> JOSNP 带cookie??? crossorigin="use-credentials"
• CORS 跨域资源共享, Access-Control-Request-Method. Access-Control-Request-Headers Access-Control-Allow-Origin. Access-Control-Max-Age
• nginx
• iframe

cookie跨域

cors 服务端返回头设置with-credentials =true, access-control-allow-origin: 指定域名

cdn托管的机制

CDN网络则是在用户和服务器之间增加Cache层，将用户的访问请求引导到Cache节点而不是服务器源站点。

内容分发网络(CDN)是一个经策略性部署的整体系统，包括分布式存储、负载均衡、网络请求的重定向和内容管理4个要件，而内容管理和全局的网络流量管理(Traffic Management)是CDN的核心所在。

用户访问cdn资源如下图

每个CDN节点由两部分组成：负载均衡设备和高速缓存服务器。负载均衡设备负责每个节点中各个Cache的负载均衡，保证节点的工作效率；同时，负载均衡设备还负责收集节点与周围环境的信息，保持与全局负载DNS的通信，实现整个系统的负载均衡。高速缓存服务器（Cache）负责存储客户网站的大量信息，就像一个靠近用户的网站服务器一样响应本地用户的访问请求。

缓存

• 浏览器缓存，
• 协商缓存，304
• cdn，缓存服务器, cdn的缓存机制见https://zhuanlan.zhihu.com/p/29468624