前端网络相关面试题

http

一、介绍一下http，有什么特点

http是超文本传输协议(Hyper Text Transfer Protocol)，主要负责web server和浏览器之间的通讯；http协议是把客户端的请求发送到一个服务器，并把网页内容从服务器返回到客户端

特点：

1. 简单快速：客户向服务器请求服务时，只需要发送请求方法和路径
2. 灵活：http允许传输任意类型的数据对象，使用Content-Type标志
3. 无连接：无连接是指限制每次只连接处理一个请求，服务器处理完客户的请求并收到客户的应答后，即断开连接
4. 无状态：http协议是无状态协议

二、http和https的区别

http：是互联网上应用最为广泛的一种网络协议，是一个客户端和服务器请求和应答的标准，用于从服务器传输超文本到本地浏览器的传输协议，它可以使浏览器更加高效，使网络传输减少

https：是以安全为目标的http通道，就是http的安全版，即在http下加入ssl层，是安全基础

区别

1. https需要申请证书，一般免费证书较少，需要一定费用
2. http是超文本传输协议，信息是明文传输的；https是具有安全性的ssl加密传输协议
3. http和https是完全不同的连接方式，用的端口也不一样，http用80，https用443
4. http的连接很简单，是无状态的；https协议是由ssl+http协议构建的可进行加密传输、身份认证的网络协议，比http协议安全

三、http请求方式

请求方式

1. 简单请求
   • get：常用于向服务器请求获取资源
   • post：常用于发送或者提交数据到服务器
   • head：代表请求资源的头部信息，并且这些头部与http的get请求返回一致，使用场景是在下载一个大文件前先获取其大小再决定是否下载，可以节约带宽资源
2. 复杂请求
   • options：试探请求，在真正发送请求时，先试探是否 OK ，用于获取目的资源所支持的通信选项
   • put：用于新增资源或者使用请求中的有效负载替换目标资源的表现形式
   • delete：用于删除指定的某些资源
   • trace：回显服务器收到的请求，主要用于测试或者诊断
   • patch：用于对资源进行部分修改

get和post的区别

1. 数据传输方式不同： get请求将参数拼接在url之后的，对用户可见，post的传输数据对用户是不可见的，在请求体的body中传输(但是打开控制台也会可以看到)
2. 安全性不同：get是明文传输，直接在页面可见，不安全；post的数据包含在请求主体的body中，相对来说较为安全
3. 数据类型不同：get传输字符串，post无限制
4. 传输数据大小不同：get限制大小为2 KB ，post默认无限制
5. get无害：get刷新后退等浏览器操作是无害的，post可能重复提交表单

put和post的区别

1. 两者相同点都是给服务器发送新增资源
2. put方法是幂等的，连续调用一次或者多次的效果相同，无副作用；而post方法是非幂等的，调用多次会产生多次结果
3. put指定具体单一资源；post可以指向资源集合

put和patch的区别

1. 两者相同点都是给服务器发送修改资源，都是更新资源
2. put是直接覆盖资源的修改方法，可能需要携带无用信息；post用来对已知资源进行局部更新，避免携带无用信息

四、http状态码

2xx 成功

• 200：OK，表示从客户端发来的请求在服务端被正确处理
• 201：Created，请求已经被实现，而且有一个新的资源已经依据请求的需要而建立
• 202：Accepted，请求已接收，但未执行，不保证完成请求
• 204：No content，表示请求成功，但是响应报文不含实体的主体部分
• 206：Partial Content，进行范围请求

3xx 重定向

• 301：move permanently，永久重定向，表示资源已经被分配了新的url
• 302：found，临时重定向，表示资源临时被分配了新的url
• 303：see other，表示资源存在在另一个url，应使用get请求获取资源
• 304：not modified，表示服务器允许访问资源，但因发生请求不满足条件的情况，走了对比缓存拿数据
• 307：temporary redirect，同302，临时重定向

4xx 客户端错误

• 400：bad request，请求报文存在语法错误
• 401：unauthorized，可以访问页面但需携带认证消息
• 403：forbidden，不存在访问页面的权力，表示对请求资源的访问被服务器拒绝
• 404：not found，表示在服务器上没有找到请求资源
• 408：request timeout，客户端请求超时
• 409：confict，请求的资源可能引起冲突

5xx 服务器错误

