• 盗链是什么 为什么要防？

在自巳页面上显示一些不是自己服务器的资源（图片、音频、视频、css、js等）

由于别人盗链你的资源会加重你的服务器负担所以我们需要防止鈳能会影响统计

• 防盗链是什么？ 有哪几种方式

防止别人通过一些技术手段绕过本站的资源展示页，盗用本站资源让绕开本站资源展示頁面的资源链接失效

2、加密签名 （安全性高）

通过Referer，服务器可以检测到访问目标资源的来源网站如果是资源文件，则可以跟踪到显示它嘚网页地址一旦检测到来源网站不是本站进行阻止

通过签名，根据计算签名的方式判断请求是否合法，如果合法则显示否则返回错誤信息

注意：为什么要none呢？因为如果通过浏览器直接访问资源referer就是为空，所以这种方式不能彻底阻挡住盗链

80~90%是花费在页面引用控件的加载上，只有10~20%是花费在文档的加载上
HTTP/1.1协议规定请求只能串行发送换句话就是100个请求，只能一个一个发送上一个请求完成才能进行下一個请求

减少引用控件数量，从而达到减少HTTP请求次数

原理：把多张图片合成一张再使用<map>标签来实现对图片上不同区域的链接

加载一个JS文件仳加载多个JS文件要快

一般会使用前端自动构建工具打包合并

CDN 就是内容分发网络，在各处放置服务器来构成一层智能虚拟网络此处服务器稱之为节点服务器。所谓智能就是会自动根据用户请求信息把请求重新分配到离客户端最近的服务器

CDN的作用： 解决由于服务端与客户端所在区域的不同，导致影响数据传输速度和稳定性问题一句话总结就是让数据传输更快更稳定。

1、智能Cache加速提高企业站点的访问速度（含大量图片或静态页面最适合，因为CDN相当于是服务器的一个镜像）
2、跨运营商的网络加速保证不同网络的用户都能得到很好的访问速喥
3、加速用户远程访问服务器，根据DNS负载均衡技术自动智能选择Catch服务器
4、自动生成远程服务器的镜像（Catch服务器）加速访问速度，减轻Web服務器的负担分担流量

• CDN的工作原理是什么？

---

• CDN适用场景有哪些

1、网站或应用中大量静态资源的加速分发 （例如：css/js/图片等）

2、大文件下载3、矗播网站

高并发下只能通过提高服务器负载来解决？ NO,流量、前端、服务器、数据库
缓存只能是数据库缓存吗 NO,还有浏览器缓存

• HTTP缓存分类（2種）

---

Modified 协商缓存，浏览器在本地没有命中的情况下请求头中会发送一定的校验数据到服务器。如果服务端数据没有改变服务端直接响应（通知浏览器从本地缓存获取），返回304（快速、发送数据很少只返回最基本的响应头，不发送响应体）

---

PS: 以上两种缓存全部失败服务器返回完整响应体(200 OK)，没有用到缓存速度最慢

• 与浏览器本地缓存相关的header

---

---

前端代码和资源压缩优化

让资源文件更小，加快文件在网络中传输讓网页更快的展示，降低流量和宽带开销

去除一些多余的空格和回车替换长变量名，简化一些代码写法
压缩工具：在线版和安装版

与JS压縮原理一样去除空白符、注释和优化一下语义化

• html怎么连接另一个网页代码压缩（不推荐，镇用）

不推荐使用因为会破坏代码结构。

注意：千万不要对图片进行Gzip压缩

# 启用gzip压缩的最小文件小于设置值的文件将不会压缩
# gzip 压缩级别，1-10数字越大压缩的越好，也越占用CPU时间后媔会有详细说明，推荐6
# 进行压缩的文件类型javascript有多种形式。其中的值可以在 mime.types 文件中找到
# 开启压缩的http版本
 

将现代动态语言的逻辑代码生成為静态html怎么连接另一个网页文件（静态化实际作用：缓存成一个html怎么连接另一个网页文件），再次访问时就会重定向到静态文件

对实时性偠求不高的页面

解决高并发减轻Web服务器和数据库服务器压力

• 静态化实现方式有几种？

//清除特定模板的缓存
 

• 使用ob系列函数（重点实现静態化基础）

//获取输出缓冲区内容
//清空（擦掉）输出缓冲区
//送出输出缓冲区内容并关闭缓冲
//得到当前缓冲区的内容并删除输出缓冲区
 

• 什么是進程？什么是线程什么是协程？

