【HTML】浏览器输入URL,发生了什么?【HTTP篇】

浏览器输入URL,发生了什么?【HTTP篇】

CreateTime:2016-09-06 20:07:17
Author:zhongxia
浏览器输入URL之后,发生了什么? 针对前端来说,最重要的是 http 和 浏览器渲染。底层硬件,网络通讯,后端的相关知识,这里就大概一概而过了。 这一篇主要讲解一下http相关方面的。

1. 浏览器输入URL,解析URL

用户输入URL地址,浏览器会去解析URL地址,得到请求服务器地址,请求页面文件路径,以及请求参数

2. DNS解析

根据域名解析服务器的IP地址, ip地址是一串数据,不方便记忆,因此有了域名。

  1. 从浏览器DNS缓存,找域名相对应的IP
  2. 没有找到,则从系统缓存寻找
  3. 没有找到,从系统的host文件里面找
  4. 没有找到,从路由器上找
  5. DNS服务器找
  6. ...
  7. 找到域名对应的IP地址

3. 浏览器发送HTTP请求

浏览器发出一个 HTTP协议的请求,组织了一个请求的数据包(走OSI七层模型,从应用层 到 最低层的数据链路层 的数据包层层封装,然后传到服务器在 层层解开)

3.1 请求消息

  • 请求行
    • 请求方法【POST/GET/PUT/DELETE】
    • URI
    • 请求协议【FTP、HTTP、HTTPS、等】/版本
  • 请求报头
    • 参考最下面文章【待整理,可以先参考最下面的参考文章】
  • 请求正文(需要传到服务器的数据)
image
image

请求头 和 请求正文之间有 一个空行,空行是 HTTP规定的消息头和消息体的分界线

3.2 响应消息

  • 状态行

  • 响应报头

    • 【待整理,可以先参考最下面的参考文章】
  • 响应正文

1xx:信息响应类,表示接收到请求并且继续处理

2xx:处理成功响应类,表示动作被成功接收、理解和接受

3xx:重定向响应类,为了完成指定的动作,必须接受进一步处理

4xx:客户端错误,客户请求包含语法错误或者是不能正确执行

5xx:服务端错误,服务器不能正确执行一个正确的请求

3.3 HTTP相关知识:

  1. 三层架构(浏览器,web服务器,数据库),http 是用在 浏览器 和 web服务器之间通讯

  2. 两个核心(浏览器发出request请求, Web服务器response返回数据(text,xml,流等))

  3. 一个记住(HTTP是无状态的)

无状态是指协议对于事务处理没有记忆能力,服务器不知道客户端是什么状态。即我们给服务器发送 HTTP 请求之后,服务器根据请求,会给我们发送数据过来,但是,发送完,不会记录任何信息。
keep-alive 也无法改变这个无状态

4. 以百度首页为例获取请求头和响应头内容:

1、请求头:

我们现在通过谷歌浏览器来查看一下请求头:

以打开百度首页为例,然后在谷歌浏览器中打开“工具-开发者工具”,切换到network标签, 然后刷新页面:


image
image

上图中,打开箭头处html格式的文件,显示如下:


image
image

上图中的Request Headers就是我们所需要的请求头。里面的内容全部是键值对。服务器拿到这些键值对后会对其进行分析。

我们再来重复一下常见请求头键值对的含义:

  • Host:www.baidu.com 本次请求访问的主机地址(虚拟主机名称)
  • Cache-control:no-cache 设置网页缓存的使用方法
  • Pragma:no-cache
  • Accept:text/html,xxxxxx…..客户端可以接收的数据类型(如果内容是:/,表示接收所有类型)
  • User-Agent:Mozilla/5.0xxxxx 主要表示客户端类型
  • Accept-Encoding:gzip,deflate,sdch 浏览器能够接收的数据压缩编码方式(表示浏览器能够接收什么格式的压缩的数据)
  • Accept-Language:zh-CN,zh;q=0.8 浏览器期望的接受的语言种类
  • Accept-Charset: ISO-8859-1 客户端所接收的字符集编码
  • If-Modified-Since: Tue, 11 Jul 2000 18:23:51 GMT 和缓存机制相关的头
  • Referer: http://www.smyh.me/index.jsp 当前页面来自哪个页面(可能是由之前的页面通过超链接点进到这个页面来)
  • Cookie
  • Connection: close/Keep-Alive 请求完之后,是关闭此连接,还是继续保持连接
  • Date: Tue, 11 Jul 2013 18:23:51 GMT 当前请求的时间

注:上面的这些指的是get请求的请求头。

2、响应头:

我们再来看一下响应头的内容:


image
image

常见的响应头键值对的含义:

  • Location: http://www.smyh.me/index.jsp 重定向(302+Location实现重定向)
  • Server 服务器类型
  • Content-Encoding 服务器当前返回给客户端的数据压缩格式
  • Content-Length 返回给客户端的数据量的大小
  • Content-Language: zh-cn 语言种类
  • Content-Type: text/html; charset=GB2312 返回的数据的类型、字符集编码方式
  • Last-Modified 资源最后一次修改的时间(配合请求头中的If-Modified-Since+304/307实现缓存机制)
  • Refresh: 1;url=http://www.it315.org    隔多少秒以后,让当前页面去访问哪个地址(例如网页登陆成功后,跳回原来的界面,就是用的这个头)
  • Content-Disposition: attachment;filename=aaa.zip 和下载相关,通知浏览器以附件的形式下载服务器发送过去的数据
  • Transfer-Encoding: chunked 数据传输模式
  • Set-Cookie:SS=Q0=5Lb_nQ; path=/search 和cookie相关的头
  • ETag: W/"83794-1208174400000" 和cookie相关的头
  • Expires: -1 通知浏览器是否缓存当前资源:如果这个头的值是一个以毫秒为单位值,则通知浏览器缓存资源到指定的时间点;如果值是0或-1,则通知浏览器禁止缓存
  • Cache-Control: no-cache 通知浏览器是否缓存资源
  • Pragma: no-cache -- 通知浏览器是否缓存资源

注: 之所以三个头是一个功能,是因为历史原因。不同的浏览器对这三个头支持的不同,一般来说这三个头要同时使用,以确保不同的浏览器都能实现控制缓存的功能

  • Connection: close/Keep-Alive 是否继续保持连接
  • Date: Tue, 11 Jul 2000 18:23:51 GMT 当前响应的时间

参考文章

  1. Android系列之网络(二)----HTTP请求头与响应头
  2. 如何理解HTTP响应的状态码?
  3. 【i5ting】精解http
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 199,393评论 5 467
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 83,790评论 2 376
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 146,391评论 0 330
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 53,703评论 1 270
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 62,613评论 5 359
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 48,003评论 1 275
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 37,507评论 3 390
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 36,158评论 0 254
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 40,300评论 1 294
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 35,256评论 2 317
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 37,274评论 1 328
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 32,984评论 3 316
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 38,569评论 3 303
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 29,662评论 0 19
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 30,899评论 1 255
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 42,268评论 2 345
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 41,840评论 2 339

推荐阅读更多精彩内容