background:自学了差不多六个月左右的前端,商科相关专业。11月20号左右抱着试试的心态投了简历,反反复复被捞了几次,因为基础不是很好所以还是没拿到offer,但是收获很多。 问的问题都是比较基础常规的,但是俺太菜了,没答好
面试总结
-
首先你先介绍一下自己吧
-
你是非计算机相关专业的,平时有看过什么成体系的计算机相关的书吗?
-
讲讲注册功能的安全性问题。(项目相关)
1)强制让用户使用高强度密码,限制用户使用弱口令。在密码长度/复杂度方面进行限制。利用了Element UI 里一个自带的校验设置了密码规则
password: [{
validator: (rule, value: string, callback) => {
if (value === '') {
callback(new Error('请输入密码'))
} else {
if (value.length < 8 || value.length > 15) {
callback(new Error('请输入8-15位的密码'))
}
if (this.formModel.checkPassword !== '') {
this.$refs.formModel.validateField('checkPassword')
}
callback()
}
在用户注册时,我们应强制用户使用高强度的密码,禁止用户使用纯数字或者简单的滚键盘方式输入密码,或者我们可以参考弱口令排行来限制用户使用弱口令。安全的密码规则包括:密码长度不得低于八位、密码必须包含大小写字母和数字等。
2)用户提交邮箱和密码采用post方法,post将参数存在请求体中,安全性更高一些,同时采用了 Https 进行加密传输。
3)密码保存,应当使用 hash + salt 的方式进行加密保存。为了防止彩虹表破解,要加一个“Salt”,“Salt”是一个字符串,它的作用是为了增加明文的复杂度,并能使得彩虹表一类的攻击失效。
4)记录注册时的设备信息和IP,判断设备是否是该用户常用设备。
- 注册、验证功能是怎样一个流程(项目)
用户通过邮箱注册,在注册页面有一个表单,用户通过邮箱注册。提交成功后,用户会收到一个验证链接,验证链接是含有用户邮箱参数的,验证链接指向验证页面,验证页面有一个输入框,用户通过这个输入框输入自己的用户名,后端验证用户名和邮箱是否匹配,匹配上了就注册成功了。
-
讲讲 XSS、SQL注入(后端安全问题) 等web安全相关知识
XSS 通常指黑客通过“HTML注入”篡改了网页,插入了恶意的脚本,从而在用户浏览网页时,控制用户浏览器的一种攻击。XSS 攻击可以分为三种,反射型、存储型和DOM BASE型。 SQL注入和XSS相似// -
你是用 Typescript 进行开发的,问一些 Typescript 基础问题
接口:TypeScript的核心原则之一是对值所具有的结构进行类型检查。 在TypeScript里,接口的作用就是为这些类型命名和为你的代码或第三方代码定义契约。例如我写一个 export interface xxx { comment:string time: number } type用于取别名,类似于C语言中的define 类: 泛型: 函数: 类型推论: -
和后端是怎么对接的呢?
-
你们是采用的 HTTP 协议吗?http协议报文格式?
http协议报文分为两种,请求报文和响应报文。 请求报文包括请求行、请求头、请求体;其中请求头和请求体用空行来区分。请求行里包括请求方法、请求地址、协议版本;常见的请求方法有GET POST PUT DELETE 等;请求地址一般是URL;协议版本现在以1.1为主;2.0也在逐步推广中,3.0还在起步阶段。请求头用于传递附加信息,以键: 值为格式,常见的有Content-Type Content-length Cache-Control Host等;请求体主要可以分为三种:一种是 JSON 格式的;一种是URL中的 query String 格式,大概就是用键值对 并要求用&链接键值 还有一种是文件/表单上传时 用 boundary 分成单独的段 响应保文大体差不多,包括响应状态行、响应头、响应体;响应状态行最重要的是状态码。响应头和请求头有很多通用的东西,如 Content 相关的。响应体也就是网页的正文内容,一般在响应头中会用 Content-Length 来明确响应体的长度,便于浏览器接收,对于大数据量的正文信息,也会使用 chunked 的编码方式。 -
请求的长度限制?
http协议对post get这些没有长度限制。但是get请求传参是通过URL传参的,浏览器有长度限制。尽管post是通过请求体传参的,浏览器没有限制,但是后端不会接收太大的数据,也会进行一些限制。https://www.cnblogs.com/xdot/p/9177304.html -
太大的内容可不可以发送?怎么处理?
这里主要是指的 http 报文传输。
主要有三种处理方法:
1.压缩
2.分块传输 将大文件切成很多个小块,依次传输。
具体实现是在 response 响应报文里用头字段 Transfer-Encoding: chunked 来表示,表示报文里的 body 部分不是一次性发过来的,而是分成了许多的块(chunk)逐个发送。当 chunk 为 0 时说明是最后一个,传输结束。Transfer-Encoding 和 Content-Length 两个字段是互斥的,不能同时出现。一个响应报文的长度要么是已知的,要么是未知的。
3.范围请求:所谓的范围请求就是服务器通过设置响应头 Accept-Ranges:bytes 允许客户端在请求头里使用专用字段 range 来表示只获取文件的一部分。这样可以利用多线程让每个线程都只负责自己的传输范围。断点续传也是这个道理。
- http1.0,1.1,2.0,3.0特性,尤其keep-alive和2.0长连接
Http 1.0 在 0.9 的基础上增加了POST HEAD方法;HEAD 可以让客户端只获取HTTP请求头而不必获取资源本身。例如,范围请求的时候,可以先发个 HEAD,看服务器是否支持范围请求,同时获取文件的大小。POST 用于客户端向服务器传输数据。因为 get 是通过 URL 传参的,这会受到长度和内容的限制,同时,当我们传输类似账号密码这种参数时,相比 post 来说 get 也更不安全。同时还增加了首部,例如请求头和状态码这些。
HTTP 1.1 相比来说变化不大,更多是做了一些改进。例如增加了持久连接,只要任意一端没有明确提出断开连接,则保持 TCP 连接状态。还强制要求加host,HTTP请求行(如GET指令)中的URL不是一个包含绝对路径的URL(如http://www.example.com/section/page.html),而是一个只包含相对路径的URL(如/section/page.html)。在设计HTTP协议之初,一个Web服务器只能托管一个网站(但是这个网站上可以有很多部分和页面)。所以URL的主机名部分是不言自明的,因为在发送HTTP请求之前,用户肯定已经连接到了主机。如今,很多Web服务器上面有多个网站(虚拟主机托管),所以告诉服务器要访问哪个网站和访问哪个相对URL同样重要。此功能可以通过下面的方法实现:将HTTP请求中的URL修改为完整的包含绝对路径的URL。但如果采用这种方法,则很多现有的Web服务器和客户端都不能正常运行。所以,我们在请求首部中添加Host来实现该功能。
HTTP 2.0 较大的改变是增加了多路复用,实现了长连接。HTTP/2 单个链接可以有多个请求。不像在HTTP/1中,大多数浏览器只能并发6个请求。HTTP/2还变成了一个完全的二进制协议,HTTP消息被分成清晰定义的数据帧发送。所有的HTTP/2消息都使用分块的编码技术。
- HTTPS 具体介绍一下?
HTTP是明文传输,很可能遭受中间人攻击。HTTPS 在 HTTP 与 TCP 层之间加入了 SSL/TLS 协议。
客户端向服务器索要并验证服务器的公钥。
双方协商生产「会话秘钥」。
双方采用「会话秘钥」进行加密通信。
要密钥的加密过程是非对称加密( 密钥交换是非对称)
- tcp 协议有了解吗?三次握手为什么不能是两次握手?能解释一下吗?
客户端发送一个SYN,服务端回一个ACK+SYN;客户端发送一个ACK。为了确保服务端发送的数据完全被客户端接收了。为什么不是四次,是因为三次已经能保证传输对接完成,客户端还会等待2MSL确保完全接受,四次会浪费资源。
- int 表示的数据范围?
-
讲讲常见的状态码
-
浏览器机制有了解过吗?
event loop等相关
- 介绍一下浏览器缓存
强缓存 协商缓存
- 讲讲在浏览器里输入URL 会发生什么?
- 你用过 Jest 单元测试,那你平时是怎么设计的单元测试呢? 单元测试统计工具 覆盖率 UI层面的单元测试 button有没有正确渲染 click有没有正确触发
- 介绍一下Sass Less
- 常见的排序算法及分析
- 数组去重 数组扁平化
- 讲讲变量提升 作用域 闭包
- 常见的数组方法
- JS 的继承
-
CSS 掌握得怎么样?写一个垂直居中
-
常见的CSS单位
-
CSS 选择器的一些问题
-
HTML5 有什么新特性?
-
Webpack 打包工具,有自己配置过吗?
-
介绍一下 git 工作流
-
讲讲跨域?表单可以跨域吗?
跨域是基于浏览器的同源策略的。当两个URL的协议、域名、端口三种的其中一种不一致时,我们就认为跨域了。例如,一个采用http协议,另一个采用https协议是跨域,即使是两个域名指向同一个ip地址,也算是跨域;端口号不一致时也算跨域。表单是可以跨域的。因为限制跨域的原因是 限制ajax跨域的原因在于ajax网络请求是可以携带cookie的(通过设置withCredentials为true),比如用户打开了浏览器,登录了weibo.com,然后又打开了百度首页,这时候百度首页内的js,向weibo.com用withCredentials为true的ajax方式提交一个post请求,是会携带浏览器和weibo.com之间的cookie的,所以浏览器就默认禁止了ajax跨域,服务端必须设置CORS才可以。 而form提交是不会携带cookie的,你也没办法设置一个hidden的表单项,然后通过js拿到其他domain的cookie,因为cookie是基于域的,无法访问其他域的cookie,所以浏览器认为form提交到某个域,是无法利用浏览器和这个域之间建立的cookie和cookie中的session的,故而,浏览器没有限制表单提交的跨域问题。 -
开发中遇到问题,bug的调试方法 (断点调试)
-
用户浏览监测使用情况 什么时候上线的,用户当前访问,之类的功能 自己怎么做呢 (关键节点,触发页面功能,触发的记下来,比如说用户的token 线上工具)
-
怎么自己去写CI CD CI 过程会考虑什么东西?CI 触发的条件?构建过程中考虑的更多严谨性的东西
-
语法糖问题,你是怎么理解的
-
promise 问题 (ES6 有什么新特性?)
-
登录过程是怎么样的 登陆完了之后有没有校验 比如说我现在直接访问你登陆后的页面,后面的页面也没有校验,怎么解决这个问题。(非法跳转)token?具体怎么做呢?
-
Linux 常见命令
-
系统调用
-
网页怎么提升加载速度
-
讲讲CDN
-
Vue中组件的传值方式
-
key值的作用
-
vue 的 生命周期
-
你有什么要问我的吗?
因为我是非计算机相关专业的,所以关于非计算机专业如何更好地去学习计算机这方面问了一些问题,面试官都给了很好的建议和指导,非常感激。
主要是要重视基础,计算机专业课,以及一个框架/工具背后的原理和实现。另外作为一个前端对于后端也要有一定的掌握。校招更加重视基础,而不是技能掌握得多广。实战经验也很重要。