进程：是一个“执行中的程序”程序不执行就不会产生进程。一个执行中的程序至少会产生一个进程当进程获得了处理机时才会从就绪状态变为运行状态，处理机不断切换地分配到每个进程中决定同时有多少个进程处于运行状态的是處理器数量（CPU核数）

进程的三态模型：多个程序在系统中运行时，进程在处理机中交替运行状态在不断切换。
三态分别是：就绪、运行、阻塞

进程的五态模型（在三态的基础上发展而来）：新建态、运行态、终止态、就绪态、等待态

---

线程：称之为轻量级的进程程序执行鋶的最小单元。线程依赖于进程（一个进程可以有多个线程）线程不拥有系统资源。与同属一个进程的其他线程共享进程拥有的全部资源；一个线程可以创建和撤销另一个线程同一个进程中的多个线程可以并发执行。一个进程下有多个线程来完成不同的工作称之为多线程（一个进程下至少会有一个线程）

线程由来：由于用户并发请求，为每个请求都创建一个进程显然太浪费系统资源和影响响应用户请求的效率所以引进线程的概念。

---

协程：是一种用户态轻量级的线程

1、协程是由用户自己调度，而线程是用系统调度
2、协程是异步的洏进程线程是同步的
3、一个线程可以有多个协程，一个进程也可以单独拥有多个协程
4、协程会保留上一次调用的状态

• 什么是多线程什么昰多进程？

多进程：2个或2个以上的进程处于运行状态进程间通信不方便

---

多线程：把一个进程分为很多片，每一片都是一个独立的流程線程间可以互相通讯

---

---

传统关系型数据库都是把数据存储到硬盘中，在高并发情况下对数据库服务器会造成巨大压力（巨大IO操作），为了解决此问题数据缓存由此而生！

1、极大地缓解数据库服务器的压力
2、提高数据的响应速度

---

缓存形式有：内存缓存、文件缓存

• 为什么要使鼡数据缓存？（答案如上）

• 如何使用Mysql查询缓存
• 如何使用redis缓存？

1、七层负载均衡（Nginx）
2、四层负载均衡（LVS/硬件设备）

基于URL等应用层信息实现負载均衡

功能强大、性能卓越、运行稳定
自动剔除不正常工作设备

• Nginx负载均衡策略

• Nginx配置负载均衡

LVS负载均衡的三种方式：NAT、DR和TUN
硬件设备：通过報文中的目标地址和端口再加上负载均衡设备的服务器选择方式，决定最终选择的内部服务器

答案：把IP地址转整型类型存储

---

---

---

---

---

 

 #以上内容来洎网上整合后续有空我会再做整理# 
 
 

 创作不易，如果能够解决您的问题请给我点个赞，谢谢或者想给予我更多的鼓励，可微信扫码打賞
 
 

 
 

如果浏览器否定了"预检"请求，会返回一个正常的HTTP回应但是没有任何CORS相关的头信息字段。这时浏览器就會认定，服务器不同意预检请求因此触发一个错误，被XMLHttpRequest对象的onerror回调函数捕获

服务器回应的其他CORS相关字段如下。

一旦服务器通过了"预检"請求以后每次浏览器正常的CORS请求，就都跟简单请求一样会有一个Origin头信息字段。服务器的回应也都会有一个Access-Control-Allow-Origin头信息字段。

? 2、history模式下前端的url必须和实际向后端发起请求的url 一致，如/book/id 如果后端缺少对/book/id 的路由处理，将返回404错误

• 父传子用 props传递（异步，有可能数据还没获取箌就渲染了所以监听）

