码迷,mamicode.com
首页 > Web开发 > 详细

Web原理

时间:2017-06-24 18:26:26      阅读:206      评论:0      收藏:0      [点我收藏+]

标签:答案   添加   error   数据   java   gif   地址栏   否则   解决   

 在日常学代码的过程中,总会多多少少遇到点瓶颈。但是别人又听得懂,这是为什么?

 我觉得,就是在原理上都不去思考,为什么这样写?为什么一定要这样写?那到底该怎么写?写完了是怎么运行的?

 这好比一个人(你呗!)不会做菜,但是想去开饭店(做前端),在网上学直接学满汉全席(各种项目),经过勤学苦练,终于学会了做满汉全席的所有菜(会做项目了),但是...他会做别的吗?他知道蛋怎么炒吗?很有可能不知道(也有可能知道),他只会按班就步的来做某一道菜(使用别人的框架),一辈子也只会这些(不会自己写库、框架)。多么可悲?

  打了个小例子,回到正题:

 就以上几个问题,只用一个答案就能解决这些问题:

              Web运行原理。

              通俗的来说就是所有服务器,用户的客户端(浏览器)都必须遵守的一项协议:HTTP超文本协议,要真正了解Web运行原理,就必须彻底了解http协议,所谓的超文本协议,全名是Http超文本传输协议。

             其中超文本,即纯文本语言,不依赖于任何特定语言,但是任何语言都可以操作它。(比如,java,C++);

             HTTP是无状态协议,首先,什么是无状态协议?

              就是没有任何记忆能力不会做后续程序。简单打个比方,你(用户),去(输入网址)一个自助售货机(服务器)经常买东西(发送请求),你可能每次买的都是一瓶可乐(刷新数据包),可是你买的次数再多,自助售货机(服务器)还是不知道你是谁,要什么东西,所以要重新选择我要可乐(根据你的请求发送数据包),正规的讲就是这次的请求虽然是同一个客户端的请求但是他(服务器)还是不知道这个是之前的那个客户端是同一个,及对于事务处理没有记忆能力,每次要发送大量数据特别麻烦。后来网景公司雇员Lou Montulli为了让用户再访问某网站时,进一步提高访问速度,   就发明了今天我们最常用到的Cookie ,Cookie就是指某些网站为了辨别用户身份,进行跟踪而储存再用户本地终端上的数据,这些数据通常会被加密处理。通常被存储在浏览器目录中文本文件,当浏览器运行的时候,存储在RAM(你别告诉我你不懂这个?百度去!)中发挥作用,一旦(你)用户从(自助商店离开)该网站或服务器退出,(它就自动记忆最后的选择)Cookie就存在用户本地的硬盘上。(这种Cookie又被叫做 内存 Cookie,我称为ROM Cookie,RAM是实时运行的短暂性数据,决定你同时可以运行多少个程序,ROM是Persistent 数据,就像电脑的硬盘,硬盘里面的数据除非你自己修改,否则是不会变的。),于是,两种用于保持HTTP连接状态的技术就应运而生了,一个是Cookie,而另一个则是Session(会话控制)。

            总之来说,服务器和客户端的交互仅限于请求/响应过程,结束之后便断开,在下一次请求服务器会认为新的客户端

           

 

         ③基于请求/相应模型?

          我们知道了http协议是一种无状态的协议,客户端和服务器不需要建立持久的链接。它俩的链接是基于一种请求应答模式,在他们之间建立一个链接,客户端提交一个请求,服务器端就收到请求后就返回一个响应,然后两者就断开链接。

          有人可能会觉得很难阅读,那就举个例子,发短信,你(客户端)只需要发送一个短信(请求)到某个联系人(服务器),反之,他发短信给你也是这个步骤,是不是一点发送就结束了?跟平常普通人对话一样,你说完了对方才能说,对方说完了你才能说,否则你插嘴打断别人说话是很不礼貌的。搞不好跟你闹掰(几乎不可能),总之打这个比方是想说清楚这个步骤。

         举一个案例吧。我们熟悉的网页多图浏览:

                 1.建立连接,客户端发送一个网页请求,服务器返回一个HTML页面(这里的页面只是个纯文本的文本,也就是我们写的html代码),关闭连接;

                 2.浏览器解析html文件,遇到图片标记得到‘图片的url’(可能是其他网站图片,也可能是已经在服务器数据库的图片,在这我们举例服务器上的资源),那么客户端和服务器会再次建立一个连接,客户端发送一个图片请求,服务器返回图片应答,关闭连接。(这里又涉及到无状态定义具体看②解释)

                 3.重复第2个步骤,直到html解析完毕。

      那么,我们知道了超文本传输协议(HTTP)的特性,那..http的内容呢?

            要想真正理解Web工作的原理,就必须彻底了解http协议的内容。

           http协议是一个属于应用层的面向对象的协议,由于其简捷,快速的方式,适用于分布式超媒体信息系统,它于1990年提出,经过二十几年的使用和发展,得到不断的完善和扩展,目前WWW中使用的是HTTP/1.1,HTTP的主要特点包括:

            1.支持客户端/服务器端。

            2.简单快速:客户向服务器发送请求服务时,只需要传送请求方法和路径,请求方法常用的GET、POST。还有个HEAD涉及不多,就不讲了。每种方法规定了客户端和服务器联系的类型不同,由于HTTP协议简单,使得HTTP服务器的程序规模小,因而通信速度很快。

            3.HTTP允许传输任意类型的数据对象,正在传输的类型有Content-Type(数据内容格式)加以标记。

            4.无连接,大概就是限制每次链接只处理一个请求,服务器处理完客户端的请求,并收到客户端的应答后,即断开连接,采用这种方式可以节省传输时间。

            5.无状态,也就是我在之前讲的。请往前看。总而言之,就是类似于自助售货机,你第一万次去它那买东西它也不知道你要什么,纯粹的无记忆状态,Cookie和Session改变了这种状态,就相当于给这个售货机配了一个售货专员,认识你,会帮你选择你上次买的。

 

         那么,Web整一个运行的原理和流程是怎样的呢?

              两种说明方法,

                1.当用户想访问某个网络资源的时候,在客户端(浏览器)输入统一资源定位符(Uniform Resource Locator简称URL),或者通过超链接方式链接到那个网页或者网络资源,URL的的服务器名部分,会被名为(DNS)域名系统的分布于全球的因特网数据库解析,并根据解析结果决定将被定位到哪一个IP(网络协议)地址,通过IP地址进行层级查找,逐渐定位到服务器,向服务器发送浏览请求,服务器处理后,首先会查找相对应的资源,以处理的指令创建HTML,然后将HTML文件进行响应回传,对浏览器发送数据流,浏览器接到数据后就开始解析成HTML,最后生成可供用户读取的可视化页面。

                 其中几个关键点, 

                                  ⑴,给用户读取的页面放在什么地方,HTML CSS  JS 还有数据?

                                               HTML和CSS、JS代码是放在服务器,当用户访问的时候,服务器会先将HTML和CSS一起发送进行构建页面框架,具体运行顺序见下文,构建好页面框架后,会根据JS从数据库中提取出来的进行填充。并不是我们一开始以为页面就是写好了放页面上的,内容是实时从数据库中读取出来的填在页面中。

                                  ⑵,浏览器解析的方法?

                                              首先,浏览器会从服务器接收到HTML代码,然后开始解析HTML,构建成DOM树(根据HTML从上往下构建),并在同时构建渲染树(IE下载的顺序是从上到下,渲染的顺序也是从上到下,下载和渲染是同时执行的),如果遇到CSS文件的话,会启用一个单独的连接进行下载,所有CSS文件下载完毕后,将会一起执行,将对此前所有元素(包含已经渲染的)重新进行渲染。如果在解析CSS的时候解析到一张图片的href,渲染不会停止,客户端会再次向服务器发起一次请求,进行图片资源下载,不会妨碍后续资源的构建和渲染,如果返回了图片资源,图片占用的位置影响了DOM树的内容排布的布局构建,浏览器将会重新渲染这部分代码,还没完,当用户点击了某个CSS外部样式表功能(比如换肤),HTML只能召集div、ul、li、a、span们重新干活!遇到JS文件的时候不会进行并行下载和解析,如果发现了<script>里面的代码</script>,会立即执行,当发现script让某个元素进行隐藏的时候,少了这块元素,浏览器不得不进行重新进行渲染(哭~~~...)。当引用了外部地址JS的时候,浏览器会发送一个js request,就会一直等待该request的返回,因为浏览器需要一个稳定的DOM树结构,如果并行下载解析js的话,可能会遇到createElement(添加元素),removeElement(删除元素),appendChild(添加子节点),document.write(文档写入)甚至是直接龙location.href进行页面跳转,很容易将网页的结构破坏,将重建结构树。所以才会有js后行下载执行。

                     2.运行原理生活版

                         我要给一个人写信,是不是先得要到他的地址(URL),首先把信写好(填写url),投递到邮局(互联网),邮局根据自己内部的数据系统(因特尔数据库)查询(域名解析),知道了你的大概目标地址(IP),北京市 海淀区 北三环西路 多少号(192.0.111.xxx)  姓名(HOST),进行一级一级的传递,首先要通过海陆空进行运输到达北京,然后发往海淀,北三环西路,某某号。最后送到收件人手上,收件人看到信里的内容后,跟邮递员说“你别走,等我写个回信,很快”(解析请求,响应,查询数据),写完信后交给快递员,进行回传。这是正常情况下,如果是请求错误(信的内容写错了),比如你用英语写的,他看不懂,回了个信,说我不懂你意思(400 语法错误)。也可能你写错地址(URL),别人一收到就说我不认识这个人(404查找不到这个资源),或者信收到了,他不想看(500服务器状态错误),也可能说我最近太忙,过段时间给你回信(503服务器忙)。

                    这样说就通俗易懂了吧?

 

         HTTP协议URL篇

         http(超文本传输协议)是一个基于请求和响应模式的,无状态的,应用层的协议,常基于TCP(TCP/IP:传输控制协议/网间协议,分割数据流进行分段发送)的连接方式,HTTP1.1版本中给出一种持续连接的机制,绝大多数的Web开发,都是构建在HTTP协议之上的Web应用。

          HTTP URL(URL是一种特殊类型的URL,包含了用于查找某个资源的足够的信息)它的格式如下:

             http://host[":"port] [abs_path]

             现在我来解释下每段的定义

             首先 http表示要通过HTTP协议来定位网络资源;

             host表示合法的Internet主机域名或者IP地址;

             port指定一个端口号,如果是空的话就是默认的缺省80端口;

             abs_path代表指定请求资源的URL;如果URL中没有给出abs_path,那么当它作为请求URL的时候必须以“   /  ”的形式给出,通常这个工作浏览器自动帮我们完成。

             比如,输入 :

                 www.guet.edu.cn

             浏览器自动转换成

                 http:192.168.0.116:8080/index.jsp

   HTTP协议请求篇

           HTTP请求由三部分组成,分别是:请求行,消息报头,请求正文。

             1.请求行以一个方法符号开头(Method请求方法),以空格分开,后面跟着请求的URL(Request-URL统一资源标识符)和协议的版本(HTTP-Version表示版本 CRLF回车换行,CRLF只能同时存在,不能拆分成CR和LF)。

              请求方法有很多,但是对于我来说只有POST和GET常用。查阅资料如下:

                GET    请求获取Request-URI里所标识的资源

                POST   在Request-URI所表示的资源后附加的新的数据

                HEAD  请求获取由Request-URI所标识的资源的响应消息报头

                PUT     请求服务器存储一个资源,并用Request-URI为其做标识

                DELETE   请求服务器删除Request-URI所标识的资源

                TRACE    请求服务器回送收到的请求信息,主要用于测试或者诊断

                CONNECT   保留,将来使用

                OPTIONS  请求查询服务器的性能,或者查询与资源相关的选项和需求

            可能有些人不懂URL和URI的区别,URI是纯粹的语法结构,用于指定标识Web资源字符串的各个不同部分,URL是URI的一个特例,它包含了定位Web资源的足够多的信息。根据URI的话你定位不了任何资源的具体信息,只有通过URL,总而言之,URI是统一资源标识符,URL是统一资源定位符,这就好比你知道某个人住在某小区,但是你不知道他住哪栋,这就需要URL定位符,通过栋单元层室去找到他。

              应用举例:

                           GET方法:在浏览器中的地址栏输入网址的方式访问网页时,浏览器采用GET方法想服务器获取资源,  GET/form.html HTTP/1.1(CRLF)

                           POST方法要求被请求服务器接受附在请求后面的数据,通常用于提交表单。

                                         POST/reg.jsp HTTP/(CRLF)    

                                         Accept:image/gif,image/x-bit,...(CRLF)   //接受的格式

                                         HOST:www.guet.edu.cn(CRLF) //主机名称

                                         Content-Length:22(CRLF)  //这个是实体内容长度,客户端可以根据这个值判断数据接收是否完成。

                                         Connection:Keep-Alive(CRLF)   //这个设定是让HTTP无连接的状态变更为持续连接。

                                         Cache-Control:no-cache(CRLF)  //设定网页不进行缓存

                                         user=jeffrey&pwd=1234   //这行以下就是提交的数据了

                           HEAD方法和GET几乎是一样的。

                             

                                      2,请求报头;

 

                                      3,请求正文就是客户端发送的内容

 

               HTTP协议响应篇

                           在接受和解释请求消息后,服务器返回一个HTTP响应消息。 

                           HTTP响应也是三个部分组成:状态行、消息报头、响应正文。

                           1.状态行格式:

                                     HTTP-Version Status-Code  Reason-Phrase CRLF

                                     其中 HTTP-Version表示服务器HTTP协议的版本;Status-Code表示服务器发挥的响应状态代码;Reason-Phrase表示状态代码的文本描述。

                                      状态代码有三位数字组成,第一个数字定义了响应的类别,

                                            1xx:指示信息-表示请求已接受,继续处理

                                            2xx:成功,表示请求已被成功接收,理解,接受。

                                            3xx:重定向--要完成请求必须进行更进一步的操作。

                                            4xx:客户端错误,请求有语法错误或者无法实现。

                                            5xx:服务器端错误,服务器未能实现合法的请求。

                                     常见的状态代码、代码的描述、说明:

                                            200  OK;   //客户端请求成功

                                            400  Bad Request  //客户端请求有语法错误,不能被服务器所理解;

                                            401  Unauthorized  //请求未经授权;

                                            403  Forbidden  // 服务器收到请求,但是拒绝服务;

                                            404  NOT Found  //请求资源不存在,也可能是输入了错误的资源;

                                            500  Internal Server Error   //服务器发生了错误;

                                            503 Server Unavailable  //服务器当前不能处理客户端的请求,一段时间后可能恢复正常;

                                      2,响应报头;

                                      3,响应正文就是服务器返回的资源内容

                   

Web原理

标签:答案   添加   error   数据   java   gif   地址栏   否则   解决   

原文地址:http://www.cnblogs.com/yuanziwen/p/7072039.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!