1、谈谈你对http协议的认识。

  1. HTTP协议(HyperText Transfer Protocol,超文本传输协议)是用于从WWW服务器传输超文本到本地浏览器的传送协议。它可以使浏览器更加高效,使网络传输减少。它不仅保证计算机正确快速地传输超文本文档,还确定传输文档中的哪一部分,以及哪部分内容首先显示(如文本先于图形)等。
  2. HTTP是一个应用层协议,由请求和响应构成,是一个标准的客户端服务器模型。HTTP是一个无状态的协议。端口号为80

2、谈谈你对websocket协议的认识。

  1. WebSocketHTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。
  2. WebSocket API中,浏览器和服务器只需要做一个握手的动作,然后,浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。
  3. 浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求,连接建立以后,客户端和服务器端就可以通过 TCP 连接直接交换数据。

3、什么是magic string ?

  1. 有触发时机在满足条件时自动触发就是魔术方法

4、如何创建响应式布局?

  1. 使用媒体查询的方式,创建多个元素宽度是相对的的布局理想的响应式布局是指的对PC/移动各种终端进行响应的
  2. @media (min-width: 768px){
  3. .pg-header{
  4. background-color: green;
  5. }
  6. }
  7. @media (min-width: 992px){
  8. .pg-header{
  9. background-color: pink;
  10. }
  11. }

5、你曾经使用过哪些前端框架?

  1. Bootstrap / vue / React

6、什么是ajax请求?并使用jQuery和XMLHttpRequest对象实现一个ajax请求。

  1. AJAX是在不加载整个页面的情况异步下与服务器发送请求交换数据并更新部分网页的艺术
  2. $.ajax({
  3. url:'user/add',//当前请求的url地址
  4. type:'get',//当前请求的方式 get post
  5. data:{id:100},//请求时发送的参数
  6. dataType:'json',//返回的数据类型
  7. success:function(data){
  8. //ajax请求成功后执行的代码
  9. console.log(data);
  10. },
  11. error:function(){
  12. //ajax执行失败后执行的代码
  13. alert('ajax执行错误');
  14. },
  15. timeout:2000,//设置当前请求的超时时间 异步请求生效
  16. async:true //是否异步 false同步 true异步
  17. })

7、如何在前端实现轮训?

  1. 轮询:客户端定时向服务器发送Ajax请求,服务器接到请求后马上返回响应信息并关闭连接。
  2. 优点:后端程序编写比较容易。 缺点:请求中有大半是无用,浪费带宽和服务器资源。 实例:适于小型应用。
  3. https://www.cnblogs.com/zhaowinter/p/5332681.html

8、如何在前端实现长轮训?

  1. 客户端向服务器发送Ajax请求,服务器接到请求后hold住连接,直到有新消息才返回响应信息并关闭连接,客户端处理完响应信息后再向服务器发送新的请求。
  2. 优点:在无消息的情况下不会频繁的请求,耗费资小。
  3. 缺点:服务器hold连接会消耗资源,返回数据顺序无保证,难于管理维护。 Comet异步的ashx
  4. 实例:WebQQHi网页版、Facebook IM