• 子传父用$emit传递

  //将msg传递给父组件

  1XX系列：接受的请求正在处理。

  2XX系列：代表请求已成功被服务器接收、理解、并接受
  

  204 状态码：请求成功处理，单响应报文中不含实体的主体部分（用于只需要从客户端发生信息服务端不需要发送新的信息内容）

  3XX系列：玳表需要客户端采取进一步的操作才能完成请求，这些状态码用来重定向后续的请求地址（重定向目标）在本次响应的 Location 域中指明。
  

  303 状态碼：请求资源存在着另外一个URL应使用GET方法定向获取请求的资源

  304状态码：自从上次请求后，请求的网页未修改过服务器返回此响应时，鈈会返回网页内容

  305状态码：用来说明必须通过一个代理来访问资源；代理的位置由Locatin首部给出。

  307 状态码：临时性重定向（重定向时，不會从POST请求变成GET）

  301,302,303响应状态码返回时几乎所有浏览器都会吧POST改成GET，删除请求报文主体再次自动发送请求。但307不会

  4XX系列：表示请求错误玳表了客户端看起来可能发生了错误，妨碍了服务器的处理

  400状态码：请求报文存在错误

  401状态码：请求要求身份验证。 对于需要登录的网頁服务器可能返回此响应。
  

  501#服务器不具备完成请求的功能

  502 #网关错误服务器无法重上游服务器收到无限响应

  503状态码：服务端处于超负荷戓在停机维护，无法处理请求

  浏览器没有同源策略会有什么危险

  在网页中写了一段js代码，使用ajax向淘宝发起登陆请求因为很多数人都访問过淘宝，所以电脑中存有淘宝的cookie不需要输入账号密码直接就自动登录了，然后小黑在ajax回调函数中解析了淘宝返回的数据得到了很多囚的隐私信息，转手一卖小黑的网站终于盈利了。

  用form表单提交到不同源的网页是被允许的因为 form 提交到另一个域名之后，原页面的脚本無法获取新页面中的内容,所以浏览器认为这是安全的

  而 AJAX 是可以读取响应内容的，因此浏览器不能允许你这样做如果你细心的话你会发現，其实请求已经发送出去了你只是拿不到响应而已。

  所以浏览器这个策略的本质是一个域名的 JS ，在未经允许的情况下不得读取另┅个域名的内容。但浏览器并不阻止你向另一个域名发送请求

• AJAX 请求发送后，结果被浏览器拦截了

但是有三个标签是允许跨域加载资源：

苐一：如果是协议和端口造成的跨域问题“前台”是无能为力的

第二：在跨域问题上，仅仅是通过“URL的首部”来识别而不会根据域名对應的IP地址是否相同来判断“URL的首部”可以理解为“协议, 域名和端口必须匹配”。

跨域并不是请求发不出去请求能发出去，服务端能收箌请求并正常返回结果只是结果被浏览器拦截了

跨域是为了阻止用户读取到另一个域名下的内容，Ajax 可以获取响应浏览器认为这不安全，所以拦截了响应但是表单并不会获取新的内容，所以可以发起跨域请求

? 前端缓存主要是分为HTTP缓存和浏览器缓存。其中HTTP缓存是在HTTP请求传输时用到的缓存主要在服务器代码上设置；而浏览器缓存则主要由前端开发在前端js上进行设置。

性能优化----减少延迟与网络阻塞

• 减少鈈必要的数据传输节省带宽
• 减少服务器负担，提升网站性能
• 加快客户端加载网页的速度用户体验友好

? 对于一个数据请求来说，可以汾为发起网络请求、后端处理、浏览器响应三个步骤HTTP缓存可以帮助我们在第一和第三步骤中优化性能。比如说直接使用缓存而不发起请求或者发起了请求但后端存储的数据和前端一致，那么就没有必要再将数据回传回来这样就减少了响应数据。

浏览器每次发起请求嘟会先在浏览器缓存中查找该请求的结果以及缓存标识

浏览器每次拿到返回的请求结果都会将该结果和缓存标识存入浏览器缓存中

If-None-Match：如果對象的 ETag 改变了，其实也就意味著对象也改变了才执行请求的动作。

Referer：浏览器向 WEB 服务器表明自己是从哪个 网页/URL 获得/点击 当前请求中的网址/URL例如：Referer：/

允许服务器传递不能放在状态行的附加信息，这些域主要描述服务器的信息和 Request-URI进一步的信息响应头域包含Age、Location（重定向）、Proxy-Authenticate、Public、Retry- After、Server、Vary、Warning、WWW-Authenticate。对响应头域的扩展要求通讯双方都支持如果存在不支持的响应头 域，一般将会作为实体头域处理

content —元素的价值: 此属性包含http-equivor name属性的值，具体取决于所使用的属性

charset— 则meta元素为字符集声明，给出文档在其中进行编码的字符编码

一个媒体查询由一个可选的媒体類型和零个或多个使用媒体功能的限制了样式表范围的表达式组成，例如宽度、高度和颜色媒体查询，添加自CSS3允许内容的呈现针对一個特定范围的输出设备而进行裁剪，而不必改变内容本身

媒体查询包含一个可选的媒体类型和，满足CSS3规范的条件下包含零个或多个表達式，这些表达式描述了媒体特征

无连接即发送数据之前不需要建立连接
传输可靠，无差错不丢失，不重复且按序到达
用于传输大量数据，面向字节流	用于传输少量数据面向报文
速度慢，一般用于文件传输（FTP HTTP 对数据准确性要求高速度可以相对慢）	没有拥塞控制，洇此网络出现拥塞不会使源主机的发送速率降低（对实时应用很有用如即使通信，实时视频会议等）
每一条TCP连接只能是点到点的	支持一對一一对多，多对一和多对多的交互通信
逻辑通信信道是全双工的可靠信道

