全栈开发经验

1、请列举网站开发的多种模式

WebFrom、MVC、前后端分离（后端 Restful API，前端使用前端框架，例如Angular、React、Vue）。

2、列举前后端分离和非前后端分离的区别以及各自的优势

1、前后端不分离 

在前后端不分离的开发模式中，前端页面看到的效果都是由后端控制，由后端渲染页面或重定向，也就是后端需要控制前端的展示，前端与后端的耦合度很高。

这种开发模式比较适合纯网页应用，但是当后端对接App时，App可能并不需要后端返回一个HTML网页，而仅仅是数据本身，所以后端原本返回网页的接口不在适用于前端App应用，为了对接App，后端还需要在开发一套接口。

2、前后端分离

术业有专攻，前端做前端的，后端做后端的。

服务器一分为二，前后端分别部署，静态资源放在前端服务器，业务代码放在后端服务器。前端服务器需要接收HTTP请求。前端服务器需要进行视图解析（可以使用Vue.js、Angular）。前端服务器需要处理路由（也就是页面之间的跳转）。后端服务器只负责返回数据给前端。

3、谈谈为什么现在大部分企业都选择前后端分离模式开发项目

其实这还是由前后端分离后的优势决定的：术业有专攻，前端做前端的，后端做后端的。服务器一分为二，前后端分别部署，静态资源放在前端服务器，业务代码放在后端服务器。前端服务器需要接收HTTP请求。前端服务器需要进行视图解析（可以使用Vue.js、Angular）。前端服务器需要处理路由（也就是页面之间的跳转）。后端服务器只负责返回数据给前端。

4、请列举前后端分离项目中为什么会出现跨域问题

因为同源策略。跨域问题来源于JavaScript的同源策略，即只有协议+主机名+端口号（如存在）相同，则允许相互访问。也就是说，JavaScript只能访问和操作自己域下的资源，不能访问和操作其它与下面的资源。跨域问题是针对JS和Ajax的，HTML本身没有跨域问题，比如a标签，script标签，甚至form标签（可以直接跨域发送数据并接收数据）等。

5、请列举跨域问题的多种解决方案。以及各自的特点

第一种：服务器执行请求过来以后，允许你跨域；其实服务器设置响应头：response.setHeader("Access-Control-Allow-Origin", "*")。

第二种：jsonp的方式。注意：这种方式只能发送get请求。就算指定为post，最后发送的还是get，且跟上面方式一样，也需要服务器的配合支持。jsonp发送的并不是ajax请求；利用动态创建一个script标签，因为script标签是没有同源策略限制的，是可以跨域的； 把这个script标签的src指向我们请求的服务端地址，这个地址会携带一个参数：callback ,一个回调函数，服务端会把数据通过这个回调函数返回给客户端，但是客户端没有这个函数怎么接收呢？所以在发送请求之前，要在全局（window）注册这样一个方法，利用这个方法，来获得数据； 这个回调函数名需要跟服务端约定好，是一致的。例如：

<script>
         //指定的回调函数
         function showData (result) {
             var data = JSON.stringify(result); //json对象转成字符串
             $("#text").val(data);
         }
 
         $(document).ready(function () {
 
             $("#btn").click(function () {
                 //向头部输入一个脚本，该脚本发起一个跨域请求
                 $("head").append("<script src='http://localhost:9090/student?callback=showData'></script>");
             });
 
         });
</script>

第三种：代理服务器，跨域问题是浏览器的同源策略限制，服务器之间是没有的，那我们先把请求给我们的代理服务器，再让我们的代理服务器去调用这个接口，在发送给前端就可以了。

第四种：在后端代码里面设置。比如ASP.NET Web API或者ASP.NET Core Web API里面都可以设置。

6、请列举前后端分离项目中，有哪些权限验证方法，就你了解的方式中选择两种加以介绍

现在常用的是请求加上用户名和密码实时验证、Token验证；

用户名和密码实时验证：client发生username和password到server。server验证成功以后。写cookie到client，然后返回OK的JSON，其中cookie的key要存储在Redis中，value就是用户信息。并且要设置key的超时时间，例如10分钟。client收到ok后, 进行相应的业务操作, 以后每次请求server都会自动带上cookie, 不用你写代码；server端的filter(你肯定用filter来实现)中会每次验证传过来的cookie的key在redis中是否存在, 有就代表登录成功过可以操作, 没有就返回错误标识。

