前端面试高频题目

一 、HTTP（计网）

http和https的区别

ssL原理

webscokect

http请求过程

http 请求头的概念

HTTP协议简介（请求头、响应头、请求方式）请求协议、响应协议
HTTP消息结构

请求方法（get、post区别）

自己的理解：get就是直接像浏览器请求资源，比如说直接请求一个页面的资源，而post一般用于用户输入数据的时候，带着这个数据（比如用户登录，带着用户名和密码），向服务器发送请求（也是请求页面，请求登陆后的页面）

get和post的区别：

1、url可见性： get，参数url可见； post，url参数不可见
2、数据传输上： get，通过拼接url进行传递参数； post，通过body体传输参数
4、后退页面的反应， get请求页面后退时，不产生影响， post请求页面后退时，会重新提交请求

5、传输数据的大小：GET请求在URL中传送的参数是有长度限制的，而POST没有
6、安全性 原则上post肯定要比get安全，毕竟传输参数时url不可见，

get和head的区别

状态码

TCP的三次握手、四次挥手

三次握手

四次挥手

客户端想要断开连接
but服务器可能数据还没传输完数据，所以先返回一个（我收到你的请求了）
传输数据完成后，发送（同意断开连接）
客户端断开连接

二 、浏览器

1、页面性能优化

如何加快首屏速度

2、浏览器兼容

• *是通配符(通配符选择器)，表示所有 * { margin:0;} 重置所有元素的边距
  浏览器兼容
  
  
  
  

3、浏览器渲染HTML的步骤

① 什么是重绘和重排？

② 引起重排的操作

③ 如何减少重排和重绘

4、浏览器缓存

① 介绍一下浏览器缓存策略

② js请求，一般会有哪些地方有缓存处理?

③ CDN 服务

我们把一些资源上传的时候，可以进行文件的同步到各个服务器，这样的话各个服务器其实就都有资源了

静态资源

5、跨域

跨域的背景
js跨域解释和方法
没有同源会怎么样

① 什么是跨域

② 为什么会有跨域问题

iframe一般用来包含别的页面，例如我们可以在我们自己的网站页面加载别人网站的内容

③ 同源限制

• 在上面的案例中，因为没有同源策略，所以其他网址可以获取主网址的dom
  

JSONP
<script src="http://test.com/data.php?callback=dosomething"></script>
// 向服务器test.com发出请求，该请求的查询字符串有一个callback参数，用来指定回调函数的名字// 处理服务器返回回调函数的数据
<script type="text/javascript">function dosomething(res){// 处理获得的数据console.log(res.data)}
</script>

6、cookie，localStorage，sessionStorage （客户端保存数据）

参考

① 记录用户登录状态方法（cookie、token、session）

这三个功能是干什么的：

• 在前后端通信数据传输的过程中，有的涉及到用户权限的问题，这时候就需要这个三个工具
  HTTP 协议是无状态的。但是随着 web 应用的发展，越来越多的场景需要标识用户身份。例如：单点登陆、购物车等等。而cookie、session 与 token，就是为了实现带有状态的“会话控制”

区别
cookie、 session与token的区别

• 一般cookie和session一起使用：cookie（在客户端记录状态）session:（在服务器端记录状态）
  问题：如果web服务器做了负载均衡（服务器不同），那么下一个操作请求到了另一台服务器的时候session会丢失。
• token：维持用户状态（前段与服务器之间存在跨域问题）

session and cookie

过程：
1、首先，客户端会发送一个http请求到服务器端
2、服务器端接受客户端请求后，建立一个session，并发送一个http响应到客户端，这个响应头，其中就包含Set-Cookie头部。
3、在客户端发起的第二次请求，假如服务器给了set-Cookie，浏览器会自动在请求头中添加cookie
4、服务器接收请求，分解cookie，验证信息，核对成功后返回response给客户端

• cookie
  

• session
  
  session“会话”，当用户打开某个web应用时，便与web服务器产生一次session。服务器使用session把用户的信息临时保存在了服务器上，用户离开网站后session会被销毁。相对cookie来说更安全（不用传输，不存在篡改和泄露），

token：
token是什么
CSRF跨站请求伪造

定义：

目的：Token的目的是为了减轻服务器的压力，减少频繁的查询数据库，使服务器更加健壮*（即解决session要一直查询数据库，负载均衡的问题）。适用于项目级的前后端分离(前后端代码运行在不同的服务器下) 请求登录时

②前端安全XSS、CSRF

cookie 和 token 都存放在 header 中，为什么不会劫持 token？

7、什么是Ajax

Ajax用来描述一种使用现有技术集合的‘新’方法，包括: HTML 或 XHTML, CSS, JavaScript, DOM, XML,以及最重要的XMLHttpRequest。 使用Ajax技术网页应用能够快速地将增量更新呈现在用户界面上，而不需要重载（刷新）整个页面，这使得程序能够更快地回应用户的操作。

XMLHttpRequest

8、预加载、懒加载