9、vuex的作用?

  1. 在使用库或框架时,需要注意一个「适用性」的问题。
  2. Vuex 或者说实现了 Flux 思想的库,解决了几个问题:
  3. 组件之间的数据通信
  4. 使用单向数据流的方式进行数据的中心化管理
  5. 为什么要解决这样的问题呢?其实是因为当程序逻辑过于复杂的时候,非中心化的数据管理会让整个 app 的逻辑非常混乱。
  6. 举一个不使用中心化的数据管理机制的具体例子:
  7. 一个 app ,有四个 tab,每个 tab 都需要读取用户的资料。如果数据在每个 tab 的控制器里(或者说组件里)都存了一份,那么在用户手动更新了用户资料之后,就需要在每一个 tab 里都更新一遍用户资料,才能保证用户看到的永远是最新的资料。
  8. 如你问题里所说,我每进一个 tab 的时候重新请求一下不就好了吗?
  9. 这样的解决方案不是不可以,但弊端也非常明显:
  10. 1) 对于服务器端来说,频繁的请求是非常占用资源的,如果你的 app 用户足够多,那么每多出一个请求,对公司来说,都是一大笔钱。如果数据存在了 store 中,并且所有的 tab 都读取同一份数据,在用户更新资料时,在前端更新了 store 中的数据,是不是在切换 tab 时就减少了四个请求呢?
  11. 2) 对于前端开发者来说,如果你的项目足够复杂,团队的规模也不仅是一个人,那么前端代码就会因为数据分散管理而产生非常严重的性能和稳定性的隐患(比如你的同事觉得进入模块就刷新用户资料太慢了,手贱把刷新的代码删了,你又没发现)。
  12. https://segmentfault.com/q/1010000011402824

10、vue中的路由的拦截器的作用?

  1. 判断每一个页面的http请求的状态获取内容做响应的处理
  2. vue-resourceinterceptors拦截器的作用正是解决此需求的妙方。在每次http的请求响应之后,如果设置了拦截器如下,会优先执行拦截器函数,获取响应体,然后才会决定是否把response返回给then进行接收

11、axios的作用?

  1. 在浏览器中发送 XMLHttpRequests 请求
  2. node.js 中发送 http请求
  3. 支持 Promise API
  4. 拦截请求和响应
  5. 转换请求和响应数据
  6. 自动转换 JSON 数据
  7. 客户端支持保护安全免受 XSRF 攻击

12、列举vue的常见指令。

  1. 条件判断使用 v-if指令
  2. 循环使用 v-for 指令。
  3. 事件监听可以使用 v-on 指令:

13、简述jsonp及实现原理?

  1. JSONP是用来解决跨域请求问题的
  2. 跨域:协议 域名 端口号有一个不一样就是跨域
  3. 实现原理:
  4. script标签src属性中的链接却可以访问跨域的js脚本,利用这个特性,服务端不再返回JSON格式的数据,而是返回一段调用某个函数的js代码,在src中进行了调用,这样实现了跨域。

14、是什么cors ?

  1. CORS 全称是跨域资源共享(Cross-Origin Resource Sharing),是一种 AJAX 跨域请求资源的方式,支持现代浏览器,IE支持10以上。

15、列举Http请求中常见的请求方式?

  1. GET:请求获取由 Request-URI 所标识的资源。
  2. POST:在 Request-URI 所标识的资源后附加新的数据。
  3. HEAD:请求获取由 Request-URI 所标识的资源的响应消息报头。
  4. OPTIONS:请求查询服务器的性能,或查询与资源相关的选项和需求。
  5. PUT:请求服务器存储一个资源,并用 Request-URI作为其标识。
  6. DELETE:请求服务器删除由 Request-URI所标识的资源。
  7. TRACE:请求服务器回送收到的请求信息,主要用语测试或诊断。
  8. CONNECTHTTP/1.1协议中预留给能够将连接改为管道方式的代理服务器。

16、列举Http请求中的状态码?

  1. 常见的响应状态码有以下几种,在各种下面分别列几个常见的状态码:
  2. 1开头(信息)
  3. 2开头(成功)
  4. 200OK):请求成功
  5. 202Accepted):已接受请求,尚未处理
  6. 204No Content):请求成功,且不需返回内容
  7. 3开头(重定向)
  8. 301Moved Permanently):被请求的资源已永久移动到新位置
  9. 301Moved Temporarily):被请求的资源已临时移动到新位置
  10. 4开头(客户端错误)
  11. 400Bad Request):请求的语义或是参数有错
  12. 403Forbidden):服务器拒绝了请求
  13. 404Not Found):未找到请求的资源
  14. 5开头(服务器错误)
  15. 500Internal Server Error):服务器遇到错误,无法完成请求
  16. 502Bad Getway):网关错误,一般是服务器压力过大导致连接超时
  17. 503Service Unavailable):服务器宕机