• 500：internal server error，表示服务器在执行请求时发生了错误
• 501：not implemented，请求超出服务器能力范围，例如服务器不支持当前请求所需要的某个功能或者某个方法
• 503：service unavailable，表示服务器暂时处于超负荷或正在停机维护，无法处理请求
• 505：http version not supported，服务器不支持，或拒绝支持在请求中使用的http版本

五、http请求报文和响应报文

请求报文

1. 请求行：请求方法 + URL + HTTP 协议版本

   Request URL: http://10.9.65.177/api/newsNotice/list
   Request Method: POST
   ......
   

2. 请求头：由关键字/关键值对组成，每行一对

   Accept: */*
   Content-Type: application/json;charset=UTF-8
   Host: 10.9.65.177
   Origin: http://localhost:8080
   ......
   

3. 请求体/请求正文：简单来说就是请求参数，post/put等请求携带的数据

响应报文

1. 响应行：协议版本 + 状态码 + 状态码原因短语组成 ----> HTTP/1.1 200 OK
2. 响应头：响应首部字段，也是由关键字/关键值对组成，每行一对
3. 响应体：服务器响应的数据

六、http的请求头中keep-alive是干啥的

在早期的 HTTP/1.0中，每次 http请求都要创建一个连接，而在创建链接的或称需要耗费资源合时间，为了减少资源消耗和缩短响应时间，就需要重用连接；

在后来的HTTP/1.0中以及HTTP/1.1中，引入了重用连接的机制，就是在http请求头中加载Connection:keep-alive，来告诉对方这个请求响应完成之后不要关闭，下一次我们还用这个请求继续交流；

协议规定，HTTP/1.0如果想要保持长连接，需要在请求头上加上Connection:keep-alive

优点：

1. 较少的cpu和内存使用
2. 允许请求和应答的http管线化（管线化是指将多个 HTTP 请求整批发送，在发送过程中不用等待对方响应；管线化是在持久连接的基础上实现的，管线化的实现，能够同时并行发送多个请求，而不需要一个接一个的等待响应）
3. 降低拥塞控制
4. 减少后续请求的延迟
5. 报告错误无需关闭tcp连接

七、http的缓存过程是怎么样的

1. 客户端首次向服务器发出请求，请求资源
2. 服务器返回资源和缓存策略，浏览器将缓存策略和缓存资源写入缓存系统
3. 客户端再次向服务器发出请求时，会先从缓存系统中对比查找，根据策略的不同，判断资源是否过期等，决定是否读取本地缓存或者服务器协商缓存

八、http的优化策略

优化策略有两种：压缩和缓存

压缩

1. 将文件变小，一个文件会不会解压，看浏览器根据请求头的Accept-Encodeing

缓存

1. 强缓存：看两个响应头 Expires 与Cache-Control，它控制着多长时间内不要再来访问我
2. 对比缓存：如果一个文件没有改变，那么文件走缓存， Last-Modified/If-Modified-Since还有ETag/If-None-Match； 服务器会优先验证ETag，ETag是资源唯一标识符，看是否一致，一致的情况下，才会继续比对Last-Modified，看最后一次资源修改的时间

网络相关总结

tcp

一、网络模型

1. 应用层

   与其他计算机进行通讯的一个应用，它是对应应用程序的通信服务的。例如，一个灭有通信功能的字处理程序就不能执行通信的代码，从事字处理工作的程序员也不关心 OSI 的第七层；但是如果添加了一个传输文件的选项，那么字处理的程序就需要实现 OSI 的第七层，比如 TELNET

2. 表示层

   这一层主要功能是定义数据格式及加密。例如，FTP允许你选择以二进制或 ASCII格式传输。如果选择二进制，那么发送方和接收方不改变文件的内容；如果选择 ASCII格式，发送方将把文本从发送发的字符集转换成标准的 ASCII 后发送数据，在接收方将标准的 ASCII转换为计算机的字符集，比如，加密

3. 会话层

   它定义了如何开始、控制和结束一个会话，包括对多个双向消息的控制和管理，以便在只完成连续消息的一部分时可以通知应用，从而使表示层看到的数据是连续的，在某些情况下，如果表示层收到了所有的数据，则用数据代表表示层，比例 RPC

4. 传输层

   这层的功能包括是否选择差错恢复协议还是无差错恢复协议，及在同一主机上对不同应用的数据流的输入进行复用，还包括对收到的顺序不对的数据包的重新排序功能，比如，TCP

5. 网络层

   这层对端到端的包传输进行定义，它定义了能够标识所有结点的逻辑地址，还定义了路由实现的方式和学习的方式；为了使用最大传输单元长度小于包长度的传输介质，网络层还定义了如何将包分解成更小的包的分段方法，比如，IP

6. 数据链路层

   它定义了在单个链路上如何传输数据，这些协议与被讨论的各种介质有关，比如，ATM

7. 物理层

   OSI的物理层规范是有关传输介质的特性，这些规范通常也参考了其他组织制定的标准。连接头、帧、帧的使用、电流、编码及光调制等都属于物理层规范中的内容，物理层常用多个规范完成对所有细节的定义，比如，Rj45

8. 网络模型概述

   网络模型又可称的七层协议，但有时会减为5层，他是从下到上来看的，物理层是第一层，应用层是第七层

二、输入一个网址到浏览器显示页面经历的过程

1. 浏览器地址栏中输入url回车
2. DNS查询解析得到ip地址，通过ip访问服务器
3. 建立tcp连接，进行三次握手
4. 浏览器端发起http请求‘
5. 服务器响应请求，并返回响应数据
6. 浏览器获取资源后进行解析和渲染，显示页面
7. 断开连接，存在四次挥手

三、浏览器解析渲染页面的详细步骤

1. 浏览器获取html代码解析成DOM树
2. 浏览器整理样式解析形成css规则树
3. DOM树和css规则树组合成render树，即渲染树
4. 浏览器根据render树绘制并显示页面

四、建立tcp连接的过程

http协议是基于tcp协议的，在数据流通之前，有一个建立tcp连接的过程，他会建立三次握手和四次挥手

三次握手

目的是：让客户端、服务端都确保双方的发送、接受能力是正常的

1. 客户端发送连接请求（报文 SYN ）到服务器，等待服务器确认
2. 服务器确认客户端发送的请求；同时也向客户端发送请求（报文 SYN+ ACK），等待客户端确认
3. 客户端确认发送过来的请求，会发送一个ACK报文给服务端，建立tcp连接（这一次可传数据）

四次挥手：为什么要四次呢，因为在服务端接收到客户端发来的FIN之后，可能还有数据没有传输完给客户端，所以只能先回应客户端说收到啦，等数据都传输完之后去向客户端发断开请求

1. 客户端发送一个FIN报文给服务端
2. 服务端 接收到FIN报文，会发送ACK报文给客户端（ 服务端处于CLOSE_WAIT状态 ）
3. 服务端发送FIN报文给客户端（ 服务端处于LAST_ACK的状态 ）
4. 客户端收到FIN报文后，一样发送一个ACK报文作为应答传给服务端（服务端处于CLOESED的状态）

浏览器

一、同源策略是什么

同源策略是指协议、域名、端口三者都要相同，只要有一个不同就会产生跨域；同源策略是指作为浏览器最基本的安全功能的一种约定，降低来自xss、csfr等攻击的风险

二、跨域是什么

广义上来讲是一个域下的资源去请求另一个非同源域下的资源

狭义上上来讲是浏览器不能执行其他网站的脚本，它是由浏览器的同源策略造成的，是浏览器对javascript施加的安全限制

换句话说，跨域的限制访问，其实是浏览器的限制

三、跨域产生的条件或者说跨域产生的原因？

浏览器的限制和ajax请求；跨域问题只存在浏览器端

四、跨域解决常见方案

• jsonp：利用script标签的src属性发出get请求
• 代理服务器：webpack-dev-server
• 空的iframe+ form
• 服务器使用nginx反向代理

五、浏览器是由什么组成的

分别有7个模块：

用户界面、浏览器引擎、渲染引擎、网络、js解释器、UI后端、数据持久化存储

最重要的是渲染引擎（内核）和javascript解释器（javascript引擎）

浏览器内核：主要负责HTML、CSS的解析，页面布局、渲染和复合层合成；javascript引擎负责javascript解析和代码执行

六、谈谈对seo的理解

搜索引擎优化，目的是使网站能够被搜索引擎抓取，提高在搜索引擎内的自然排名，从而带来更多免费的流量；优化主要分为站内优化和站外优化

站内优化：精准使用title，description、keyword等页面属性

站外优化：在各网站上宣传，扩大知名度等

面试相关