从输入网址到出现网页到底发生了什么？（五）

郑二二狗

于 2019-08-28 19:41:28 发布

阅读量171

点赞数

本文链接：https://blog.csdn.net/qq_39426794/article/details/100125236

版权

总结

从输入网址到出现网页到底发生了什么？
1、浏览器将你输入的网页发往DNS进行解析，获得IP地址
2、浏览器自行组织符合HTTP协议格式的数据发往网址对于IP下的80端口——称作请求
3、服务器获得浏览器以TCP协议发送的字符串并进行以http格式对其进行分析，从而组织合理的内容发往浏览器。 ——称作响应
4、浏览器获得响应之后，对数据进行符合http协议要求的格式进行分析并调用解释器对获得的数据进行渲染从而显示出各种各样的网页

补充说明

渲染

大家也许会好奇，我们传输的是一个个字符串，为什么可以显示出这么丰富的界面呢？
或者说字符串和界面之间的转化是通过什么样的规则执行的呢？
这就不得不提一个机构了。

万维网联盟（W3C）创建于1994年，是Web技术领域最具权威和影响力的国际中立性技术标准机构。到目前为止，W3C已发布了200多项影响深远的Web技术标准及实施指南，如广为业界采用的超文本标记语言HTML（标准通用标记语言下的一个应用）、可扩展标记语言XML（标准通用标记语言下的一个子集）以及帮助残障人士有效获得Web信息的无障碍指南（WCAG）等，有效促进了Web技术的互相兼容，对互联网技术的发展和应用起到了基础性和根本性的支撑作用。

W3C对 html、css、xml等等标记语言进行了格式要求，和解析说明。
当服务器响应了这样的的标记语言（字符串）之后，浏览器就根据W3C的标准对标记语言进行解析从而显示出各种各样的界面。
W3C的存在，保证了同一个网址在不同的浏览器下打开显示的内容是基本一致的。

为什么说基本一致？
这里引出了软件开发的两个模式

B/S C/S

大家之前应该听说了B/S C/S这种说法，
即Browser/Server(浏览器/服务器)结构,Client/Server(客户端/服务器架构)。
大部分的软件都是CS架构，就是软件的客户端和服务器都由软件公司编写。
比如QQ、微信、支付宝等等。在这种模式下，客户端和服务器都使用socket进行自定义的通讯。
端口号自己规定，通讯的内容要求自己规定。客户端获得数据之后怎么解析，自己规定。

但是网页的访问是唯一的例外，在网页访问的模式下（B/S模式下），一家公司只能决定自己的服务器的代码编写。
端口号和通讯格式都是由http协议规定的。客户端由各种各样其他的公司编写。比如QQ浏览器、谷歌浏览器等等，公司本身和浏览器之间对于数据的展示靠W3C进行规范。但要命的是：
http协议是非常严格的协议。
W3C是一个松散的规定。所以各个浏览器对W3C的理解和兼容各不相同。
所以不能保证一个网站在不同浏览器下的展现完全相同。

说了这么多，大家应该已经明白了在HTTP协议和W3C的规范下，整个WEB领域的整体规则了。
既然浏览器不能由软件开发者自己固定，我们还是得学以致用。
下面将编写一个符合http格式的服务器和浏览器进行交互，来结束我们这个文章。

尝试编写一个服务器

<?php
$socket =stream_socket_server ("tcp://127.0.0.1:8080",$error,$errorMsg);
//本应严格按照浏览器的HTTP约定的端口80，但目前80端口已然被apache接管，故使用8080
if(!$socket)
{
	echo "Errormsg:".$errorMsg;
}
else
{
	echo ("HTTP服务器启动。");
	for(;;)
	{
		$client=stream_socket_accept($socket,-1);//最大阻塞时间MAX
		if($client)
		{
		//严格按照浏览器的HTTP约定组织返回的格式（即请求头格式）
		//  \r\n标识换行，符合上一课中对请求的格式，如果不加/r/n将不符合http格式，浏览器将不能识别。
			$http = fread($client,1024);//请求体
			$content = "HTTP/1.1 200 OK\r\nServer:http_imooc/1.0.0\r\nContent-Length:".strlen($http)."\r\n\r\n{$http}";
		//发送给浏览器
			fwrite($client, $content);
		}
		fclose($client);
	}
	fclose($socket);
}
?>

请大家运行这段代码，并在浏览器当中
输入127.0.0.1:8080
这个服务器代码将返回浏览器对服务器的请求。
（换句话说：这个代码将返回浏览器自行组织的请求字符串的内容。）
（使用不同浏览器，结果应该是不同的，至于为什么大家应该很清楚。）
相信这样可以让大家对整个体系有更好的了解。

学习补充

我在说明的过程中，
跳过了TCP三次握手、四次挥手的实现运输层原理。
同时也没有把服务器的响应代码进行拓展。
因为在实际的网站开发中，甚至服务器的响应变成http的格式都不是由程序员实现的。
更遑论TCP的实现细节。
过分的深入理解会阻止大家对整个过程的学习。
当然如果现在行有余力了，希望大家对TCP\UDP的细节进行具体的学习。
因为其实这也是非常重要的知识点。
**实际上浏览器和服务器之间的交互还存在异步交互（AJAX）的情况。**这种情况下响应体的作用一般是作为JS的数据进行界面数据的渲染，而不是页面加载的渲染。
在真实的浏览器的交互下，虽然服务器服务一个人非常迅速，可以一秒内完成服务。
但是如果服务器长期的处于TCP连接等待状态（客户端突然断网），将影响其他人进行网站访问。
如果一个人连接了服务器，但迟迟不与服务器断开连接，难道服务器不服务其他人吗？
每个语言在socket中都提供了不同的解决方法。
在JAVA中我们采用多线程的方法解决。
在PHP中一般使用IO复用的方法解决TCP多次连接的问题。

推荐阅读：PHP多路复用

期许

最后希望大家可以和我一样，以后可以有自信回答这个问题：
从输入网址到出现网页到底发生了什么？
1、浏览器将你输入的网页发往DNS进行解析，获得IP地址。
2、调用TCP协议和服务器建立连接（三次握手）
2、浏览器自行组织符合HTTP协议格式的数据发往网址对应IP下的80端口——称作请求
3、服务器获得浏览器以TCP协议发送的字符串并进行以http格式对其进行分析，从而组织合理的内容发往浏览器。 ——称作响应
5、浏览器获得响应之后，对数据进行符合http协议要求的格式进行分析提取出响应体并调用符合W3C规范的解释器对获得的数据进行渲染从而显示出各种各样的网页。
6、最后调用TCP协议和服务器断开连接（四次挥手）

希望通过对这个问题的回答，可以帮助大家更好的实现网站的开发。