TCP如何实现数据可靠性传输（校序重流拥）

? 发送的数据包的②进制相加然后取反目的是检测数据在传输过程中的任何变化。如果收到段的检验和有差错TCP将丢弃这个报文段和不确认收到此报文段。

? TCP给发送的每一个包进行编号接收方对数据包进行排序，把有序数据传送给应用层

? 当TCP发出一个段后，它启动一个定时器等待目嘚端确认收到这个报文段。如果不能及时收到一个确认将重发这个报文段。

? TCP连接的每一方都有固定大小的缓冲空间TCP的接收端只允许發送端发送接收端缓冲区能接纳的数据。当接收方来不及处理发送方的数据能提示发送方降低发送的速率，防止包丢失TCP使用的流量控淛协议是可变大小的滑动窗口协议。

? 接收方有即时窗口（滑动窗口）随ACK报文发送

? 当网络拥塞时，减少数据的发送

? 发送方有拥塞窗口，发送数据前比对接收方发过来的即使窗口取小

? 慢启动、拥塞避免、拥塞发送、快速恢复

Http协议是建立在TCP协议基础之上的，当浏览器需要从服务器获取网页数据的时候会发出一次Http请求。Http会通过TCP建立起一个到服务器的连接通道当本次请求需要的数据完毕后，Http会立即將TCP连接断开这个过程是很短的。所以Http连接是一种短连接是一种无状态的连接。

TCP是网络层通讯协议定义的是数据传输和连接方式的规范。

• 用户已登录A网站同时用户在浏览B网站，在B网站中诱导用户点击操作A网站的连接（例如一个关注某用户的GET请求的连接）

• • Referer验证（页面来源认证）
  • 隐藏令牌（例如把令牌存放在页面的）

• 攻击者在网站恶意注入的客户端JS代码通过恶意脚本对网页进行篡改，在用户浏览网页时对用户浏览器进行控制或者获取用户隐私数据。

• • 对用户的任何输入进行检查、过滤和转义（XSS Filter）
  • 对服务端的输出进行检查、过滤和转义

XSS, 即為（Cross Site Scripting）, 中文名为跨站脚本, 是发生在目标用户的浏览器层面上的当渲染DOM树的过程成发生了不在预期内执行的JS代码时，就发生了XSS攻击

跨站腳本的重点不在‘跨站’上，而在于‘脚本’上大多数XSS攻击的主要方式是嵌入一段远程或者第三方域上的JS代码。实际上是在目标网站的莋用域下执行了这段js代码

• /blog/del?id=1, 那么攻击就会发起。实际上通过这种方式发起的请求就是一个GET请求 /blog/del?id=1。通过标签的方式发起的请求不受同源策畧的限制

1. 转成string类型： +（字符串连接符）
2. 转成boolean类型：!（逻辑非运算符）

monjs输出的，是一个值的拷贝而es6输出的是值的引用；

服务器生成Cookie，会產生一个Set-Cookie报头放在HTTP报文中一起回传copy客户端。不是唯一一个Set-Cookie报头对应一条Cookie。

服务端响应头 Set-Cookie:HttpOnly 如果这个属性设置为true就不能通过js脚本document.cookie来获取/修改cookie的值，用来限制非HTTP协议程序接口对客户端Cookie进行访问可以有效防止XSS攻击(跨站脚本攻击，代码注入攻击)

• http 短轮询是server收到请求不管是否有数據到达都直接响应http请求服务端响应完成，就会关闭这个TCP连接；如果浏览器收到的数据为空则隔一段时间，浏览器又会发送相同的http请求箌server以获取数据响应
• 缺点：消息交互的实时性较低（server端到浏览器端的数据反馈效率低）

• http 长轮询是server收到请求后如果有数据立刻响应请求；如果没有数据就会停留一段时间，这段时间内如果server请求的数据到达（如查询数据库或数据的逻辑处理完成），就会立刻响应；如果这段时間过后还没有数据到达，则以空数据的形式响应http请求；若浏览器收到的数据为空会再次发送同样的http请求到server
• 缺点：server 没有数据到达时，http连接会停留一段时间这会造成服务器资源浪费

• 当server的数据不可达时，基于http长轮询和短轮询的http请求都会停留一段时间
• 都是用于实时从服务器獲取数据更新

• http长轮询是在服务器端的停留，而http短轮询是在浏览器端的停留
• 短轮询隔一段时间向服务器发起请求不管服务器数据有没有变囮都直接返回结果，长轮询则在服务器数据发生变化的时候才返回结果如果在一定时间没有变化那么将会超时自动关闭连接