注意: 在登录成功后, 每次调用服务器接口时候, 都要为redis的key进行续期,如60分钟。

当redis的key超过60分钟, 自己会删除这个key, 那么再次请求server时, 就会收到需要登录的返回值。当用户主动退出系统的时候, 也要在server中删除redis的key。

Token方式。

token一般用来做显示的身份验证, 比如手机验证码之类的, 这些都需要手动传递token到后台。在client点击验证码，server发送验证码,返回给client一个token，在client对验证码进行验证,传递token + 验证码到server，

server对token+验证码进行验证。

7、在前后端分离项目中，请求方式一般为ajax 请求，请解读ajax 请求的特点

Ajax优势：

1. 最大的一点是页面无刷新，在页面内与服务器通信，给用户的体验非常好。

2. 使用异步方式与服务器通信，不需要打断用户的操作，具有更加迅速的响应能力。

3. 可以把以前一些服务器负担的工作转嫁到客户端，利用客户端闲置的能力来处理，减轻服务器和带宽的负担，节约空间和宽带租用成本。并且减轻服务器的负担，ajax的原则是“按需取数据”，可以最大程度的减少冗余请求，和响应对服务器造成的负担。

4. 基于标准化的并被广泛支持的技术，不需要下载插件或者小程序。

Ajax局限：

1. ajax干掉了back按钮，即对浏览器后退机制的破坏。后退按钮是一个标准的web站点的重要功能，但是它没法和js进行很好的合作。这是ajax所带来的一个比较严重的问题，因为用户往往是希望能够通过后退来取消前一次操作的。那么对于这个问题有没有办法？答案是肯定的，用过Gmail的知道，Gmail下面采用的ajax技术解决了这个问题，在Gmail下面是可以后退的，但是，它也并不能改变ajax的机制，它只是采用的一个比较笨但是有效的办法，即用户单击后退按钮访问历史记录时，通过创建或使用一个隐藏的IFRAME来重现页面上的变更。（例如，当用户在Google Maps中单击后退时，它在一个隐藏的IFRAME中进行搜索，然后将搜索结果反映到Ajax元素上，以便将应用程序状态恢复到当时的状态。）。但是，虽然说这个问题是可以解决的，但是它所带来的开发成本是非常高的，和ajax框架所要求的快速开发是相背离的。这是ajax所带来的一个非常严重的问题。

2. 安全问题。技术同时也对IT企业带来了新的安全威胁，ajax技术就如同对企业数据建立了一个直接通道。这使得开发者在不经意间会暴露比以前更多的数据和服务器逻辑。ajax的逻辑可以对客户端的安全扫描技术隐藏起来，允许黑客从远端服务器上建立新的攻击。还有ajax也难以避免一些已知的安全弱点，诸如跨站点脚步攻击、SQL注入攻击和基于credentials的安全漏洞等。

3. 对搜索引擎的支持比较弱。

4. 破坏了程序的异常机制。至少从目前看来，像ajax.dll，ajaxpro.dll这些ajax框架是会破坏程序的异常机制的。关于这个问题，我曾经在开发过程中遇到过，但是查了一下网上几乎没有相关的介绍。后来我自己做了一次试验，分别采用ajax和传统的form提交的模式来删除一条数据……给我们的调试带来了很大的困难。

5. 另外，像其他方面的一些问题，比如说违背了url和资源定位的初衷。例如，我给你一个url地址，如果采用了ajax技术，也许你在该url地址下面看到的和我在这个url地址下看到的内容是不同的。这个和资源定位的初衷是相背离的。

6. 一些手持设备（如手机、PDA等）现在还不能很好的支持ajax，比如说我们在手机的浏览器上打开采用ajax技术的网站时，它目前是不支持的，当然，这个问题和我们没太多关系。

8、浅谈Ajax和axios的区别

区别：axios是通过promise实现对ajax技术的一种封装，就像jQuery实现ajax封装一样。简单来说： ajax技术实现了网页的局部数据刷新，axios实现了对ajax的封装。axios是ajax ajax不止axios。