17、列举Http请求中常见的请求头?

  1. User-Agent:浏览器类型,如果Servlet返回的内容与浏览器类型有关则该值非常有用。
  2. Cookie:这是最重要的请求头信息之一
  3. Content-Type:请求类型

18、求结果

  1. <script>
  2. var name = Twiss;
  3. function func(){
  4. var name = Gkate;
  5. function inner(){
  6. alter(name)
  7. }
  8. return inner;
  9. }
  10. var ret = func();
  11. ret()
  12. </script>

19、求结果 alter(Gkate)

  1. <script>
  2. function main(){
  3. if(1==1){
  4. var name = Twiss;
  5. }
  6. console.log(name)
  7. }
  8. main()
  9. </script>

20、console.log(Twiss)

  1. <script>
  2. name = 'Twiss';
  3. function func(){
  4. var name = 'Gkate';
  5. function inner(){
  6. var name = 'Iran'
  7. console.log(name)
  8. }
  9. inner();
  10. }
  11. func();
  12. </script>

21、console.log(‘Iran’)

  1. <script>
  2. function foo(){
  3. console.log(name)
  4. var name = 'Twiss'
  5. }
  6. foo();
  7. </script>

22、undefine

  1. <script>
  2. var name ='twiss'
  3. function foo(){
  4. this.name = 'Gkate'
  5. this.func = function(){
  6. alter(name)
  7. }
  8. }
  9. var obj = new foo();
  10. obj.func();
  11. </script>

23、alter(‘Gkate’)

  1. var name ='twiss'
  2. function foo(){
  3. this.name = 'Gkate'
  4. this.func = function(){
  5. function(){
  6. alter(this.name)
  7. })
  8. }
  9. }
  10. var obj = new foo();
  11. obj.func();
  12. </script>

24、django、flask、tornado框架的比较?alter(Gkate)

  1. DjangoPython 界最全能的 web 开发框架,battery-include 各种功能完备,可维护性和开发速度一级棒。常有人说 Django 慢,其实主要慢在 Django ORM 与数据库的交互上,所以是否选用 Django,取决于项目对数据库交互的要求以及各种优化。而对于 Django 的同步特性导致吞吐量小的问题,其实可以通过 Celery 等解决,倒不是一个根本问题。Django 的项目代表:InstagramGuardian
  2. Tornado:天生异步,性能强悍是 Tornado 的名片,然而 Tornado 相比 Django 是较为原始的框架,诸多内容需要自己去处理。当然,随着项目越来越大,框架能够提供的功能占比越来越小,更多的内容需要团队自己去实现,而大项目往往需要性能的保证,这时候 Tornado 就是比较好的选择。Tornado项目代表:知乎。
  3. Flask:微框架的典范,号称 Python 代码写得最好的项目之一。Flask 的灵活性,也是双刃剑:能用好 Flask 的,可以做成 Pinterest,用不好就是灾难(显然对任何框架都是这样)。Flask 虽然是微框架,但是也可以做成规模化的 Flask。加上 Flask 可以自由选择自己的数据库交互组件(通常是 Flask-SQLAlchemy),而且加上 celery +redis 等异步特性以后,Flask 的性能相对 Tornado 也不逞多让,也许Flask 的灵活性可能是某些团队更需要的。

25、什么是wsgi?

  1. WSGIWeb Server Gateway InterfaceWeb 服务器网关接口)则是Python语言中1所定义的Web服务器和Web应用程序之间或框架之间的通用接口标准。
  2. WSGI就是一座桥梁,桥梁的一端称为服务端或网关端,另一端称为应用端或者框架端,WSGI的作用就是在协议之间进行转化。WSGIWeb组件分成了三类:Web 服务器(WSGI Server)、Web中间件(WSGI Middleware)与Web应用程序(WSGI Application)。
  3. Web Server接收HTTP请求,封装一系列环境变量,按照WSGI接口标准调用注册的WSGI Application,最后将响应返回给客户端。

