前端名词解析

 1.进程和线程的区别

打比方来说进程就好像火车，线程好像火车车厢，线程是在进程下运行的，一个进程是包含了多个线程。不同进程之间的数据很难共享。同进程下不同线程数据，非常容易共享。进程比线程消耗的资源多。进程之间不会互相影响。但是一个线程挂掉会导致整个进程的挂掉。

3.渗透测试是啥

渗透测试就是模拟黑客对项目进行攻击，主要是测试项目安全防御能力的高低。

4.黑盒测试、白盒测试

黑：测试者对目标系统一无所知原情况下进行测试。也就是模拟大多数攻击者，从公司外部进行攻击。较白盒测试难度大，更耗费时间。

白：模拟产品用户的越权操作，检验项目的安全性。

5.ssrf安全漏洞——后端漏洞

SSRF (Server-Side Request Forgery，服务器端请求伪造) 是一种由攻击者构造请求，由服务端发起请求的安全漏洞，一般情况下，SSRF攻击的目标是外网无法访问的内网系统，也正因为请求是由服务端发起的，所以服务端能请求到与自身相连而与外网隔绝的内部系统。也就是说可以利用一个网络请求的服务，当作跳板进行攻击。

漏洞成因

1.服务端提供了从其他服务器应用获取数据的功能

2.没有对目标地址做过滤与限制

比如从指定URL地址获取网页文本内容，加载指定地址的图片，下载文件等等

 漏洞修复：

（1）使用地址白名单
（2）对返回内容进行识别
（3）需要使用互联网资源（比如贴吧使用网络图片）而无法使用白名单的情况：
首先禁用CURLOPT_FOLLOWLOCATION；然后通过域名获取目标ip，并过滤内部ip；最后识别返回的内容是否与假定内容一致

6.中间件

是一种独立的系统软件或服务程序，分布式应用软件借助这种软件在不同的技术之间共享资源。它位于客户机/服务器的操作系统之上，管理计算机资源和网络通讯，是连接两个独立应用程序或独立系统的软件

7.模块化

模块化就是如登录功能的代码集中放在一起，一个文件夹下包含着该模块的js,css和vue文件，一目了然便于维护，能复用的可以抽成组件或公共方法。

8.框架与库的区别

框架是结构化的，有架构思想在内，方便进行组件化和模块化开发

库是大大小小的工具的集合，简化代码，提供一些已封装的方法可以让开发者直接调用。

9.tomcat是啥

是一个轻量级的应用服务器，日常开发中依赖后端Java环境启动，启动后可做代理——与nginx功能类似，都能部署项目。需要部署的项目放到tomcat的根目录的webapps文件夹下，或在 tomcat/conf/server.xml文件里写虚拟路径

然后启动服务，就可以使用本机ip与端口去访问项目

10.为什么要进行域名解析

防止ip不固定，所以访问服务器资源要用域名，只要访问该域名，解析后自动访问现ip的地址去取数据，而不是每次ip一变就要告诉用户一次让别人手动改

Oray花生壳

No-IP

DynDNS

这三个都是常见的域名解析方式

12.从浏览器输入URL到页面加载完成的过程

首先浏览器查找本地是否有配置这个域名的ip，如果没有，就去DNS服务器上找。然后就是进行三次握手，4次挥手。像这一个请求在发起请求的地址进行TCP的三次握手。连接建立成功之后，服务器返回相应的数据，然后进行tcp的断开连接的四次挥手。然后就是浏览器引擎解析html文件，创建dom树，解析css，然后把css和DOM和并构建渲染树，然后就是布局和绘制渲染树。

13.关于模版语法与jsx语法

模版语法就是直接在template模版里写标签组成页面，而jsx语法则是写类似于innerHTML里 可解析的标签代码——富文本，最后通过render函数渲染页面。

14.前后端WebSocket通信

通过WebSocket，后端可以主动向前端发送数据，多用于IM聊天框、运动数据的统计、在线编辑、弹幕，实时更新信息。

 原生的webSocket主要是通过new WebSocket()方法与接口建立连接，然后使用其中的onError、onClose、onMessage、onOpen方法获取信息，使用WebSocket.send方法发送信息，使用过程中需要监听窗口状态，窗口关闭就断开连接。