Ajax：本身是针对MVC的编程,不符合现在前端MVVM的浪潮。基于原生的XHR开发，XHR本身的架构不清晰，已经有了fetch的替代方案。JQuery整个项目太大，单纯使用ajax却要引入整个JQuery非常的不合理（采取个性化打包的方案又不能享受CDN服务）。

axios：从 node.js 创建 http 请求。支持 Promise API。客户端支持防止CSRF。提供了一些并发请求的接口（重要，方便了很多的操作）。

9、如果一个前后端分离项目在运行的时候发生异常，请谈谈你的排错步骤

建议在开发的时候使用谷歌浏览器，调试测试方便！可以直接查看浏览器network，确定是某一个接口报错！根据报错的状态码；查看异常事件，如果接口方有日志、直接查看日志；选择性调整；

10、列举你了解到的调试请求接口的工具

1. webService接口：是走soap协议通过http传输，请求报文和返回报文都是xml格式的，我们在测试的时候都用通过工具才能进行调用，测试。可以使用的工具有SoapUI、jmeter、loadrunner等；
2. http api接口：是走http协议，通过路径来区分调用的方法，请求报文都是key-value形式的，返回报文一般都是json串，有get和post等方法，这也是最常用的两种请求方式。可以使用的工具有postman、RESTClient、jmeter、loadrunner等；

11、一个前后端项目如果在运行的时候,某一个功能在使用的时候，很卡顿，让你定位问题，你会如何做？

可以直接通过浏览器Network查看到是那个接口在请求的时候耗时间，然后有针对性的优化接口；

12、请谈谈Vue和Jquery的区别

vue和jquey对比 jQuery是使用选择器（）选取DOM对象，对其进行赋值、取值、事件绑定等操作，其实和原生的HTML的区别只在于可以更方便的选取和操作DOM对象，而数据和界面是在一起的。比如需要获取label标签的内容：(“lable”).val();,它还是依赖DOM元素的值。 Vue则是通过Vue对象将数据和View完全分离开来了。对数据进行操作不再需要引用相应的DOM对象，可以说数据和View是分离的，他们通过Vue对象这个vm实现相互的绑定。这就是传说中的MVVM。

13、谈谈对Post 请求和Get 请求的理解；二者如何选取应用！

GET传递的参数只能带URL后面，文本格式QueryString，各浏览器一般有长度限制，一般认为是2083，如果有中文字符更短。提交到服务器端的数据量小。

POST可以传递application/x-www-form-urlencoded的类似QueryString、multipart/form-data的二进制报文格式（支持文件信息嵌入报文传输）、纯文本或二进制的body参数。提交到服务器端的数据量大。

14、谈谈WebApi/WebService/WCF三者的特点。

Web Service：

1. 它是基于SOAP协议的，数据格式是XML　　
2. 只支持HTTP协议　　
3. 它不是开源的，但可以被任意一个了解XML的人使用　　
4. 它只能部署在IIS上　

WCF　　

1. 这个也是基于SOAP的，数据格式是XML　　
2. 这个是Web Service（ASMX）的进化版，可以支持各种各样的协议，像TCP，HTTP，HTTPS，Named Pipes, MSMQ.　　
3. WCF的主要问题是，它配置起来特别的繁琐　　
4. 它不是开源的，但可以被任意一个了解XML的人使用　　
5. 它可以部署应用程序中或者IIS上或者Windows服务中　

Web API：　

1. 这是一个简单的构建HTTP服务的新框架　　
2. 在.net平台上Web API 是一个开源的、理想的、构建REST-ful 服务的技术　　
3. 不像WCF REST Service.它可以使用HTTP的全部特点（比如URIs、request/response头，缓存，版本控制，多种内容格式）　　
4. 它也支持MVC的特征，像路由、控制器、action、filter、模型绑定、控制反转（IOC）或依赖注入（DI），单元测试。这些可以使程序更简单、更健壮　　
5. 它可以部署在应用程序和IIS上　　
6. 这是一个轻量级的框架，并且对限制带宽的设备，比如智能手机等支持的很好　　
7. Response可以被Web API的MediaTypeFormatter转换成Json、XML 或者任何你想转换的格式。

15、前后端项目中，在请求服务器时候，发现请求的数据量比较大，如何优化？

可以选择数据压缩；常见的数据压缩像gzip;