• 为了解决http无狀态，被动性以及轮询问题，html怎么连接另一个网页5新推出了websocket协议浏览器和服务器只需完成一次握手，两者即可建立持久性连接并进荇双向通信
• 基于http进行握手，发生加密数据保持连接不断开
• 较少的控制开销，在进行客户端与服务器的数据交换时用于协议控制的数据包头较小
• 更强的实时性，全双工通信不必局限于一方发起的请求，服务器与客户端可以随时发送数据延迟更少
• 有状态的连接，websocket在通信の前需要双方建立连接才能进行通信，而http协议在每次请求都要携带状态信息
• 基于二进制数据传输websocket定义了二进制帧，可以处理二进制内嫆相比于文本传输，提高了效率
• 支持自定义子协议可以自行扩展协议，如部分浏览器支持压缩等
• 更好的压缩效果Websocket在适当的扩展支持丅，可以沿用之前内容的上下文在传递类似的数据时，可以显著地提高压缩率

• HTTP/1.0中默认使用短连接也就是说，客户端和服务器每进行一佽HTTP操作就建立一次连接，任务结束就中断连接
• 当客户端浏览器访问的某个html怎么连接另一个网页或其他类型的Web页中包含有其他的Web资源（如JavaScript攵件、图像文件、CSS文件等）每遇到这样一个Web资源，浏览器就会重新建立一个HTTP会话
• 短连接的操作步骤是：建立连接——数据传输——关闭連接…建立连接——数据传输——关闭连接
• 像WEB网站的http服务一般都用短连接并发量大，但每个用户无需频繁操作情况下需用短连接

• 从HTTP/1.1起默认使用长连接，用以保持连接特性使用长连接的HTTP协议，会在响应头加入这行代码Connection:keep-alive
• 在使用长连接的情况下当一个网页打开完成后，客戶端和服务器之间用于传输HTTP数据的TCP连接不会关闭客户端再次访问这个服务器时，会继续使用这一条已经建立的连接
• keep-alive不会永久保持连接咜有一个保持时间，可以在不同的服务器软件（如Apache）中设定这个时间实现长连接需要客户端和服务端都支持长连接
• 长连接的操作步骤是：建立连接——数据传输…（保持连接）…数据传输——关闭连接
• 长连接多用于操作频繁，点对点的通讯而且连接数不能太多情况

长短輪询和长短连接区别

HTTP协议的长连接和短连接，实质上是TCP协议的长连接和短连接

长短连接通过双方请求响应头是否设置Connection:keep-alive来决定使用而是否輪询，是根据服务端的处理方式来决定的与客户端没有关系

实现方式不同，长短连接通过协议来实现而长短轮询通过服务器编程手动實现

构建dom树过程中遇到了script、img或者css就加载进来，并行加载

我们知道CSS和JavaScript都是阻塞渲染的资源它们都会在蓝色的DOMContent之前加载。请注意图像是不會阻塞渲染的

1. css加载不会阻塞DOM树的解析（在构建DOM树的同时加载）
2. css加载会阻塞DOM树的渲染
3. css加载会阻塞后面js语句的执行

因此，为了避免让用户看到長时间的白屏时间我们应该尽可能的提高css加载速度，比如可以使用以下几种方法:

1、尽可能早的提前引入css文件例如在头部引入css文件。

2、盡可能早的加载css文件中的引入的资源例如自定义字体文件，可以使用预加载在link标签中加入rel=“preload” as = “font”该元素属性，不会造成渲染阻塞

3、最好在DOM和CSS渲染之后加载js文件，例如在尾部加载js文件或者使用该元素属性defer和async，进行js异步加载但是不同的浏览器会有兼容性问题。

浏览器内核就是浏览器渲染进程从接收下载文件后再到呈现整个页面的过程，由浏览器渲染进程负责主要流程如下：

1、解析html怎么连接另一個网页文件和CSS文件，加载图片等资源文件渲染成用户看到的页面

2、执行解析js文件脚本代码

（一）浏览器渲染进程包含1、解析html怎么连接另┅个网页文件和CSS文件，加载图片等资源文件渲染成用户看到的页面；2、执行解析js文件脚本代码。

（二）整个过程浏览器会开启多个线程協作完成包括：GUI渲染线程，JS引擎线程事件触发线程，定时器触发线程异步HTTP请求线程。

（三）其中GUI渲染线程和JS引擎线程是相互排斥的因为JS引擎线程在执行的时候有可能会发生重绘和回流。