Websocket只需要一次HTTP握手，所以说整个通讯过程是建立在一次连接/状态中，也就避免了HTTP的非状态性，服务端会一直知道你的信息，直到你关闭请求

15.一般是如何进行第三方登录授权

大体思路

首先，用户通过链接跳转至我方首页A之前，路由守卫检测到浏览器缓存中没有用户信息，根据甲方提供方法跳转至授权确认页面

当用户确认

立即跳到过渡页面B并把code拼成query参数，B拿到URL上的code参数后去调用获取token的接口一，拿到token后去获取云助理的用户信息——调用接口二，拿到云助理的用户信息调用我方的获取用户信息的接口三······存值最后实现登录，跳回我方首页A

当用户取消

来到过渡页B，B识别到url上没code，直接显示文案：您已取消授权，点击返回按钮回到云助理相关页面，点击去授权再次通过链接跳转至我方首页A·················

其他要做的：

每次进页面之前都通过前置路由守卫判断一下本地缓存中是不是有数据，根据甲方提供方法跳转至授权确认页面······过渡页面绕过路由守卫

---

16.vue2数组重写

Vue 的响应式是通过 Object.defineProperty() 实现的，这个 api 没办法监听数组长度的变化，也就没办法监听数组的新增。

Vue 无法检测通过数组索引改变数组的操作，这不是 Object.defineProperty() api 的原因，而是尤大认为性能消耗与带来的用户体验不成正比。对数组进行响应式检测会带来很大的性能消耗，因为数组项可能会大，比如1000条、10000条。

所以为了更友好的操作数组并触发响应式检测，Vue 重写了对数组引起副作用（改变原数组）的方法。

vue通过原型拦截的方式重写了数组的7个方法，首先获取到这个数组的Observer。如果有新的值，就调用observeArray对新的值进行监听，然后调用notify，通知render watcher，执行update

以push方法为例，是怎么修改的这个方法让它变得可以触发响应式检测

当调用 push 的时候手动触发了一次更新——ob.dep.notify()

17.关于css——margin塌陷（又名：穿透、击穿）高度塌陷的理解

高度塌陷是啥呢，是父子元素情况下，给子元素一个margin-top，发现这个样式让父元素移动了，不不不，我要的不是这个，为啥会出现这种情况呢，是因为两个元素贴合在了一起，在设置垂直移动样式margin-top或bottom时，渲染器识别会出现错误。

那么为了让样式正确生效，我们要把父子元素隔开，给父元素设置border、overflow:hidden、padding等方式都可以解决这个问题

18.解决17号问题用到了BFC块格式化

那么新的问题是css的BFC是啥，是通过css样式把当前元素独立出来，不被其他元素影响，清除浮动就用到了这个，如果我们给一个元素的子元素加了float属性，我们会发现这元素发生了高度塌陷的情况，啥是高度塌陷就是新知识点了等会说。

19.高度塌陷

当父元素不设置高度的时候靠子元素撑大，也就是说子元素有多高，父元素就有多高，当子元素浮动后，父元素就会高度塌陷。父元素高度塌陷后，父元素下面的元素就会向上移动，这样会导致整个页面的布局混乱。

浮动元素脱离了正常文档流，一般情况下，计算容器元素的高度时，是不考虑浮动元素的高度的。

20.为什么需要清除浮动

由于父盒子很多情况下，不方便给高度，但是子盒子浮动又不占有位置，即上文中写的不加入父元素高度计算，最后父级盒子高度为0时，就会影响下面的标准流盒子。

clear：both清除浮动并不能解决warp高度塌陷的问题

BFC的特点之一就是计算高度的时候会把内部浮动元素的高度也计算在内，所以能够实现BFC的就能够实现清除浮动

21.静态类型、动态类型、强类型、弱类型

编译时就知道变量类型的是静态类型；运行时才知道一个变量类型的叫做动态类型。

不允许隐式转换的是强类型，允许隐式转换的是弱类型。