美文网首页笔试&&面试经验前端攻城狮Web前端之路
整理前端面试题(十二):HTTP和Ajax面试题

整理前端面试题(十二):HTTP和Ajax面试题

作者: 熠辉web3 | 来源:发表于2017-09-02 23:21 被阅读880次
    200ok.png

    1. 解释jsonp的原理,以及为什么不是真正的ajax.

    1. JSONP 的原理:通过<script>标签向服务器发送请求,将前端函数名称作为参数传递到服务器,服务器接收到请求后将 JSON 数据作为该方法的参数,返回 JavaScript 文本,前端方法就可以拿到数据。
    2. ajax是异步的,jsonp是同步的,所以它并不是真正的ajax

    2. 请描述一下cookies,sessionStorage和localStorage的区别?

    • sessionStorage用于本地存储一个会话(session)中的数据,这些数据只有在同一个会话中的页面才能访问并且当会话结束后数据也随之销毁. 因此sessionStorage不是一种持久化的本地存储,仅仅是会话级别的存储.

    • localStorage用于持久化的本地存储,除非主动删除数据,否则数据是永远不会过期的。

    • Cookie的大小是受限的,并且每次你请求一个新的页面的时候Cookie都会被发送过去,这样无形中浪费了带宽,另外cookie还需要指定作用域,不可以跨域调用。

    • 除此之外,Web Storage拥有setItem,getItem,removeItem,clear等方法,不像cookie需要前端开发者自己封装setCookie,getCookie。但是Cookie也是不可以或缺的:Cookie的作用是与服务器进行交互,作为HTTP规范的一部分而存在 ,而Web Storage仅仅是为了在本地“存储”数据而生。


    3. 如何解决跨域问题?

    • JSOP跨域
    • CROS跨域
    • 反向代理

    4. 简述ajax 的过程

    1. 创建XMLHttpRequest对象,也就是创建一个异步调用对象
    2. 创建一个新的HTTP请求,并指定该HTTP请求的方法、URL及验证信息
    3. 设置响应HTTP请求状态变化的函数
    4. 发送HTTP请求
    5. 获取异步调用返回的数据
    6. 使用JavaScript和DOM实现局部刷新

    5. http常见的状态码有那些?分别代表是什么意思?

    200 - 请求成功
    301 - 资源(网页等)被永久转移到其它URL
    404 - 请求的资源(网页等)不存在
    500 - 内部服务器错误


    6. 一个页面从输入 URL 到页面加载显示完成,这个过程中都发生了什么?

    分为以下4个步骤:

    1.当发送一个 URL 请求时,不管这个 URL 是 Web 页面的 URL 还是 Web 页面上每个资源的 URL,浏览器都会开启一个线程来处理这个请求,同时在远程 DNS 服务器上启动一个 DNS 查询。这能使浏览器获得请求对应的 IP 地址。

    2.浏览器与远程 Web 服务器通过TCP三次握手协商来建立一个TCP/IP连接。该握手包括一个同步报文,一个同步-应答报文和一个应答报文,这三个报文在浏览器和服务器之间传递。该握手首先由客户端尝试建立起通信,而后服务器应答并接受客户端的请求,最后由客户端发出该请求已经被接受的报文。

    3.一旦 TCP/IP 连接建立,浏览器会通过该连接向远程服务器发送 HTTP 的GET请求。远程服务器找到资源并使用 HTTP 响应返回该资源,值为 200 的 HTTP 响应状态表示一个正确的响应。

    4.此时,Web 服务器提供资源服务,客户端开始下载资源。


    7. 当我们通过Ajax拿到服务器返回的JSON格式的数据时,该如何转换成对象的形式?

    使用JSON.parse()方法


    8. jQuery中的全局Ajax事件有哪些?

    • ajaxComplete()
    • ajaxError()
    • ajaxSend()
    • ajaxStart()
    • ajaxStop()
    • ajaxSuccess()

    详情请参考jQuery文档: Category: Global Ajax Event Handlers


    9. HTTP协议目前常用的有哪几个?KEEPALIVE从哪个版本开始出现的?

    HTTP协议目前常用的有1.0和1.1版本, KEEPALIVE是1.1版本才开始出现的

    • 现在1.1版本默认支持KEEPALIVE
    • -HTTP1.0需要在request中增加“Connection:keep-alive” header才能够支持

    10.请列举出几个你所知道的模板引擎?

    相关文章

      网友评论

      • hzrWeber:补充一下,之前面试遇到跨域的方式,面试官提到H5的方式,本来萌了,后来回想H5提供了一个叫postmessage的接口也可以解决跨域问题
        熠辉web3: @前端空城师 多谢,学习到了
      • 目隐的演绎者:2/10,9月3号2017年
        目隐的演绎者:@Lee_tanghui :relieved:10道题只知道两道
        熠辉web3: @目隐的演绎者 嗯,什么暗号😳
      • 现象888:CROS,
        1.0默认支持
        熠辉web3: @现象888 Get👍👍👍

      本文标题:整理前端面试题(十二):HTTP和Ajax面试题

      本文链接:https://www.haomeiwen.com/subject/avcdjxtx.html