页面 审查元素讲解

        在学习爬虫的过程中,发现需要补充通信和关于网页的相关知识,所以看了《图解HTTP》,发现一点计算机基础都没有的我看起来相当吃力,但是感觉不是很难,所以想结合书籍和百度对审查元素功能进行学习,第一篇原创的来由。

      本文的审查元素功能学习是以火狐浏览器中的有道翻译为对象,主要是学习网络(Network)模块。

     以调用翻译模块为例:


第一行显示了审查元素的几个模块,其中网络模块是可以看到网络信息的传输等信息的内容。

1、状态栏

        状态栏下面是状态码状态码是表示客户端HTTP请求的返回结果、标记服务器端的处理是否正常、通知出现错误等工作。状态码的响应类别有五种,常用的状态码大概有十四种。

1.1     5种响应类别

1XX:接收的请求正在处理

2XX:请求正常处理完毕

3XX:需要进行附加操作完成请求

4XX:服务器无法处理请求

5XX:服务器处理请求出错

1.2   常用状态码

200:ok

在响应的报文内,随状态码一起返回的信息会因为方法的不同而不同。

get方法:对应请求资源的实体会作为响应返回。

head方法:响应中只返回首部,不会返回实体的主体部分

POST: 响应的消息体中包含此次请求的结果。

TRACE: 响应的消息体中包含服务器接收到的请求信息。

204:HTTP协议中204 No Content成功状态响应码表示目前请求成功,但客户端不需要更新其现有页面。204 响应默认是可以被缓存的。在响应中需要包含头信息ETag。

使用惯例是,在PUT请求中进行资源更新,但是不需要改变当前展示给用户的页面,那么返回 204 No Content。如果新创建了资源,那么返回201Created。如果页面需要更新以反映更新后的资源,那么需要返回200。

404:服务器没有资源并拒绝访问

2、方法

       在HTTP/1.1中主要有:GET、 POST 、HEAD 、DELETE、 OPTIONS 、TRACE 、CONNECT。

GET:获取资源, 请求访问已被URI识别的资源。指定的资源经过服务器端解析后返回响应的内容,文本保持原样,CGI则执行后输出。

POST:主要用于传输实体的主体

PUT/DELETE:不带验证机制的传输/删除文件,所以一般网站不使用该方法

HEAD:与GET一样,不返回报文的主体,用于确认URI的有效性和资源的更新时间

OPTIONS:查询针对请求URI的指定资源支持方法

TRACE:让服务器端将之前的请求通信返回给客户端

CONNECT:使用加密的隧道传输

3、文件

       文件指从响应端即服务器传输过来的文件,文件主要可以有HTML、CSS、JS、XHR、字体、图像、媒体、Flash、WS来筛选。

       HTML,或者超文本标记语言,主要是为了提供一种创建结构化科学文档的方法。HTML可以嵌入诸如PHP或JavaScript之类的脚本语言来影响web页面的行为和内容。万维网联盟(W3C)维护了HTML和CSS标准。

        CSS是一种定义样式结构如字体、颜色、位置等的语言,被用于描述网页上的信息格式化和现实的方式。CSS样式可以直接存储于HTML网页或者单独的样式单文件。无论哪一种方式,样式单包含将样式应用到指定类型的元素的规则。外部使用时,样式单规则被放置在一个带有文件扩展名_css的外部样式单文档中。在使用HTML定义页面效果的网站中,往往需要大量或重复的表格和font元素形成各种规格的文字样式,这样做的后果就是会产生大量的HTML标签,从而使页面文件的大小增加。而将样式的声明单独放到CSS样式表中,可以大大的减小页面的体积,这样在加载页面时使用的时间也会大大的减少。另外,CSS样式表的复用更大程序的缩减了页面的体积,减少下载的时间

     JSON(JavaScriptObject Notation, JS 对象标记) 是一种轻量级的数据交换格式。它基于ECMAScript(w3c制定的js规范)的一个子集,采用完全独立于编程语言的文本格式来存储和表示数据。简洁和清晰的层次结构使得 JSON 成为理想的数据交换语言。 易于人阅读和编写,同时也易于机器解析和生成,并有效地提升网络传输效率。

       很多人搞不清楚 JSON 和 Js 对象的关系,甚至连谁是谁都不清楚。其实,可以这么理解:

JSON 是 JS 对象的字符串表示法,它使用文本表示一个 JS 对象的信息,本质是一个字符串

varobj = {a:'Hello', b:'World'};//这是一个对象,注意键名也是可以使用引号包裹的

varjson ='{"a": "Hello", "b": "World"}';//这是一个 JSON 字符串,本质是一个字符串

JSON 和 JS 对象互转

要实现从对象转换为 JSON 字符串,使用 JSON.stringify() 方法:

varjson = JSON.stringify({a:'Hello', b:'World'});//结果是 '{"a": "Hello", "b": "World"}'

要实现从 JSON 转换为对象,使用 JSON.parse() 方法:

varobj = JSON.parse('{"a": "Hello", "b": "World"}');//结果是 {a: 'Hello', b: 'World'}

简单地说,JSON 可以将 JavaScript 对象中表示的一组数据转换为字符串,然后就可以在网络或者程序之间轻松地传递这个字符串,并在需要的时候将它还原为各编程语言所支持的数据格式,例如在 PHP 中,可以将 JSON 还原为数组或者一个基本对象。在用到AJAX时,如果需要用到数组传值,这时就需要用JSON将数组转化为字符串。

        XHR诞生前,网页要获取客户端和服务器的任何状态更新,都需要刷新一次,在XHR诞生后就可以完全通过JS代码异步实现这一过程。XHR的诞生也使最初的网页制作转换为开发交互应用,拉开了WEB2.0的序幕。

 XHR是一种浏览器API,极大简化了异步通信的过程,开发者并不需要关注底层的实现,因为浏览器会为我们完成这些工作,如连接管理、协议协商、HTTP请求格式化等等。






   

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

推荐阅读更多精彩内容

  • Spring Cloud为开发人员提供了快速构建分布式系统中一些常见模式的工具(例如配置管理,服务发现,断路器,智...
    卡卡罗2017阅读 134,654评论 18 139
  • API定义规范 本规范设计基于如下使用场景: 请求频率不是非常高:如果产品的使用周期内请求频率非常高,建议使用双通...
    有涯逐无涯阅读 2,540评论 0 6
  • /*--------------------------- 01 HTTP请求 -----------------...
    蓝心儿的蓝色之旅阅读 2,163评论 0 4
  • 国家电网公司企业标准(Q/GDW)- 面向对象的用电信息数据交换协议 - 报批稿:20170802 前言: 排版 ...
    庭说阅读 10,967评论 6 13
  • 1xx消息 这一类型的状态码,代表请求已被接受,需要继续处理。这类响应是临时响应,只包含状态行和某些可选的响应头信...
    一只大橘阅读 483评论 0 1