Web请求响应简单整理

简单对Web请求响应如何处理进行的整理，难免有理解不到位，理解有偏差的地方，如有理解有误的地方，希望大牛批评指正。

1.Web开发的定义
首先看看微软对Web开发的定义:
Web开发是一个指代网页或网站编写过程的广义术语。网页使用 HTML、CSS 和 JavaScript编写。这些页面可能是类似于文档的简单文本和图形。页面也可以是交互式的，或显示变化的信息。编写交互式服务器页面略微复杂一些，但却可以实现更丰富的网站。如今的大多数页面都是交互式的，并提供了购物车、动态可视化甚至复杂的社交网络等现代在线服务。

通俗的说,Web开发就是我们说的做网站.它分为网页部分和逻辑部分也就是我们说的前台页面展示与后台业务逻辑处理。前台负责与用户的交互显示数据，用到HTML标签布局页面,CSS样式渲染页面,JavaScript脚本(或AJAX、JQuery、Extjs)编写动态交互性强的页面；后台编写处理一些复杂业务逻辑的程序.可以用C#,JAVA,PHP等语言。

2.Web请求响应简单理解
客户端浏览器对服务器端进行一次请求的演示图：

<1>.客户端发送请求。客户端浏览器向服务器发送请求URL；
<2>.服务器接收请求。服务器接收到该浏览器发送的请求；
<3>.服务器生成HTML。服务器解析请求的URL，根据URL确定请求的目标资源文件；
　　这个资源文件通常是一个动态页面（如ASP，PHP，JSP，ASPX等文件）的网络地址（MVC结构的程序例外）。Web服务器根据动态页面文件的内容和URL中的参数，调用相应的资源（数据库数据或图片文件等等）组织数据，生成HTML页面。
<4>.服务端响应请求。生成HTML文档以后，服务器响应浏览器的请求，将生成的HTML文档发送给客户端浏览器；
<5>.客户端接收响应。浏览器接收服务端发出的请求得来HTML文档；
<6>.客户端解析HTML。浏览器对HTML文档进行解析，并加载相关的资源文件（JS，CSS，多媒体资源，内嵌网页）等，(在这里浏览器解悉完HTML文档以后，就会进行呈现，但同时也会向服务器发送请求来请求其它相关的资源文件)
<7>.服务器发送资源文件。服务器接到浏览器对资源文件的请求，将相应的资源文件响应给客户端浏览器；
<8>.客户端加载资源文件。客户端浏览器将接收服务器发送的资源文件，整理并呈现到页面中；
<9>.客户端从上到下加载。在进行页面呈现的时候，浏览器会从上到下执行HTML文档，当遇到相应的页面脚本的时候，会对脚本进行分析，并解释执行相应的脚本代码。

在第6步以后，我们就可以看到一部分页面内容了，不过可能是纯文本内容，没有样式，没有图片或其它资源。待到浏览器请求得到某资源的时候就会进行组织呈现，直到整个页面所有资源加载完毕,显示完成，请求响应完毕。

3.客户端解析HTML
<1>.解析HTML结构；
<2>.加载外部脚本和样式表文件；
<3>.解析并执行脚本代码；
<4>.构造HTML DOM模型；
<5>.加载图片等外部文件。

加载顺序实例：

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Title</title>
<style type="text/css">
body
{font-sie: 12px;
}
</style>
<link href="style.css" rel="stylesheet" type="text/css" media="all" />
<script src="js.js" type="text/javascript"></script>
</head>
<body>
<div>
<script type="text/javascript">
function f1() { }
</script>
<img src="1.gif" />
</div>
<script type="text/javascript">
function f2() { }
</script>
</body>
</html>

html → head → title → #text(网页标题) → style → 加载样式 → 解析样式 → link → 加载外部样式表文件 → 解析外部样式表 → script → 加载外部脚本文件 → 解析外部脚本文件 → 执行外部脚本 → body → div → script → 加载脚本 → 解析脚本 → 执行脚本 → img → script → 加载脚本 → 解析脚本 → 执行脚本 → 加载外部图像文件 → 页面初始化完毕

4.onload和ready的差异
这里需要注意的是onload和ready的差异：
一是ready，表示DOM文档树已经加载解析解析完成（不包含图片等非文字媒体文件）；
二是onload，指页面上所有的资源(包含图片等文件在内的所有元素)都加载完毕。

说ready比onload快最显著的是比如一个页面上有一个很大的图片，加载要好久，onload只有在图片加载完成之后执行，而ready不必等图片加载完成。
这种差异与window.onload和$(document).ready()的区别也是一致的吧。

5.Web相关技术和标准

参考博客：
《DOM加载顺序》
《深入理解BS结构应用程序》

转载于:https://www.cnblogs.com/SanMaoSpace/archive/2013/06/12/3132489.html

Web请求响应简单整理相关推荐

Web请求响应编码问题详解
乱码问题一直是困扰开发人员的比较头疼的问题,而发生在 web 请求响应中的乱码问题由于牵扯到比较多的协议框架和技术实现,又显得更加棘手.web 请求中的乱码一般容易出现在两个地方:一是所请求的资源名称 ...
spark+smack+openfire实现请求响应简单流程
当时我想知道的问题很简单就是服务端如何返回给客户端一个字符串或者数字或者布尔值客户端如何接收现在分享出来给和我一样的初学者泪奔中简单的查询好友测试,客户端成功发送请求,服务端接收并返回响应结 ...
Web Service之Soap请求响应内容中文编码解密
java模拟Soap请求测试Web Service接口,发现Web Service响应内容中的中文竟然是编码格式.比如: 中文:退保成功 Soap中文编码:退保成功我仔细分析后发现,退编码实际上就是 ...
ASP.NET Web API 记录请求响应数据到日志的一个方法
原文:ASP.NET Web API 记录请求响应数据到日志的一个方法原文:http://blog.bossma.cn/dotnet/asp-net-web-api-log-request-resp ...
一、服务端开发基础（搭建Web服务器、网络基础概念、请求响应流程、配置Apache、静态网站与动态网站）
一.建立你的第一个网站(目标) 前端开发最终还是属于 Web 开发中的一个分支,想要成为一名合格的前端开发人员,就必须要充分理解Web 的概念. 构建一个专业的网站是一项巨大的工作!对于新手我们 ...
http :请求响应报文-web服务-ajax-cors跨域
node:http 协议:请求响应报文-web服务-url与对象的转化-ajax-cors跨域 1 梳理重点 1.1搭建服务注意: ① 站点创建完成后,需要通过node命令启动 ② 创建站点的代码如 ...
Web 之 html 如何显示隐藏Html元素的两种方法简单整理
Web 之 html 如何显示隐藏Html元素的两种方法简单整理目录 Web 之 html 如何显示隐藏Html元素的两种方法简单整理一.简单介绍二.实现原理三.注意事项四.代码示例一.简 ...
Web登录很简单？开玩笑！
以下文章来源方志朋的博客,回复"666"获面试宝典本文通过 Web 登录的例子探讨安全问题,登录不仅仅是简单地表达提交和记录写入,其安全问题才是重中之重. 1. 一个简单的HTM ...
Web缓存相关知识整理
一.前言工作上遇到一个这样的需求,一个H5页面在APP端,如果勾选已读状态,则下次打开该链接,会跳过此页面.用到了HTML5 的本地存储 API 中的 localStorage作为解决方案,回顾了 ...

Web请求响应简单整理

Web请求响应简单整理相关推荐

最新文章

热门文章