重学前端之网络安全篇（持续更新）

叁牛
418 阅读5分钟

写在前面

计划一个月之内总结一波精炼的前端网络知识点，将从以下几点展开： 基础，网络，http,tcp, 7层网络模型，webSocket。

正文

基础

  • a标签注意事项
<a href="www.baidu.com" target="_blank" rel="noreferrer noopener">asdf</a>

之所以加上noreferrer noopener，是因为如果不加的话我们从A页面跳转到B页面，我们在B页面可以通过window.reopener获取到A页面的部分控制权（即使B页面是跨域的，也可以获得到）
ps: document.referrer可以获得页面的来源
同时我们可以通过eslint进行提示 : jsx-no-target-blank

301、302和307的区别

用户体验、谷歌蜘蛛体验、权重传递

  • 301永久重定向
1.http网站跳转到https网站

2.二级域名跳转到主域名，http://www.abc.com跳转到http://abc.com

3.404页面失效跳转到新的页面

4.老的域名跳转到新的域名

第四种情况老的域名废弃了，但是老域名的权重高啊，不要浪费了权重，记住如果一个老域名到期后半年内不进行续费或者跳转，这个域名的权重会被重新刷到0，所以一定要珍惜你的老域名。
所以301跳转，对用户体验和谷歌蜘蛛都是比较友好的，权重发生了传递，当然对SEO也是有好处的。
  • 302临时重定向，HTTP1.0的状态码，HTTP1.1也有保留。
原则上使用302跳转是在告诉谷歌蜘蛛网站页面只是暂时跳转，不要传递权重，也不要收录，但谷歌webmaster的负责人John Muller对302跳转不传递权重否认过，如果你302跳转的时间过长，例如超过了半年，那么谷歌蜘蛛就会判定为什么使用302跳转了这么久，是不是站长本来想用301结果用了302.


Rel=canonial标签是针对谷歌的爬虫而写的标签，这个标签是用来告诉蜘蛛同一个域名下的url按照canonial标签的规范来爬取，这种一般出现在页面的内容都重复情况下。

例如有3个内容相同的页面：

https://.../sample/a

https://.../sample/b

https://.../sample/c

我们不想让蜘蛛重复爬取这3个页面，只需要告诉蜘蛛爬取其中1个页面即可，不然浪费了爬取预算，增加爬虫工作量，同时还分散了页面的权重
  • 307 与 302 之间的唯一区别在于，当发送重定向请求的时候，307 状态码可以确保请求方法和消息主体不会发生变化

zhuanlan.zhihu.com/p/91937055

TCP和UDP

  • UDP和TCP的区别？
  1. 是否基于连接

TCP是面向连接的协议，而UDP不是，即发送数据之前UDP不需要建立连接。

  1. TCP比UDP更可靠

TCP是提供交付保证，即保证字节有序（通过校验和，重传控制，序号标识，滑动窗口、确认应答实现可靠传输），UDP尽最大努力交付不保证可靠性（UDP不提供任何有序性或序列性的保证）。 因为TCP是全双工的，可以理解成双向车道，UDP则是不可信道。

  1. 实时性UDP更好

UDP具有较好的实时性，工作效率比TCP高，适用于对高速传输和实时性有较高的通信或广播通信。

  1. 协议首部大小

TCP首部开销20字节; UDP的首部开销小，只有8个字节 。

  1. UDP运行速度更快

TCP速度比较慢，而UDP速度比较快，因为TCP必须创建连接，以保证消息的可靠交付和有序性，毕竟TCP协议比UDP复杂。

  1. UDP没有拥塞机制

网络出现拥塞不会使源主机的发送速率降低（对实时应用很有用，如IP电话，实时视频会议等）

  1. 传输模式不同，字节流和数据报模式

第2点提到过，TCP面向字节流，把数据看成一串无结构的字节流。UDP是面向报文的。

  1. TCP对系统资源要求较多，UDP对系统资源要求较少。

TCP被认为是重量级的协议，而与之相比，UDP协议则是一个轻量级的协议。因为UDP传输的信息中不承担任何间接创造连接，保证交货或秩序的的信息。这也反映在用于承载元数据的头的大小。

  1. 应用场景

每一条TCP连接只能是点到点的;UDP支持一对一，一对多，多对一和多对多的交互通信 。基于UDP不需要建立连接，所以且适合多播的环境，UDP是大量使用在游戏和娱乐场所。

  1. 总结

TCP： 优点：可靠 稳定 TCP的可靠体现在TCP在传输数据之前，会有三次握手来建立连接，而且在数据传递时，有确认. 窗口. 重传. 拥塞控制机制，在数据传完之后，还会断开来连接用来节约系统资源。

缺点：慢，效率低，占用系统资源高，易被攻击

UDP应用场景： 当对网络质量有要求时，比如HTTP，HTTPS，FTP等传输文件的协议；POP，SMTP等邮件传输的协议。

axios、fetch与ajax的区别

www.jianshu.com/p/8bc48f8fd…

  • ajax是基于XHR对象的，JQuery ajax是对原生XHR的封装，支持jsonp跨域。
  • axios基于Promise对ajax封装
  • fetch更底层，基于Promise对原生js封装,没有XHR对象。
avatar
文章
阅读
粉丝