HTTP面试题部分1. WebSocket和HTTP的区别及原理？ WebSocket WebSocket他是为了解决客

1. WebSocket和HTTP的区别及原理？

WebSocket WebSocket他是为了解决客户端发起多个http请求到服务器资源浏览器必须要经过长时间的轮训问题而生的，他实现了多路复用，他是全双工通信。在webSocket协议下客服端和浏览器可以同时发送信息。（双向通信）

http协议是用在应用层的协议，他是基于tcp协议的，http协议建立链接也必须要有三次握手才能发送信息。客户端与服务器通信，必须要有客户端发起然后服务器返回结果。（单项通信）

2.http和https的区别？

①http是超文本传输协议，信息是明文传输，https则是具有安全性的ssl加密传输协议。

②http和https使用的是完全不同的连接方式，用的端口也不一样，前者是80，后者是443。

③http的连接很简单，是无状态的；HTTPS协议是由SSL+HTTP协议构建的可进行加密传输、身份认证的网络协议，比http协议安全。

3.cookie和SessionStorage、Local Storage的区别？

1）生命周期：Cookie：可设置失效时间，否则默认为关闭浏览器后失效

Localstorage:除非被手动清除，否则永久保存

Sessionstorage：仅在当前网页会话下有效，关闭页面或浏览器后就会被清除

2）存放数据：

Cookie：4k左右

Localstorage和Sessionstorage：可以保存5M的信息

3）http请求：

Cookie：每次都会携带在http头中，如果使用cookie保存过多数据会带来性能问题

Localstorage和Sessionstorage：仅在客户端即浏览器中保存，不参与和服务器的通信

4）应用场景：

从安全性来说，因为每次http请求都回携带cookie信息，这样子浪费了带宽，所以cookie应该尽可能的少用，此外cookie还需要指定作用域，不可以跨域调用，限制很多，但是用户识别用户登陆来说，cookie还是比storage好用，其他情况下可以用storage，localstorage可以用来在页面传递参数，sessionstorage可以用来保存一些临时的数据，防止用户刷新页面后丢失了一些参数。

4.token存在哪里？

当你登陆成功后，系统会生成要给token并发给你，token需要客户端保存，每次交互的时候把token带上，一般放在header里。 HTML5的话一般有WebStorage(localStorage)做保存，后端redis会设置失效时间为一周

5.http的请求状态码？

200 OK 请求成功。一般用于GET与POST请求 300 （多种选择）服务器根据请求可执行多种操作。服务器可根据请求者来选择一项操作，或提供操作列表供其选择。

301 永久性重定向

302 临时重定向

304 Not Modified 未修改。所请求的资源未修改，服务器返回此状态码时，不会返回任何资源。客户端通常会缓存访问过的资源，通过提供一个头信息指出客户端希望只返回在指定日期之后修改的资源

400 （错误请求）服务器不理解请求的语法

403 Forbidden 服务器理解请求客户端的请求，但是拒绝执行此请求

404 Not Found 服务器无法根据客户端的请求找到资源（网页）。通过此代码，网站设计人员可设置"您所请求的资源无法找到"的个性页面

405 Method Not Allowed 客户端请求中的方法被禁止

500 Internal Server Error 服务器内部错误，无法完成请求

6.在地址栏里输入一个URL,到这个页面呈现出来，中间会发生什么？

①　DNS域名解析，获取相应的IP地址

②　浏览器向服务器发送tcp连接，与浏览器建立三次握手

③　握手成功后，建立http请求

④　服务器收到请求，将数据返回至浏览器

⑤　浏览器解析渲染页面（将DOM与CSSOM组合成Render-tree（渲染树））

⑥　关闭TCP连接

7.浏览器在生成页面的时候，会生成那两颗树？

构造两棵树，DOM树和CSSOM规则树当浏览器接收到服务器相应来的HTML文档后，会遍历文档节点，生成DOM树， CSSOM规则树由浏览器解析CSS文件生成，

8.跨域如何实现？

JSONP(JSON with Padding) 是一种跨域请求方式。主要原理是利用了script 标签可以跨域请求的特性，由其 src 属性发送请求到服务器，服务器返回 JavaScript 代码，浏览器接受响应，然后就直接执行了，这和通过 script 标签引用外部文件的原理是一样的。

JSONP由两部分组成：回调函数和数据，回调函数一般是在浏览器控制，作为参数发往服务器端（当然，你也可以固定回调函数的名字，但客户端和服务器端的名称一定要一致）。当服务器响应时，服务器端就会把该函数和数据拼成字符串返回。

JSONP的请求过程：

请求阶段：浏览器创建一个 script 标签，并给其src 赋值 (类似 http://example.com/api/?callback=jsonpCallback）。

发送请求：当给script的src赋值时，浏览器就会发起一个请求。

数据响应：服务端将要返回的数据作为参数和函数名称拼接在一起(格式类似”jsonpCallback({name: 'abc'})”)返回。当浏览器接收到了响应数据，由于发起请求的是 script，所以相当于直接调用 jsonpCallback 方法，并且传入了一个参数。

CORS（Cross-Origin Resource Sharing）跨域资源共享，定义了必须在访问跨域资源时，浏览器与服务器应该如何沟通。CORS背后的基本思想就是使用自定义的HTTP头部让浏览器与服务器进行沟通，从而决定请求或响应是应该成功还是失败。实现CORS通信的关键是服务器。只要服务器实现了CORS接口，就可以跨源通信。

CORS和JSONP对比

JSONP只能实现GET请求，而CORS支持所有类型的HTTP请求。
使用CORS，开发者可以使用普通的XMLHttpRequest发起请求和获得数据，比起JSONP有更好的错误处理。
JSONP主要被老的浏览器支持，它们往往不支持CORS，而绝大多数现代浏览器都已经支持了CORS）。

附加：

如何

实现一个

ajax？

①　创建XMLHttpRequest对象,也就是创建一个异步调用对象 ②　创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息 ③　设置响应HTTP请求状态变化的函数 ④　发送HTTP请求 ⑤　获取异步调用返回的数据 ⑥　使用JavaScript和DOM实现局部刷新

Ui规范？

统一设定的页面的宽度高度，主色、辅助色；按钮大小；弹框大小；内边距外边距等。