精华内容
下载资源
问答
  • 浏览器请求与响应全过程详解

    千次阅读 2018-10-22 11:43:52
    3. 浏览器请求与响应全过程详解 前言 当在浏览器上输入一个网站链接时,它是如何运行将网页内容呈现在我们的浏览器上的呢? 本文旨在对www.yangoogle.com网页进行详细分析,了解浏览器展示内容的整个流程。下图是...

    3. 浏览器请求与响应全过程详解

    前言


    当在浏览器上输入一个网站链接时,它是如何运行将网页内容呈现在我们的浏览器上的呢?

    本文旨在对www.yangoogle.com网页进行详细分析,了解浏览器展示内容的整个流程。下图是在网上检索到一个较清晰的流程图,本文通过这张图进行展开讲解:

    • 首先,对输入的url进行DNS解析(找出对端服务器ip地址)
    • 通过ip地址,建立TCP请求(三次握手协议)
    • 发送HTTP请求与响应
    • 解析渲染服务端的响应数据
    • 断开TCP连接

    在这里插入图片描述

    流程

    1.解析域名(DNS查询)

    DNS(Domain Name System,域名系统)因特网上作为域名和IP(Internet Protocol Address)地址相互映射。

    优点:通过域名访问ip,可以不用记住繁杂的ip数字串。

    查询规则

    简单来说,一条域名的DNS记录会在本地有两种缓存:

    • 浏览器缓存
    • 操作系统(OS)缓存

    在浏览器中访问的时候,会优先访问浏览器缓存,如果未命中则访问OS缓存,最后再访问DNS服务器(一般是ISP提供),然后DNS服务器会递归式的查找域名记录,然后返回。

    查询浏览器缓存

    浏览器会缓存DNS记录,在chorme中,输入下面指令就可以查看:
    chrome://net-internals/#dns

    可以查询到yangoogle.com对应的ip地址(当前ip显示已经过期)

    在这里插入图片描述

    查询本地host文件

    当按下回车键起,一个HTTP请求就已经开始发出了。那么,浏览器首先要做的就是解析这个域名,通过本地的host文件(ps:推荐一款修改host文件的神器swtichhost)里面的ip地址查询。

    如下图,我将yangoogle.com域名对应的ip地址修改为本机地址(127.0.0.1)。当我访问**//www.yangoogle.com**之后,不出意外,结果显示404未找到该页面。

    在这里插入图片描述

    这是因为输入的域名(yangoogle.com),映射的ip地址(127.0.0.1)并没有找到正确的资源,因此会返回404。

    注意

    利用上面的特性,可以将任意域名映射到指定的ip地址上,这样就可以达到欺骗的目的。这也是常用的一种病毒手法。

    查询系统DNS缓存

    如果浏览器中还没有,就在系统缓存中查询:

    • mac 指令
    $ nslookup yangoogle
    

    在这里插入图片描述

    • windows 指令
    $ ipconfig /displaydns
    

    拓展

    DNS服务器

    如果上面查询到未得到匹配的ip地址,那么浏览器会想DNS服务器发送一条DNS查询的请求,流程如下:

    • 路由器缓存

    如果系统缓存中没有找到匹配的IP,那么接着会发送一条请求到路由器上,然后路由器在自己的缓存中匹配查询记录

    • ISP DNS缓存

    如果本地路由器也没有匹配到,这个请求就会发送到ISP(互联网服务器提供商,简称宽带运行商),ISP也有对应的DNS服务器。

    注意
    如果万恶的运营商对你查询的DNS服务器进行修改的话,跳转他们指定的页面上,或对你的网页注入广告之类的,这样他们就到达营收的目的。这也就是常见的DNS劫持

    • 递归查询

    如果连ISP的DNS服务器上都没有查询到的话,那么,你的ISP服务器会向根域名服务器进行搜索。根域名服务器是面向全球的顶级服务器(.com、.cn、.org等)。

    例如:我们要查询:test.yangoogle.com

    在ISP之前都没有查询到,在顶级DNS服务器上查询到

    1. 首先,匹配到.com一级域名服务器,请求转发到.com域名服务器。
    2. 然后,匹配到.yangoogle的二级域名服务器,请求接着转发到.yangoogle服务器。
    3. 最后,匹配到test这个三级域名的ip地址。
    • 多ip域名DNS查询

    有一种场景,就是一个域名对应多个ip地址(服务器地址)。

    这种方式的目的是为了解决DNS查询时间的问题:

    1. 循环DNS 多个ip列表循环返回DNS查询
    2. 负载均衡 设计一个特点的ip负载均衡服务器,负责监听请求并转发给后面多个服务器集群,实现多个服务器负载均衡。
    3. 地理DNS 根据用户的地理位置,按距离返回最近的ip地址

    在这里插入图片描述

    2.TCP连接

    在查询到域名对应的ip地址之后,,浏览器设置Remote Address,以及端口号port等信息。确保传输层的正常通信(即TCP正常连接)

    • 生成TCP数据包
    • 建立TCP连接
    1. 三次握手(HTTP)
    2. TSL握手(HTTPS)

    ip.src == 175.45.4.110 or ip.dst == xx.xx.xx.xx

    在这里插入图片描述

    在这里插入图片描述

    在这里插入图片描述

    3.发送http请求

    传输层通过已经建立完成,那么就准备发送http请求。

    在这里插入图片描述

    可以查询到http请求体的一些常见设置:

    • Request URL 定位请求资源位置
    • Request Method 请求方式
    • Status Code 状态码:200(服务器已经成功处理)
    • Remote Address (服务器ip地址)
    • Referrer-Policy 用户代理行为

    4.接收服务器响应

    在这里插入图片描述

    在服务器端接收来自浏览器的请求之后,服务端做出了相应的增删改查操作之后,返回相应的Content-Type。浏览器通过不同的Content-Type做出不同的解析。

    当我们请求一个.html类型的页面文件时,服务器端就将Content-Type设置为text/html

    同时,服务端也可以设置Cookie的过期时间(Expires),是否使用压缩(Content-Encoding)

    Etag 标识符

    Etag 是URL的Entity Tag,用于标示URL对象是否改变,区分不同语言和Session等等。具体内部含义是使服务器控制的,就像Cookie那样。

    在这里插入图片描述

    在这里插入图片描述

    5.解析

    在这里插入图片描述

    当服务端返回.html文件之后,接下来,浏览器就要对response的内容进行渲染

    let arr = []
    for (let item in document){ 
        arr.push(item)
    }
    
    console.log('dom',arr)
    

    Webkit有三个C++的类对应这三类文档,解析这三种文件会产生一个DOM Tree。

    • CSS,解析CSS会产生CSS规则树。

    • Javascript,主要是通过DOM API和CSSOM API来操作DOM Tree和CSS Rule Tree.

    • 解析HTML,生成DOM树
      通过对response进行词法分析,生成对应的AST。在解析HTML过程中,网页永远不会出现无效语法,因为浏览器本身具有一定的容错机制,会自动补全修复错误内容,然后继续解析。

    • 解析CSS

    根据css的词法和语法分析,挂载到全局的样式表对象中(CSS StyleSheet)

    • 解析JS

    因为浏览器的UI线程是单线程的:主要执行js执行和渲染界面。
    (js可以控制UI的绘制

    因此,当js处于加载中的状态时(padding),就会导致页面阻塞。阻塞期间,浏览器不会执行其他行为的,这就会出现一定时间的空白期。

    6.渲染

    解析完成后,浏览器引擎会通过DOM Tree 和 CSS Rule Tree 来构造 Rendering Tree。
    基本步骤:

    • 计算CSS样式
    • 构建Render Tree
    • Layout – 定位坐标和大小,是否换行,各种position, overflow, z-index属性
    • 开画

    在这里插入图片描述

    上图流程中有很多连接线,这表示了Javascript动态修改了DOM属性或是CSS属会导致重新Layout,有些改变不会,就是那些指到天上的箭头,比如,修改后的CSS rule没有被匹配到,等。

    DOM Tree里的每个结点都会有reflow方法,一个结点的reflow很有可能导致子结点,甚至父点以及同级结点的reflow。在一些高性能的电脑上也许还没什么,但是如果reflow发生在手机上,那么这个过程是非常痛苦和耗电的。 所以,下面这些动作有很大可能会是成本比较高的。

    • 当你增加、删除、修改DOM结点时,会导致Reflow或Repaint
    • 当你移动DOM的位置,或是搞个动画的时候。
    • 当你修改CSS样式的时候。
    • 当你Resize窗口的时候(移动端没有这个问题),或是滚动的时候。
    • 当你修改网页的默认字体时。
      注:display:none会触发reflow,而visibility:hidden只会触发repaint,因为没有发现位置变化。

    注意:

    1. 这里重要要说两个概念,一个是Reflow,另一个是Repaint。这两个不是一回事。

    Reflow的成本比Repaint的成本高得多的多。

    • Repaint —— 屏幕的一部分要重画,比如某个CSS的背景色变了。但是元素的几何尺寸没有变。

    • Reflow —— 意味着元件的几何尺寸变了,我们需要重新验证并计算Render Tree。是Render Tree的一部分或全部发生了变化。这就是Reflow,或是Layout。(HTML使用的是flow based layout,也就是流式布局,所以,如果某元件的几何尺寸发生了变化,需要重新布局,也就叫reflow)reflow 会从这个root frame开始递归往下,依次计算所有的结点几何尺寸和位置,在reflow过程中,可能会增加一些frame,比如一个文本字符串必需被包装起来。

    减少reflow/repaint

    • 不要一条一条地修改DOM的样式。与其这样,还不如预先定义好css的class,然后修改DOM的className。
    • 把DOM离线后修改
    // bad
    el.style.left = left + "px";
    el.style.top  = top  + "px";
    // good
    el.style.cssText += "; left: " + left + "px; top: " + top + "px;";
    
    • 不要把DOM结点的属性值放在一个循环里当成循环里的变量。不然这会导致大量地读写这个结点的属性。
    • 尽可能的修改层级比较低的DOM。当然,改变层级比较底的DOM有可能会造成大面积的reflow,但是也可能影响范围很小。
    • 为动画的HTML元件使用fixed或absoult的position,那么修改他们的CSS是不会reflow的。
    • 千万不要使用table布局。因为可能很小的一个小改动会造成整个table的重新布局。
    1. Rendering Tree 渲染树并不等同于DOM树,因为一些像Header或display:none的东西就没必要放在渲染树中了。
      CSS 的 Rule Tree主要是为了完成匹配并把CSS Rule附加上Rendering Tree上的每个Element。也就是DOM结点。也就是所谓的Frame。 然后,计算每个Frame(也就是每个Element)的位置,这又叫layout和reflow过程。
    2. 通过调用操作系统Native GUI的API绘制。

    服务器

    断开TCP连接

    • 根据Connection请求头,如果是keep-alive服务器就保持住tcp连接,如果没有或是close则服务器response传输完后主动关闭tcp连接。
    • 当然现在浏览器都是http1.1都默认是keep-alive的,在浏览器tab关闭时,tcp连接关闭。

    Tips

    浏览器

    查看版本号: chrome://version/
    显示性能指标直方图: about:histograms
    chrome://histograms/DNS
    查看dns缓存: chrome://net-internals/#dns

    chrome dns解析

    参考文章

    How Browsers Work
    How Browsers Render Work
    Google – Web Performance Best Practices
    知乎文章 推荐
    腾讯fex文章
    伯乐在线文章
    CSDN文章1
    CSDN文章2
    个人网站文章

    展开全文
  • HTTP协议详解--请求与响应

    千次阅读 2019-06-24 20:56:22
    ... 通常,由HTTP客户端发起一个请求,建立一个到服务器指定端口(默认是80端口)的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求,服务器(向客户端)发回一个状态行,比如"HTTP/1.1 2...

    一、什么是HTTP协议

    HTTP(超文本传输协议,HyperText Transfer Protocol)是互联网上应用最为广泛的一种网络协议。所有的WWW文件都必须遵守这个标准。
    通常,由HTTP客户端发起一个请求,建立一个到服务器指定端口(默认是80端口)的TCP连接。HTTP服务器则在那个端口监听客户端发送过来的请求。一旦收到请求,服务器(向客户端)发回一个状态行,比如"HTTP/1.1 200 OK",和(响应的)消息,消息的消息体可能是请求的文件、错误消息、或者其它一些信息。
    HTTP使用TCP而不是UDP的原因在于(打开)一个网页必须传送很多数据,而TCP协议提供传输控制,按顺序组织数据,和错误纠正。

    二、HTTPS协议

    HTTPS 协议(Hypertext Transfer Protocol over Secure Socket Layer)简单讲是 HTTP 的安全版, 在 HTTP 下加入 SSL 层。
    SSL(Secure Sockets Layer 安全套接层)主要用于 Web 的安全传输协议, 在传输层对网络连接进行加密, 保障在 Internet 上数据传输的安全。
    HTTP 的端口号为 80
    HTTPS 的端口号为 443

    三、HTTP工作原理

    浏览器的主要功能是向服务器发出请求, 在浏览器窗口中展示您选择的网络资源, HTTP 是一套计算机通过网络进行通信的规则。
    HTTP 的请求与响应
    HTTP 通信由两部分组成: 客户端请求消息 与 服务器响应消息
    在这里插入图片描述
    浏览器发送 HTTP 请求的过程:
    当用户在浏览器的地址栏中输入一个 URL 并按回车键之后, 浏览器会向 HTTP 服务器发送 HTTP 请求。 HTTP 请求主要分为“Get”和“Post”两种方法。 当我们在浏览器输入URL http://www.baidu.com 的 时 候 , 浏 览 器 发 送 一 个 Request 请 求 去 获
    http://www.baidu.com 的 html 文件, 服务器把 Response 文件对象发送回给浏览器。
    浏览器分析 Response 中的 HTML, 发现其中引用了很多其他文件, 比如 Images 文件,CSS 文件, JS 文件。 浏览器会自动再次发送 Request 去获取图片, CSS 文件, 或者 JS 文件。
    当所有的文件都下载成功后, 网页会根据 HTML 语法结构, 完整的显示出来了。

    URL

    URL(Uniform / Universal Resource Locator)
    统一资源定位符, 是用于完整地描述 Internet 上网页和其他资源的地址的一种标识方法。
    在这里插入图片描述
    基本格式: scheme://host[:port#]/path/…/[?query-string][#anchor]
    scheme: 协议(例如: http, https, ftp)
    host: 服务器的 IP 地址或者域名
    port: 服务器的端口(如果是走协议默认端口, 缺省端口 80)
    path: 访问资源的路径
    query-string: 参数, 发送给 http 服务器的数据
    anchor: 锚(跳转到网页的指定锚点位置)
    例如:
    ftp://192.168.0.116:8080/index
    http://www.baidu.com
    http://item.jd.com/11936238.html#product-detail

    客户端 HTTP 请求
    URL 只是标识资源的位置, 而 HTTP 是用来提交和获取资源。 客户端发送一个 HTTP
    请求到服务器的请求消息, 包括以下格式:
    请求行、 请求头部、 空行、 请求数据
    四个部分组成, 下图给出了请求报文的一般格式。
    在这里插入图片描述在这里插入图片描述

    请求方法:

    GET https://www.baidu.com/ HTTP/1.1
    根据 HTTP 标准, HTTP 请求可以使用多种请求方法。
    HTTP 0.9: 只有基本的文本 GET 功能。
    HTTP 1.0: 完善的请求/响应模型, 并将协议补充完整, 定义了三种请求方法: GET, POST
    和 HEAD 方法。
    HTTP1.1: 在 1.0 基础上进行更新, 新增了五种请求方法: OPTIONS, PUT, DELETE, TRACE
    和 CONNECT 方法。
    HTTP 2.0(未普及) : 请求/响应首部的定义基本没有改变, 只是所有首部键必须全部小写,
    而且请求行要独立为 :method、 :scheme、 :host、 :path 这些键值对。
    在这里插入图片描述
    目前主要使用的HTTP 请求主要为 Get 和 Post 两种方法

    GET 是从服务器上获取数据, POST 是向服务器传送数据
    GET 请求参数显示, 都显示在浏览器网址上, HTTP 服务器根据该请求所包含 URL中 的 参 数 来 产 生 响 应 内 容 , 即 “Get” 请 求 的 参 数 是 URL 的 一 部 分 。 例
    如: http://www.baidu.com/s?wd=Chinese
    POST 请求参数在请求体当中, 消息长度没有限制而且以隐式的方式进行发送, 通常用来向 HTTP 服务器提交量比较大的数据(比如请求中包含许多参数或者文件上传操作等) ,请求的参数包含在“Content-Type”消息头里, 指明该消息体的媒体类型和编码,
    注意: 避免使用 Get 方式提交表单, 因为有可能会导致安全问题。 比如说在登陆表单中用 Get 方式, 用户输入的用户名和密码将在地址栏中暴露无遗。

    常用的请求报头:

    1. Host (主机和端口号)
      Host: 对应网址 URL 中的 Web 名称和端口号, 用于指定被请求资源的 Internet 主机和端口号, 通常属于 URL 的一部分。

    2. Connection (链接类型)
      Connection: 表示客户端与服务连接类型
      Client 发起一个包含 Connection:keep-alive 的请求, HTTP/1.1 使用 keep-alive 为默认值。
      Server 收到请求后:
      如果 Server 支持 keep-alive(长连接), 回复一个包含 Connection:keep-alive 的响应, 不关闭连接;如果 Server 不支持 keep-alive, 回复一个包含 Connection:close 的响应, 关闭连接。如果 client 收到包含 Connection:keep-alive 的响应, 向同一个连接发送下一个请求, 直到一方主动关闭连接。
      keep-alive 在很多情况下能够重用连接, 减少资源消耗, 缩短响应时间, 比如当浏览器需要多个文件时(比如一个 HTML 文件和相关的图形文件), 不需要每次都去请求建立连接。

    3. Upgrade-Insecure-Requests (升级为 HTTPS 请求)
      Upgrade-Insecure-Requests: 升级不安全的请求, 意思是会在加载 http 资源时自动替换成 https 请求, 让浏览器不再显示 https 页面中的 http 请求警报。
      HTTPS 是以安全为目标的 HTTP 通道, 所以在 HTTPS 承载的页面上不允许出现
      HTTP 请求, 一旦出现就是提示或报错。

    4. User-Agent (浏览器名称)
      User-Agent: 是客户浏览器的详细信息,服务器是通过这条信息来判断来访的用户是否为真实用户。

    5. Accept (传输文件类型)
      Accept: 指浏览器或其他客户端可以接受的 MIME(Multipurpose Internet Mail Extensions(多用途互联网邮件扩展)文件类型, 服务器可以根据它判断并返回适当的文件格式。
      举例:
      Accept: /: 表示什么都可以接收。
      Accept: image/gif: 表明客户端希望接受 GIF 图像格式的资源;
      Accept: text/html: 表明客户端希望接受 html 文本。
      Accept: text/html, application/xhtml+xml;q=0.9, image/*;q=0.8: 表示浏览器支持的 MIME 类型分别是 html 文本、 xhtml 和 xml 文档、 所有的图像格式资源。
      q 是权重系数, 范围 0 =< q <= 1, q 值越大, 请求越倾向于获得其“;”之前的类型表示的内容。 若没有指定 q 值, 则默认为 1, 按从左到右排序顺序; 若被赋值为 0, 则用于表示浏览器不接受此内容类型。
      Text: 用于标准化地表示的文本信息, 文本消息可以是多种字符集和或者多种格式的;Application: 用于传输应用程序数据或者二进制数据。

    6. Referer (页面跳转处)
      Referer: 表明产生请求的网页来自于哪个 URL, 用户是从该 Referer 页面访问到当前请求的页面。 这个属性可以用来跟踪 Web 请求来自哪个页面, 是从什么网站来的等。
      有时候遇到下载某网站图片, 需要对应的 referer, 否则无法下载图片, 那是因为人家做了防盗链, 原理就是根据 referer 去判断是否是本网站的地址, 如果不是, 则拒绝, 如果是,就可以下载;

    7. Accept-Encoding(文件编解码格式)
      Accept-Encoding: 指出浏览器可以接受的编码方式。 编码方式不同于文件格式, 它是为了压缩文件并加速文件传递速度。 浏览器在接收到 Web 响应之后先解码, 然后再检查文件格式, 许多情形下这可以减少大量的下载时间。
      举例: Accept-Encoding:gzip;q=1.0, identity; q=0.5, *;q=0
      如果有多个 Encoding 同时匹配, 按照 q 值顺序排列, 本例中按顺序支持 gzip, identity压缩编码, 支持 gzip 的浏览器会返回经过 gzip 编码的 HTML 页面。 如果请求消息中没有设置这个域服务器假定客户端对各种内容编码都可以接受。

    8. Accept-Language(语言种类)
      Accept-Langeuage:指出浏览器可以接受的语言种类,如 en 或 en-us 指英语,zh 或者 zh-cn指中文, 当服务器能够提供一种以上的语言版本时要用到。

    9. Accept-Charset(字符编码)
      Accept-Charset: 指出浏览器可以接受的字符编码。
      举例: Accept-Charset:iso-8859-1,gb2312,utf-8
      ISO8859-1: 通常叫做 Latin-1。 Latin-1 包括了书写所有西方欧洲语言不可缺少的附加字符, 英文浏览器的默认值是 ISO-8859-1.
      gb2312: 标准简体中文字符集;
      utf-8: UNICODE 的一种变长字符编码, 可以解决多种语言文本显示问题, 从而实现应用国际化和本地化。
      如果在请求消息中没有设置这个域,缺省是任何字符集都可以接受。

    10. Cookie (Cookie)
      Cookie: 浏览器用这个属性向服务器发送 Cookie。 Cookie 是在浏览器中寄存的小型数据体, 它可以记载和服务器相关的用户信息, 也可以用来实现会话功能。

    11. Content-Type (POST 数据类型)
      Content-Type: POST 请求里用来表示的内容类型。
      举例: Content-Type = Text/XML; charset=gb2312:
      指明该请求的消息体中包含的是纯文本的 XML 类型的数据, 字符编码采用“gb2312”。

    服务端 HTTP 响应

    HTTP 响应也由四个部分组成, 分别是: 状态行、 消息报头、 空行、 响应正文
    在这里插入图片描述在这里插入图片描述

    常用的响应报头(了解)
    有请求必有响应,理论上所有的响应头信息都应该是回应请求头的。 但是服务端为了效率, 安全, 还有其他方面的考虑, 会添加相对应的响应头信息, 从上图可以看到:

    1. Cache-Control: must-revalidate, no-cache, private
      这个值告诉客户端, 服务端不希望客户端缓存资源, 在下次请求资源时, 必须要从新请求服务器, 不能从缓存副本中获取资源。
      Cache-Control 是 响 应 头 中 很 重 要 的 信 息 , 当 客 户 端 请 求 头 中 包 含
      Cache-Control:max-age=0 请求, 明确表示不会缓存服务器资源时,Cache-Control 作为作为回应信息, 通常会返回 no-cache, 意思就是说, “那就不缓存呗”。
      当客户端在请求头中没有包含 Cache-Control 时, 服务端往往会定,不同的资源不同的缓存策略, 比如说 oschina 在缓存图片资源的策略就是 Cache-Control: max-age=86400,这个意思是, 从当前时间开始, 在 86400 秒的时间内, 客户端可以直接从缓存副本中读取资源, 而不需要向服务器请求。

    2. Connection: keep-alive
      这个字段作为回应客户端的 Connection: keep-alive, 告诉客户端服务器的 tcp 连接也是一个长连接, 客户端可以继续使用这个 tcp 连接发送 http 请求。

    3. Content-Encoding:gzip
      告诉客户端, 服务端发送的资源是采用 gzip 编码的, 客户端看到这个信息后, 应该采用 gzip 对资源进行解码。

    4. Content-Type: text/html;charset=UTF-8
      告诉客户端, 资源文件的类型, 还有字符编码, 客户端通过 utf-8 对资源进行解码, 然后对资源进行 html 解析。 通常我们会看到有些网站是乱码的, 往往就是服务器端没有返回正确的编码。

    5. Date: Sun, 21 Sep 2016 06:18:21 GMT
      这个是服务端发送资源时的服务器时间, GMT 是格林尼治所在地的标准时间。 http 协议中发送的时间都是 GMT 的, 这主要是解决在互联网上, 不同时区在相互请求资源的时候,时间混乱问题。

    6. Expires:Sun, 1 Jan 2000 01:00:00 GMT
      这个响应头也是跟缓存有关的, 告诉客户端在这个时间前, 可以直接访问缓存副本, 很显然这个值会存在问题, 因为客户端和服务器的时间不一定会都是相同的, 如果时间不同就会导致问题。 所以这个响应头是没有 Cache-Control: max-age=*这个响应头准确的, 因为max-age=date 中的 date 是个相对时间, 不仅更好理解, 也更准确。

    7. Pragma:no-cache
      这个含义与 Cache-Control 等同。

    8. Server: Tengine/1.4.6
      这个是服务器和相对应的版本, 只是告诉客户端服务器的信息。

    9. Transfer-Encoding: chunked
      这个响应头告诉客户端, 服务器发送的资源的方式是分块发送的。 一般分块发送的资源都是服务器动态生成的, 在发送时还不知道发送资源的大小, 所以采用分块发送, 每一块都是独立的, 独立的块都能标示自己的长度, 最后一块是 0 长度的, 当客户端读到这个 0 长度的块时, 就可以确定资源已经传输完了。

    10. Vary: Accept-Encoding
      告诉缓存服务器, 缓存压缩文件和非压缩文件两个版本, 现在这个字段用处并不大, 因为现在的浏览器都是支持压缩的。

    响应状态码

    响应状态代码有三位数字组成, 第一个数字定义了响应的类别, 且有五种可能取值。
    常见状态码:
    100~199: 表示服务器成功接收部分请求, 要求客户端继续提交其余请求才能完成整个处理过程。
    200~299: 表示服务器成功接收请求并已完成整个处理过程。 常用 200(OK 请求成功)。
    300~399: 为完成请求, 客户需进一步细化请求。 例如: 请求的资源已经移动一个新地址、 常用 302(所请求的页面已经临时转移至新的 url) 、 307 和 304(使用缓存资源) 。
    400~499: 客户端的请求有错误, 常用 404(服务器无法找到被请求的页面) 、 403(服务器拒绝访问, 权限不够) 。
    500~599: 服务器端出现错误, 常用 500(请求未完成。 服务器遇到不可预知的情况) 。

    Cookie 和 Session:

    服务器和客户端的交互仅限于请求/响应过程, 结束之后便断开, 在下一次请求时, 服务器会认为新的客户端。为了维护他们之间的链接, 让服务器知道这是前一个用户发送的请求, 必须在一个地方保存客户端的信息。
    Cookie: 通过在 客户端 记录的信息确定用户的身份。
    Session: 通过在 服务器端 记录的信息确定用户的身份。

    展开全文
  • 经历了一波秋招,整理了一部分面试题,也...一、HTTP请求(主要从请求的方法类型、请求消息和响应消息、get和post的区别这几部分来说) 1、请求的方法:HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法。  HTT...

    经历了一波秋招,整理了一部分面试题,也是趁这个机会再巩固一下知识点。(本来想把所有的知识点都写在一篇博客中,感觉太冗长了,不如一篇一篇的整洁。)

    一、HTTP请求(主要从请求的方法类型、请求消息和响应消息、get和post的区别这几部分来说)

    1、请求的方法:HTTP1.0定义了三种请求方法: GET, POST 和 HEAD方法。
                               HTTP1.1新增了五种请求方法:OPTIONS, PUT, DELETE, TRACE 和 CONNECT 方法。

              其中,Get指从指定的资源获取数据(比如获取列表中的数据)

                         Post指向指定的资源提交要被处理的数据(如提交表单信息)

                         Head与 GET 相同,但只返回 HTTP 报头,不返回文档主体。

                         Put指上传指定的 URI 表示。

                         Delete指删除指定资源。

                         Options返回服务器支持的 HTTP 方法。

                         Connect把请求连接转换到透明的 TCP/IP 通道。

    2、请求与响应。

    1)请求由请求行、请求头、和请求数据组成。(请求头是那些由客户端发往服务端以便帮助服务端更好的满足客户端请求的头。)

                 请求行写法是固定的,由三部分组成,第一部分是请求方法,第二部分是请求网址,第三部分是HTTP版本。如

    GET www.cnblogs.com HTTP/1.1。

                  Http请求可以包含3种HTTP头:1.请求头(request header)  2.普通头(general header)  3.实体头(entity header)

     通常来说,由于Get请求往往不包含内容实体,因此也不会有实体头。

                 请求数据只在POST请求中存在,因为GET请求并不包含任何实体。

    2)响应由状态行、响应头、响应正文组成。( HTTP响应头是那些描述HTTP响应本身的头)

                  状态行由三部分组成,第一部分是HTTP版本,第二部分是响应状态码,第三部分是状态码的描述 。如

    HTTP/1.1 200 OK。

                   HTTP响应中包含的头包括1.响应头(response header) 2.普通头(general header) 3.实体头(entity header)。

                   HTTP响应内容就是HTTP请求所请求的信息。这个信息可以是一个HTML,也可以是一个图片。

    3)请求头和响应头:

    a.请求头实例:(来自百度首页)

         

    其中,Accept是客户端能接受的资源类型。

              Accept-Encoding:是支持的压缩格式。数据在网络上传递时,可能服务器会把数据压缩后再发送。

             Accept-Language:是客户端能接受的语言类型。

             Connection:是维护客户端与服务端的连接方式。

             Cookie:是客户端暂存的服务端的信息。因为不是第一次访问这个地址,所以会在请求中把上一次服务器响应中发送过来                         的Cookie在请求中一并发送去过。

             Host:是连接的目标主机与端口号。

             Referer:表示浏览器所访问的前一个页面,可以认为是之前访问页面的链接将浏览器带到了当前页面。。

             User-Agent:是客户端版本号的名字,即浏览器的身份标识字符串。

    还有一些常用的请求头(关于协商缓存,会和强制缓存一起在后边介绍):

              If-Modified-Since:允许在对应的资源未被修改的情况下返回304未修改。(协商缓存,与Last-Modified对应)

              If-None-Match:允许在对应的内容未被修改的情况下返回304未修改。(协商缓存,与Etag对应)

              If-Match:主要用于像 PUT 这样的方法中,仅当从用户上次更新某个资源后,该资源未被修改的情况下,才更新该资源。

              If-Range:如果该实体未被修改过,则向返回所缺少的那一个或多个部分。否则,返回整个新的实体。

              Origin:发起一个针对跨域资源共享的请求(该请求要求服务器在响应中加入一个Access-Control-Allow-Origin的消息头,表示访问控制所允许的来源)。

    b.响应头实例:

    其中,

           Cache-Control(强制缓存字段):通知从服务器到客户端内的所有缓存机制,表示它们是否可以缓存这个对象及缓存有效                                                                   时间。其单位为秒。

          Connection:针对该连接所预期的选项。

          Content-Encoding:响应资源所使用的编码类型。

          Content-Length:响应消息体的长度,用8进制字节表示。

          Content-Type:当前内容的MIME类型

          Date:此条消息被发送时的日期和时间。

          Expires(强制缓存字段):指定一个日期/时间,超过该时间则认为此回应已经过期。

          Server:服务器的名称。

          Vary:告知下游的代理服务器,应当如何对以后的请求协议头进行匹配,以决定是否可使用已缓存的响应内容而不是重新从                   原服务器请求新的内容。

    还有一些常用的响应头:

            WWW-Authenticate:表示在请求获取这个实体时应当使用的认证模式。

            Set-Cookie:设置HTTP cookie。

       Last-Modified:所请求的对象的最后修改日期。

             Access-Control-Allow-Origin:指定哪些网站可以跨域源资源共享。

       Etag:对于某个资源的某个特定版本的一个标识符,通常是一个 消息散列。

    c.请求头和响应头通用头部---General(通用头即可以包含在HTTP请求中,也可以包含在HTTP响应中。通用头的作用是描述HTTP协议本身。

    其中,Request URL是请求地址

               Request Method是请求方法

               Status Code是状态码

               Remote Address是请求的远程地址

               Referrer Policy是策略

    3、Get和Post的区别:

     1)get把请求的数据放在url上,即HTTP协议头上;post把数据放在HTTP的请求体内。

               其中,get请求中以?分割URL和传输数据,参数之间以&相连。 (若发送空格,则转换为+;)

    2)get提交的数据最大是2k;post理论上没有限制。实际上IIS4中最大量为80KB,IIS5中为100KB。

              其中,get发送的数据在原则上url长度无限制,限制实际上取决于浏览器,浏览器会限制url的长度。

    3)get产生一个TCP数据包,浏览器会把http header和data一并发送出去,服务器响应200(返回数据); 

    post产生两个TCP数据包,浏览器先发送header,服务器响应100 continue,浏览器再发送data,服务器响应200 ok(返回数据)。

    4)GET请求只能进行url编码;POST支持多种编码方式。

    5)GET在浏览器回退时是无害的;POST会再次提交请求。(get请求中的回退操作实际上浏览器会从之前的缓存中拿结果)

     

    展开全文
  • 第三节:Tornado的请求与响应

    千次阅读 2018-03-01 23:04:37
    一、请求与响应 1.1 浏览器服务器的沟通过程 1.2 请求信息 请求 &nbsp;&nbsp; 浏览器在发送请求的时候,会发送具体的请求信息,由请求行,请求消息头,请求正文 请求消息头 &nbsp;&...
    • 上节知识点回顾
      输入输出知识点回顾

    一、请求与响应

    1.1 浏览器与服务器的沟通过程

    浏览器与服务器

    1.2 请求信息

    1. 请求
         浏览器在发送请求的时候,会发送具体的请求信息,由请求行,请求消息头,请求正文
    2. 请求消息头
         向服务器传递附加信息
    消息头含义
    Accept浏览器可以接受的MIME类型
    Accept-Charset浏览器支持的字符集,如gbk,utf-8
    Accept-Encoding浏览器能够解码的数据压缩方式, 如:gzip
    Accept-language所希望的语言
    Host请求的主机和端口
    User-Agent通知服务器,浏览器类型
    Content-Length表示请求消息正文的长度
    Connection表示是否需要持久连接(Keep-alive)
    Cookie这是最重要的请求头信息之一(会话有关)

    3. 请求行
       请求行,位于第一行,包含内容为:

    请求行内容含义
    Method一般为 GET 或者 POST
    Path-to-resource请求的资源的URI
    Http/Version-number客户端使用的协议的版本,有HTTP/1.0和HTTP/1.1

    4. 请求正文
       请求具体内容,比如:URL中传入的参数,form表单里面的内容等等

    1.3 响应信息

    1. 响应信息
         响应信息为服务器的处理结果。主要包含:响应行,响应消息头,响应正文
    2. 响应行
         响应行主要报错如下信息:
    报错含义
    Http/Version-number服务器用的协议版本
    Statuscode响应码。代表服务器处理的结果的一种表示
    message响应码描述。例如200的描述为OK
    常见响应码含义
    200正常
    302/307重定向
    304服务器的资源没有被修改
    404请求的资源不存在
    500服务器报错了

    3. 响应头

    响应头含义
    Server通知客户端,服务器的类型
    Content-Encoding响应正文的压缩编码方式。常用的是gzip
    Content-Length通知客户端响应正文的数据大小
    Content-Type通知客户端响应正文的MIME类型
    Content-Disposition通知客户端,以下载的方式打开资源

    4. 响应正文
        具体的响应内容,如html,JavaScript 等数据内容

    二、设置响应头

    2.1 设置给定响应头(set_header)

    class SetHandler(tornado.web.RequestHandler):
        def get(self):
            self.write('set header')
            self.set_header('aaa','111')
            self.set_header('aaa','222')
            self.set_header('aaa','333')

    set_header

    2.2 添加给定响应头(add_header)

    class AddHandler(tornado.web.RequestHandler):
        def get(self):
            self.write('add header')
            self.add_header('www','444')
            self.add_header('www','555')

    add_header

    2.3 撤销定响应头(clear_header)

    class ClearHandler(tornado.web.RequestHandler):
        def get(self):
            self.write('clear header')
            self.add_header('sss', '8888')
            self.add_header('qqq', '66666')
            self.clear_header('qqq')

    clear_header

    三、发送错误代码

    3.1 发送错误代码到浏览器(send_error)

      send_error 可以将指定的 HTTP 错误码发送到浏览器

    class SendHandler(tornado.web.RequestHandler):
        def get(self):
            # self.flush()
            self.send_error(404)
    • 使用 send_error 时需要注意:如果已经执行了 flush,则不能再执行 send_error,因此该方法将简单地终止响应

    • 如果输出已写入但尚未刷新,则将其丢弃并替换为错误页面
      send_error

    3.2 实现自定义错误页面(write_error)

      send_error 在其底层调用的是write_error;因此只要重写此方法,就可以实现自定义的的错误页面

    #自定义错误页面
    class SelfHandler(tornado.web.RequestHandler):
        def write_error(self, status_code, **kwargs):
            self.write('这是自定义错误页面<br>')
            self.write('status_code:%s' %status_code)

    自定义错误页面

    3.3 未定义路由处理

    #未定义路由处理
    class NotFoundHandler(tornado.web.RequestHandler):
        def get(self):
            self.send_error(404)
    
        def write_error(self, status_code, **kwargs):
            self.render('error.html')
    • 利用正则设置路由表
    (r"/(.*)", NotFoundHandler)

    注:需要把路由放到路由表的最后面
    未定义路由

    3.4 路由表

    application = tornado.web.Application(
        handlers = [
        (r"/",SetHandler ),
        (r"/add", AddHandler),
        (r"/cl", ClearHandler),
        (r"/send", SendHandler),
        (r"/self", SelfHandler),
        (r"/(.*)", NotFoundHandler),
        ],
        template_path='../templates',
        debug = True
    )

    四、Tornado处理请求的过程

    • 调用顺序
        Tornado 在接受到请求之后,后按照以下顺序选择响应的方法来执行
    class IndexHandler(tornado.web.RequestHandler):
        def set_default_headers(self):
            print(' ---set_default_headers---:设置header')
        def initialize(self):
            print(' ---initialize---:初始化')
        def prepare(self):
            print(' ---prepare---:准备工作')
        def get(self):
            self.write(' ---get---:处理get请求'+'<br>')
        def post(self):
            self.write(' ---post---:处理post请求'+'<br>')
        def write_error(self, status_code, **kwargs):
            print(' ---write_error---:处理错误')
        def on_finish(self):
            print(' ---on_finish---:结束,释放资源')

    五、本节知识点总结及完整代码

    请求与响应知识点总结

    • response.py文件
    import time
    import tornado.ioloop
    import tornado.web
    import tornado.httpserver
    import tornado.options
    
    from tornado.options import  define, options
    
    define('port', default=8000, help='run port',type=int )
    define('version', default='0.0.0.1', help='version', type=str)
    
    class SetHandler(tornado.web.RequestHandler):
        def get(self):
            self.render('error.html')
            self.write('set header')
            self.set_header('aaa','111')
            self.set_header('aaa','222')
            self.set_header('aaa','333')
    
    class AddHandler(tornado.web.RequestHandler):
        def get(self):
            self.write('add header')
            self.add_header('www','444')
            self.add_header('www','555')
    
    class ClearHandler(tornado.web.RequestHandler):
        def get(self):
            self.write('clear header')
            self.add_header('sss', '8888')
            self.add_header('qqq', '66666')
            self.clear_header('qqq')
    
    class SendHandler(tornado.web.RequestHandler):
        def get(self):
            # self.flush()
            self.send_error(404)
    
    #自定义错误页面
    class SelfHandler(tornado.web.RequestHandler):
        def write_error(self, status_code, **kwargs):
            self.write('这是自定义错误页面<br>')
            self.write('status_code:%s' %status_code)
    
    #未定义路由处理
    class NotFoundHandler(tornado.web.RequestHandler):
        def get(self):
            self.send_error(404)
    
        def write_error(self, status_code, **kwargs):
            self.render('error.html')
    
    application = tornado.web.Application(
        handlers = [
        (r"/",SetHandler ),
        (r"/add", AddHandler),
        (r"/cl", ClearHandler),
        (r"/send", SendHandler),
        (r"/self", SelfHandler),
        (r"/(.*)", NotFoundHandler),
        ],
        template_path='../templates',
        debug = True
    )
    
    if __name__ == '__main__':
        tornado.options.parse_command_line()   #获取命令行参数
        print(options.port)
        print(options.version)
        http_server = tornado.httpserver.HTTPServer(application)
        application.listen(options.port)
        tornado.ioloop.IOLoop.instance().start()
    
    展开全文
  • 一次完整的HTTP请求与响应

    千次阅读 2017-03-24 15:45:47
    作者:Ruheng ... 本文以HTTP请求响应的过程来讲解涉及到的相关知识点...图片来自:理解Http请求与响应http://android.jobbole.com/85218/ 以上完整表示了HTTP请求响应的7个步骤,下面从TCP/IP协议模型的角度来理解
  • http请求与响应全过程

    万次阅读 多人点赞 2016-05-24 00:15:10
    3、浏览器web服务器建立一个 TCP 连接 4、浏览器给Web服务器发送一个http请求: 5、服务器的永久重定向响应: 6、浏览器跟踪重定向地址: 7、服务器“处理”请求: 8、服务器发回一个HTML响应 9、释放 TCP 连接 10...
  • Servlet-处理HTTP请求与响应

    千次阅读 2016-12-11 11:44:18
    HttpServletRequestHttpServletRequest 对象代表客户端的请求,客户端的所有消息都封装在这个对象中,通过这个方法...HttpServletResponseHttpServletRequest 对象代表服务端提供给客户端的响应,封装了HTTP响应数据作
  • axios的拦截请求与响应

    万次阅读 2017-06-05 14:44:53
    比如发送请求显示loading,请求回来loading消失之类的 import Vue from 'vue' import App from './App.vue' import axios from 'axios' import Loading from './components/Loading' import stores from './store/...
  • HTTP协议的请求与响应

    万次阅读 2019-04-19 15:15:04
    HTTP协议的请求与响应 我们使用的浏览器,通常称为客户端,而提供资源响应的一端称为服务器端。客户端服务端之间的通信方式,是通过HTTP协议完成的。HTTP协议规定,请求先从客户端发出,最后服务端响应请求并返回...
  • HTTP和HTTPS请求与响应

    千次阅读 2019-05-16 22:11:52
    HTTP的请求与响应 HTTP通信由两部分组成: 客户端请求消息 服务器响应消息 浏览器发送HTTP请求的过程: 当用户在浏览器的地址栏中输入一个URL并按回车键之后,浏览器会向HTTP服务器发送HTTP请求。...
  • [Python爬虫] 一、爬虫原理之HTTP和HTTPS的请求与响应

    万次阅读 多人点赞 2019-06-27 01:32:48
    本文主要介绍了爬虫原理之HTTP和HTTPS的请求与响应
  • Postman:API请求与响应

    千次阅读 2019-08-24 15:46:33
    请求构建器 在"Builder"选项卡下,请求构建器允许快速创建任何类型的HTTP请求。HTTP请求的4个部分是Method、URL、Headers和Body。 Postman提供了方便的工具来处理上述部分 Method 使用下拉菜单,更改请求方法...
  • 图片来自:理解Http请求与响应 以上完整表示了HTTP请求响应的7个步骤,下面从TCP/IP协议模型的角度来理解HTTP请求响应如何传递的。 二、TCP/IP协议 TCP/IP协议模型(Transmission Control Protocol/...
  • JavaWeb之请求与响应

    万次阅读 2019-08-30 08:32:48
    超文本传输协议: 规定数据的格式 ... 服务器往浏览器回写 ---- 响应 2.请求:(request) 组成部分: 请求请求请求体 (1)请求行:请求信息的第一行 格式:请求方式 访问的资源 协议/版本 ...
  • 在wireshark捕获的信息流中,找到HTTP请求信息,右键选择追踪流--HTTP流;如下图所示;即可查看到对应的请求响应信息;
  • 如何用Chrome开发者工具查看HTTP请求与响应 查看请求 1.打开 Network 2.地址栏输入网址 3.在 Network 点击,查看 request,点击「view source」 4.可以看到请求的前三部分了 5.如果有请求内容的第四部分(POST),...
  • http请求与响应,TCP三次握手&四次分手

    万次阅读 多人点赞 2017-10-19 20:10:40
    从前端发起请求到后台的整个过程,是一个面试中经常遇到的问题。大概的流程想必有一点基础的人都明白,但是要细说,却未必能一一道出来,曾经老师教过的知识也都差不多忘干净了。所以,我上网找了点资料,加上自己的...
  • 完整的HTTP请求与响应(图解)

    千次阅读 2017-03-23 18:21:11
    完整的HTTP请求与响应(图解)整理下HTTP请求与相应
  • 请求响应详解(request&response)

    千次阅读 多人点赞 2020-11-11 14:03:48
    request&response:请求响应详解 request请求对象 一、Request请求对象介绍 二、Servlet继承结构 三、底层执行流程 四、请求对象中常用方法 获取路径 获取请求头 获取请求参数信息 流对象获取请求信息 五、获取...
  • 又或者,在实际的开发中,比如 Ajax 请求响应时中文出现乱码,此等问题网上解决方案一大堆,解决方式也并不难,但这些问题是如何产生的呢?这背后涉及的是 Spring MVC 对 HTTP 请求的处理以及响应...
  • HTTP的端口号为80, HTTPS的端口号为443 HTTP的请求与响应 HTTP通信由两部分组成: 客户端请求消息 服务器响应消息 浏览器发送HTTP请求的过程: 当用户在浏览器的地址栏中输入一个URL并按回车键之后,浏览器会向...
  • JavaWeb请求-响应学习笔记

    千次阅读 多人点赞 2016-08-15 20:52:37
    先来看流程图:   服务器处理请求的流程:  (1)服务器每次收到请求时,都会为这个请求开辟一个新的线程。... (3)服务器还会创建response对象,这个对象客户端连接在一起,它可以用来向客户端发送响应
  • HTTP入门(二):用Chrome开发者工具查看 HTTP 请求与响应 本文简单总结HTTP的请求与响应。 本文主要目的是对学习内容进行总结以及方便日后查阅。 详细教程和原理可以参考HTTP文档(MDN)。 本文版权归马涛涛所有...
  • 什么是http请求和http响应

    万次阅读 2018-06-20 16:41:05
    https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Messages什么是HTTP?超文本传输​​协议... HTTP遵循经典的客户端-服务端模型,客户端打开一个连接以发出请求,然后等待它收到服务器端响应。 HTTP是无状态...
  • AcceptAccept 头域用于指示在响应中能够接收的媒体的类型。 该字段使用互联网常用”type/sub-type “格式来描述。 缺省值为application/sdp。 媒体类型的列表可以使用q值参数进行设置。 Accept-Encoding该头头域用于...
  • HTTP请求与响应

    万次阅读 2017-03-03 15:08:21
    本篇文章中,将学习一下HTTP请求与响应头的知识。 一、HTTP头引入: 正确的设置HTTP头部信息有助于搜索引擎判断网页及提升网站访问速度。通常HTTP消息包括:客户机向服务器的请求消息和服务器向客户机的响应...
  • 一、请求 表单里的参数是字符,在数据传输的过程中编码为utf-8的字节,tomcat中默认以iso-8859-1的方式解码,所以必须要修改解码是查询的码表: 如果是post请求,在获取参数代码之前: request.setCharacterEncoding...
  • HTTP请求与服务器响应全流程

    千次阅读 2018-06-27 17:16:42
     1.2 请求/响应报文格式  1.3请求方式–GET/POST 状态码  1.4 响应状态  2. HTTP请求,浏览器做了什么, 服务端处理解析过程 1:HTTP简介  1.1  HTTP(HyperText Transfer Protocol,超文本传输协议)最...
  • Postman工具——请求与响应

    万次阅读 2016-11-23 20:51:43
    今天继续分享这个 Postman 工具,内容也一样很简单,两个内容: Request 请求和 Response 响应

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 1,313,976
精华内容 525,590
关键字:

请求与响应