2020年web前端⾯试题（⼀）
前⾔
由于新冠肺炎疫情，现在成天呆在家⾥，加上也要准备⾯试，就在家⾥看⾯试题，看着⽹上⼀堆⾯试题，决定收集常见题⽬汇总⼀下。关于⾯试⼤纲，我认为每个⼈都是千差万别的。因为⾯试官都是对简历所写的项⽬经验进⾏深挖或者对你所掌握的基本技能进⾏考察。
前端⼯程化
1什么是"前端⼯程化"？
前端⼯程化是使⽤软件⼯程的技术和⽅法来进⾏前端的开发流程、技术、⼯具、经验等规范化、标准化，其主要⽬的为了提⾼效率和降低成本，即提⾼开发过程中的开发效率，减少不必要的重复⼯作时间，⽽前端⼯程本质上是软件⼯程的⼀种，因此我们应该从软件⼯程的⾓度来研究前端⼯程。
2如何做"前端⼯程化"？
前端⼯程化就是为了让前端开发能够“⾃成体系”，个⼈认为主要应该从模块化、组件化、规范化、⾃动化四个⽅⾯思考。
前端设计模式
前端常见的设计模式主要有以下⼏种，具体设计模式查看这篇⽂章。
1. 单例模式
2. ⼯⼚模式
3. 策略模式
4. 代理模式
5. 观察者模式
6. 模块模式
7. 构造函数模式
8. 混合模式
前端安全性问题
这个是⽼的话题，有的在初中级前端⾯试中可能不会提到。但是在⾼级⾯试的时候，你要说出前端安全性问题防御，及前端常见安全性问题的攻击原理是什么。
1xss跨站脚本攻击原理？如何进⾏？防御⼿段？
如何进⾏
如何进⾏：如何XSS是指恶意攻击者利⽤⽹站没有对⽤户提交数据进⾏转义处理或者过滤不⾜的缺点，进⽽添加⼀些代码，嵌⼊到web页⾯中去。使别的⽤户访问都会执⾏相应的嵌⼊代码。从⽽盗取⽤户资料、利⽤⽤户⾝份进⾏某种动作或者对访问者进⾏病毒侵害的⼀种攻击⽅式。
主要原理
主要原理：过于信任客户端提交的数据！
网站模板翻译防御⼿段：不信任任何客户端提交的数据，只要是客户端提交的数据就应该先进⾏相应的过滤处理然后⽅可进⾏下⼀步的操作。
防御⼿段
web前端基础面试题2CSRF跨站请求伪造原理？如何进⾏？防御⼿段？
点击链接，会利⽤浏览器的cookie把密码改掉。
主要原理：在没有关闭相关⽹页的情况下，点击其他⼈发来的CSRF链接，利⽤客户端的cookie直接向服务器发送请求。
validationsummary控件与其他控件的区别主要原理
制作gifimgplay防御⼿段：
检测Referer
Anti-CSRF token机制
业务上要求⽤户输⼊原始密码（简单粗暴），攻击者在不知道原始密码的情况下，⽆论如何都⽆法进⾏CSRF攻击。
using namespace的作用是3Sql脚本注⼊原理？如何进⾏？防御⼿段？
如何进⾏：利⽤现有应⽤程序，将（恶意）的SQL命令注⼊到后台数据库引擎执⾏的能⼒，它可以通过在Web表单中输⼊（恶意）SQL语句得到如何进⾏
⼀个存在安全漏洞的⽹站上的数据库，⽽不是按照设计者意图去执⾏SQL语句。
主要原理：通过把SQL命令插⼊到Web表单提交或输⼊域名或页⾯请求的查询字符串，最终达到欺骗服务器执⾏恶意的SQL命令
主要原理
防御⼿段：
防御⼿段
使⽤预编译，绑定变量（推荐）。
检查数据类型。
过滤特殊字符和语句。
页⾯不错误回显。
4web上传漏洞原理？如何进⾏？防御⼿段？
如何进⾏：⽤户上传了⼀个可执⾏的脚本⽂件，并通过此脚本⽂件获得了执⾏服务器端命令的能⼒。
如何进⾏
主要原理：当⽂件上传时没有对⽂件的格式和上传⽤户做验证，导致任意⽤户可以上传任意⽂件，那么这就是⼀个上传漏洞。
主要原理
防御⼿段：
防御⼿段
1. 最有效的，将⽂件上传⽬录直接设置为不可执⾏，对于Linux⽽⾔，撤销其⽬录的'x'权限；实际中很多⼤型⽹站的上传应⽤都会放置在独⽴的存储上作为静态⽂件处理，⼀是⽅便使⽤缓存加速降低能耗，⼆是杜绝了脚本执⾏的可能性；
2. ⽂件类型检查：强烈推荐⽩名单⽅式，结合MIME Type、后缀检查等⽅式；此外对于图⽚的处理可以使⽤压缩函数或resize函数，处理图⽚的同时破坏其包含的HTML代码；
3. 使⽤随机数改写⽂件名和⽂件路径，使得⽤户不能轻易访问⾃⼰上传的⽂件；
4. 单独设置⽂件服务器的域名；
前端跨越问题
1什么是跨域？
由浏览器同源策略限制的⼀类请求场景，当不同地址，不同端⼝，不同级别，不同协议就会构成跨域。
2什么是同源策略？
所谓同源是指"协议+域名+端⼝"三者相同，即便两个不同的域名指向同⼀个ip地址，也⾮同源。
它是浏览器最核⼼也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。
3如何解决跨域？ 能说1，2，7，8就⾏。
1、 通过jsonp跨域
2、CORS
3、 document.domain + iframe跨域
4、 location.hash + iframe
5、 window.name + iframe跨域
6、 postMessage跨域
7、 nginx代理跨域
8、 nodejs中间件代理跨域
9、 WebSocket协议跨域
在这⾥我还是要推荐下我⾃⼰建的web前端开发学习：849574952，⾥都是学web前端开发的，如果你正在学习前端 ，⼩编欢迎你加⼊，今天分享的这个案例已经上传到⽂件，⼤家都是软件开发党，不定期分享⼲货（只有前端软件开发相关的），包括我⾃⼰整理的⼀份2020最新的前端进阶资料和⾼级开发教程，欢迎进阶中和进想深⼊前端的⼩伙伴。
前端数据加密问题
1⼀般如何处理⽤户敏感信息？
前端⼀般使⽤md5、base64加密、sha1加密，想要了解详情请⾃⾏百度。
前端http相关问题
长沙源码时代1HTTP常⽤状态码及其含义？
1xx：指⽰信息--表⽰请求已接收，继续处理
100 Continue 初始的请求已经接受，客户应当继续发送请求的其余部分。（HTTP 1.1新）
101 Switching Protocols 服务器将遵从客户的请求转换到另外⼀种协议（HTTP 1.1新）
2xx：成功--表⽰请求已被成功接收、理解、接受
200 OK ⼀切正常，对GET和POST请求的应答⽂档跟在后⾯。
201 Created 服务器已经创建了⽂档，Location头给出了它的URL。
202 Accepted 已经接受请求，但处理尚未完成。
203 Non-Authoritative Information ⽂档已经正常地返回，但⼀些应答头可能不正确，因为使⽤的是⽂档的拷贝（HTTP 1.1新）。
204 No Content 没有新⽂档，浏览器应该继续显⽰原来的⽂档。如果⽤户定期地刷新页⾯，⽽Servlet可以确定⽤户⽂档⾜够新，这个状态代码是很有⽤的。
205 Reset Content 没有新的内容，但浏览器应该重置它所显⽰的内容。⽤来强制浏览器清除表单输⼊内容（HTTP 1.1新）。
206 Partial Content 客户发送了⼀个带有Range头的GET请求，服务器完成了它（HTTP 1.1新）。
3xx：重定向--要完成请求必须进⾏更进⼀步的操作
300 Multiple Choices 客户请求的⽂档可以在多个位置到，这些位置已经在返回的⽂档内列出。如果服务器要提出优先选择，则应该在Location应答头指明。
301 Moved Permanently 客户请求的⽂档在其他地⽅，新的URL在Location头中给出，浏览器应该⾃动地访问新的URL。
303 See Other 类似于301/302，不同之处在于，如果原来的请求是POST，Location头指定的重定向⽬标⽂档应该通过GET提取（HTTP 1.1新）。
304 Not Modified 客户端有缓冲的⽂档并发出了⼀个条件性的请求（⼀般是提供If-Modified-Since头表⽰客户只想⽐指定⽇期更新的⽂档）。服务器告诉客户，原来缓冲的⽂档还可以继续使⽤。
305 Use Proxy 客户请求的⽂档应该通过Location头所指明的代理服务器提取（HTTP 1.1新）。
307 Temporary Redirect 和302（Found）相同。许多浏览器会错误地响应302应答进⾏重定向，即使原来的请求是POST，即使它实际上只能在POST请求的应答是303时 才能重定向。由于这个原因，HTTP 1.1新增了307，以便更加清除地区分⼏个状态代码：当出现303应答时，浏览器可以跟随重定向的GET和POST请求；如果是307应答，则浏览器只能跟随对GET请求的重定向。（HTTP 1.1新）
4xx：客户端错误--请求有语法错误或请求⽆法实现
400 Bad Request 请求出现语法错误。
401 Unauthorized 客户试图未经授权访问受密码保护的页⾯。应答中会包含⼀个WWW-Authenticate头，浏览器据此显⽰⽤户名字/密码对话框，然后在填写合适的Authorization头后再次发出请求。
403 Forbidden 资源不可⽤。服务器理解客户的请求，但拒绝处理它。通常由于服务器上⽂件或⽬录的权限设置导致。
404 Not Found ⽆法到指定位置的资源。这也是⼀个常⽤的应答。
405 Method Not Allowed 请求⽅法（GET、POST、HEAD、DELETE、PUT、TRACE等）对指定的资源不适⽤。（HTTP 1.1新）
406 Not Acceptable 指定的资源已经到，但它的MIME类型和客户在Accpet头中所指定的不兼容（HTTP 1.1新）。
407 Proxy Authentication Required 类似于401，表⽰客户必须先经过代理服务器的授权。（HTTP 1.1新）
408 Request Timeout 在服务器许可的等待时间内，客户⼀直没有发出任何请求。客户可以在以后重复同⼀请求。（HTTP 1.1新）
409 Conflict 通常和PUT请求有关。由于请求和资源的当前状态相冲突，因此请求不能成功。（HTTP 1.1新）
410 Gone 所请求的⽂档已经不再可⽤，⽽且服务器不知道应该重定向到哪⼀个地址。它和404的不同在于，返回407表⽰⽂档永久地离开了指定的位置，⽽404表⽰由于未知的原因⽂档不可⽤。（HTTP 1.1新）
411 Length Required 服务器不能处理请求，除⾮客户发送⼀个Content-Length头。（HTTP 1.1新）
412 Precondition Failed 请求头中指定的⼀些前提条件失败（HTTP 1.1新）。
413 Request Entity Too Large ⽬标⽂档的⼤⼩超过服务器当前愿意处理的⼤⼩。如果服务器认为⾃⼰能够稍后再处理该请求，则应该提供⼀个Retry-After头（HTTP 1.1新）。
414 Request URI Too Long URI太长（HTTP 1.1新）。
416 Requested Range Not Satisfiable 服务器不能满⾜客户在请求中指定的Range头。（HTTP 1.1新）
5xx：服务器端错误--服务器未能实现合法的请求
500 Internal Server Error 服务器遇到了意料不到的情况，不能完成客户的请求。
501 Not Implemented 服务器不⽀持实现请求所需要的功能。例如，客户发出了⼀个服务器不⽀持的PUT请求。
502 Bad Gateway 服务器作为⽹关或者代理时，为了完成请求访问下⼀个服务器，但该服务器返回了⾮法的应答。
503 Service Unavailable 服务器由于维护或者负载过重未能应答。例如，Servlet可能在数据库连接池已满的情况下返回503。服务器返回503时可以提供⼀个Retry-After头。
504 Gateway Timeout 由作为代理或⽹关的服务器使⽤，表⽰不能及时地从远程服务器获得应答。（HTTP 1.1新）505 HTTP Version Not Supported 服务器不⽀持请求中所指明的HTTP版本。（HTTP 1.1新）
2websocket和轮询及长轮询区别
轮询如下：
客户端：啦啦啦，有没有新信息(Request)服务端：没有（Response）客户端：啦啦啦，有没有新信息(Request)服务端：没有。。（Response）客户端：啦啦啦，有没有新信息(Request)服务端：你好烦啊，没有啊。。（Response）客户端：啦啦啦，有没有新消息（Request）服务端：好啦好啦，有啦给你。（Response）客户端：啦啦啦，有没有新消息（Request）服务端：。。。。。没。。。。没。。。没有（Response） ---- loop
长轮询如下：
客户端：啦啦啦，有没有新信息，没有的话就等有了才返回给我吧（Request）服务端：额。。 等待到有消息的时候。。来 给你（Response）客户端：啦啦啦，有没有新信息，没有的话就等有了才返回给我吧（Request） -loop
websocket如下：
版权声明：本站内容均来自互联网，仅供演示用，请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198，我们将在24小时内删除。
发表评论