26、django请求的生命周期?

  1. 前端请求—>nginx—>uwsgi.—>中间件—>url路由—->view试图—>orm—->拿到数据返回给view—->试图将数据渲染到模版中拿到字符串—->中间件—>uwsgi—->nginx—->前端渲染

27、列举django的内置组件?

  1. url viewmodeltemplate、中间件

28、列举django中间件的5个方法?以及django中间件的应用场景?

  1. process_request(self,request)
  2. process_view(self, request, callback, callback_args, callback_kwargs)
  3. process_exception(self, request, exception)
  4. process_response(self, request, response)
  5. 1 请求先执行所有中间件的process_request,然后做路由匹配,找到函数不执行。
  6. 2 再执行所有的process_view,在执行视图函数。
  7. 3 再执行process_response
  8. 4 如果程序报错执行process_exception
  9. 5 如果程序有render方法则执行process_template_response

29、简述什么是FBV和CBV?

  1. 1 FBV方式请求的过程
  2. 用户发送url请求,Django会依次遍历路由映射表中的所有记录,一旦路由映射表其中的一条匹配成功了,
  3. 就执行视图函数中对应的函数名,这是fbv的执行流程
  4. 2 CBV方式请求的过程
  5. 当服务端使用CBV模式的时候,用户发给服务端的请求包含urlmethod,这两个信息都是字符串类型
  6. 服务端通过路由映射表匹配成功后会自动去找dispatch方法,然后Django会通过dispatch反射的方式找到类中对应的方法并执行
  7. 类中的方法执行完毕之后,会把客户端想要的数据返回给dispatch方法,由dispatch方法把数据返回经客户端
  8. 把上面的例子中的视图函数修改成如下:
  9. from django.views import View
  10. class CBV(View):
  11. def dispatch(self, request, *args, **kwargs):
  12. print("dispatch......")
  13. res=super(CBV,self).dispatch(request,*args,**kwargs)
  14. return res
  15. def get(self,request):
  16. return render(request, "cbv.html")
  17. def post(self,request):
  18. return HttpResponse("cbv.get")
  19. 3 FBVCBV的区别?
  20. - 没什么区别,因为他们的本质都是函数。CBV的.as_view()返回的view函数,view函数中调用类的dispatch方法,在dispatch方法中通过反射执行get/post/delete/put等方法。
  21. - CBV比较简洁,GET/POST等业务功能分别放在不同get/post函数中。FBV自己做判断进行区分。

30、如何给CBV的程序添加装饰器?

  1. - 装饰器
  2. from django.views import View
  3. from django.utils.decorators import method_decorator
  4. def auth(func):
  5. def inner(*args,**kwargs):
  6. return func(*args,**kwargs)
  7. return inner
  8. class UserView(View):
  9. @method_decorator(auth)
  10. def get(self,request,*args,**kwargs):
  11. return HttpResponse('...')
  12. - csrf的装饰器要加到dispath
  13. from django.views import View
  14. from django.utils.decorators import method_decorator
  15. from django.views.decorators.csrf import csrf_exempt,csrf_protect
  16. class UserView(View):
  17. @method_decorator(csrf_exempt)
  18. def dispatch(self, request, *args, **kwargs):
  19. return HttpResponse('...')
  20. from django.views import View
  21. from django.utils.decorators import method_decorator
  22. from django.views.decorators.csrf import csrf_exempt,csrf_protect
  23. @method_decorator(csrf_exempt,name='dispatch')
  24. class UserView(View):
  25. def dispatch(self, request, *args, **kwargs):
  26. return HttpResponse('...')