浏览器访问网站的流程（浏览器访问网站的基本流程）

大家好！今天让创意岭的小编来大家介绍下关于浏览器访问网站的流程的问题，以下是小编对此问题的归纳整理，让我们一起来看看吧。

开始之前先推荐一个非常厉害的Ai人工智能工具，一键生成原创文章、方案、文案、工作计划、工作报告、论文、代码、作文、做题和对话答疑等等

只需要输入关键词，就能返回你想要的内容，越精准，写出的就越详细，有微信小程序端、在线网页版、PC客户端

官网：https://ai.de1919.com。

创意岭作为行业内优秀的企业，服务客户遍布全球各地，如需了解SEO相关业务请拨打电话175-8598-2043，或添加微信：1454722008

本文目录:

• 1、已知域名和访问端口怎么访问

• 2、最全从输入URL到浏览器显示页面都发生了什么前端浏览器渲染流程

• 3、访问网站的过程？

• 4、了解为何我们浏览器中输入网址，就能看到网页了，流程如怎么样的？

一、已知域名和访问端口怎么访问

每次进入自己的网站都要输入端口号，很不舒服。于是今天查了一下，怎么用域名直接访问自己的网站。

带端口和项目名称的访问方式如下：

例如：www.xxx.com:8080/项目名

纯域名访问解决方法：

在服务器的conf目录下找到server.xml 将访问端口改为浏览器默认访问端口80

<Connector executor="tomcatThreadPool"

port="80" protocol="HTTP/1.1"

connectionTimeout="20000"

redirectPort="8443" />

登录后复制

将port 的值改为80

2.直接访问文件

依旧是tomact里conf/sever.xml文件

在host标签里加上如下配置：

<Context path="" docBase="C:\soft\idea\idea\apache-tomcat-8.5.47\webapps\项目名" debug="0" reloadable="true" />

登录后复制

注：此处docBase的值为你本机tomact的路径

下图为我的电脑的配置：

最后重启tomact，OK成功了

我是乐乐呀，感谢您的阅读。如果您觉得不错，那就点个赞吧，您的支持是我最大的动力。谢谢

http

tomcat

江诗丹顿名表维修,专业技术,正品配件更换

精选推荐

广告



浏览器通过网路域名访问网址过程

1175阅读·0评论·0点赞

2020年8月25日

将域名直接映射到网站首页（通过域名即可访问网站首页）

1.8W阅读·11评论·2点赞

2018年11月28日

【免费】多种方法手把手教你如何将自己做的网页做成网络链接（直接访问）

8408阅读·65评论·121点赞

2022年11月13日

域名直接访问web首页

2905阅读·0评论·0点赞

2019年3月17日

浏览器输入域名访问全流程解析

4514阅读·1评论·4点赞

2021年8月12日

域名访问网站首页的一种简单方式

1824阅读·0评论·2点赞

2017年4月13日

使用域名访问网站或者静态页面

5390阅读·0评论·0点赞

2022年8月9日

怎样才能使用域名访问网站？

2.3W阅读·0评论·5点赞

2022年3月1日

可以直接访问网址“glgoo.com”或“scholar.glgoo.com”便可以直接打开谷歌或谷歌学术

2545阅读·0评论·0点赞

2018年11月26日

各大搜索引擎网站登录入口

654阅读·0评论·0点赞

2007年10月3日

使用域名访问服务器网站,使用域名访问网站是啥意思

3534阅读·0评论·1点赞

2021年8月4日

域名访问和ip访问区别

8674阅读·0评论·1点赞

2019年9月26日

如果通过访问域名就能访问到网站首页

1295阅读·0评论·0点赞

2019年7月11日

网站域名访问

685阅读·0评论·0点赞

2022年4月21日

最实用的上网网址一览表

3016阅读·0评论·0点赞

2022年2月14日

如何直接通过域名访问页面，无需添加端口号（nginx反向代理实现直接域名访问）

1.3W阅读·16评论·15点赞

2021年11月3日

域名指向主机IP地址，通过域名:8080才能访问网站，去掉后面的8080；或者其他的端口号，直接使用域名访问网站

二、最全从输入URL到浏览器显示页面都发生了什么前端浏览器渲染流程

首先了解一下URL的组成：

从上面的URL可以看出，一个完整的URL包括以下几部分：

1、协议部分：该URL的协议部分为“http：”，这代表网页使用的是HTTP协议。在Internet中可以使用多种协议，如HTTP，FTP等等本例中使用的是HTTP协议。在"HTTP"后面的“//”为分隔符

2、域名部分：该URL的域名部分为“www.baidu.com”。一个URL中，也可以使用IP地址作为域名使用

3、端口部分：跟在域名后面的是端口，域名和端口之间使用“:”作为分隔符。端口不是一个URL必须的部分，如果省略端口部分，将采用默认端口80

4、虚拟目录部分：从域名后的第一个“/”开始到最后一个“/”为止，是虚拟目录部分。虚拟目录也不是一个URL必须的部分。本例中的虚拟目录是“/news/”

5、文件名部分：从域名后的最后一个“/”开始到“？”为止，是文件名部分，如果没有“?”,则是从域名后的最后一个“/”开始到“#”为止，是文件部分，如果没有“？”和“#”，那么从域名后的最后一个“/”开始到结束，都是文件名部分。本例中的文件名是“index.asp”。文件名部分也不是一个URL必须的部分，如果省略该部分，则使用默认的文件名

6、锚部分：从“#”开始到最后，都是锚部分。本例中的锚部分是“name”。锚部分也不是一个URL必须的部分

7、参数部分：从“？”开始到“#”为止之间的部分为参数部分，又称搜索部分、查询部分。本例中的参数部分为“boardID=5&ID=24618&page=1”。参数可以允许有多个参数，参数与参数之间用“&”作为分隔符。

很多大公司面试喜欢问这样一道面试题， 输入URL到看见页面发生了什么？ ,今天我们来总结一下。 简单来说，共有以下几个过程

下面我们来看看具体的细节

输入 www.google.com 网址后，首先在本地的域名服务器中查找，没找到去根域名服务器查找，没有再去 com 顶级域名服务器查找，，如此的类推下去，直到找到IP地址，然后把它记录在本地，供下次使用。大致过程就是 . -> .com -> google.com. -> www.google.com. 。 (你可能觉得我多写 .，并木有，这个.对应的就是根域名服务器，默认情况下所有的网址的最后一位都是.，既然是默认情况下，为了方便用户，通常都会省略，浏览器在请求DNS的时候会自动加上)

既然已经懂得了解析的具体过程，我们可以看到上述一共经过了N个过程，每个过程有一定的消耗和时间的等待，因此我们得想办法解决一下这个问题！

DNS存在着多级缓存，从离浏览器的距离排序的话，有以下几种: 浏览器缓存，系统缓存，路由器缓存，IPS服务器缓存，根域名服务器缓存，顶级域名服务器缓存，主域名服务器缓存。

在你的chrome浏览器中输入:chrome://dns/，你可以看到chrome浏览器的DNS缓存。

系统缓存主要存在/etc/hosts(Linux系统)中

检查浏览器是否有缓存

通过 Cache-Control 和 Expires 来检查是否命中强缓存，命中则直接取本地磁盘的html（状态码为200 from disk(or memory) cache，内存or磁盘）；

如果没有命中强缓存，则会向服务器发起请求（先进行下一步的TCP连接），服务器通过 Etag 和 Last-Modify 来与服务器确认返回的响应是否被更改（协商缓存），若无更改则返回状态码（304 Not Modified）,浏览器取本地缓存；

若强缓存和协商缓存都没有命中则返回请求结果。

不知道你们有没有注意这样一件事，你访问http://baidu.com的时候，每次响应的并非是同一个服务器（IP地址不同），一般大公司都有成百上千台服务器来支撑访问，假设只有一个服务器，那它的性能和存储量要多大才能支撑这样大量的访问呢？DNS可以返回一个合适的机器的IP给用户，例如可以根据每台机器的负载量，该机器离用户地理位置的距离等等，这种过程就是DNS负载均衡

TCP 协议通过三次握手建立连接。

翻译成大白话就是：

为什么是3次？ ：避免 历史 连接，确认客户端发来的请求是这次通信的人。

为什么不是4次？ ：3次够了第四次浪费

建立连接的过程是利用客户服务器模式，假设主机A为客户端，主机B为服务器端。

采用三次握手是为了防止失效的连接请求报文段突然又传送到主机B，因而产生错误。失效的连接请求报文段是指：主机A发出的连接请求没有收到主机B的确认，于是经过一段时间后，主机A又重新向主机B发送连接请求，且建立成功，顺序完成数据传输。考虑这样一种特殊情况，主机A第一次发送的连接请求并没有丢失，而是因为网络节点导致延迟达到主机B，主机B以为是主机A又发起的新连接，于是主机B同意连接，并向主机A发回确认，但是此时主机A根本不会理会，主机B就一直在等待主机A发送数据，导致主机B的资源浪费。

采用两次握手不行，原因就是上面说的失效的连接请求的特殊情况。而在三次握手中， client和server都有一个发syn和收ack的过程， 双方都是发后能收， 表明通信则准备工作OK.

为什么不是四次握手呢？ 大家应该知道通信中著名的蓝军红军约定， 这个例子说明， 通信不可能100%可靠， 而上面的三次握手已经做好了通信的准备工作， 再增加握手， 并不能显著提高可靠性， 而且也没有必要。

第一次握手 ：

客户端发送syn包(Seq=x)到服务器，并进入SYN_SEND状态，等待服务器确认；

第二次握手：

服务器收到syn包，必须确认客户的SYN（ack=x+1），同时自己也发送一个SYN包（Seq=y），即SYN+ACK包，此时服务器进入SYN_RECV状态；

第三次握手：

客户端收到服务器的SYN ACK包，向服务器发送确认包ACK(ack=y+1)，此包发送完毕，客户端和服务器进入ESTABLISHED状态，完成三次握手。

握手过程中传送的包里不包含数据，三次握手完毕后，客户端与服务器才正式开始传送数据。理想状态下，TCP连接一旦建立，在通信双方中的任何一方主动关闭连接之前，TCP 连接都将被一直保持下去。

要先申请CA证书，并安装在服务器上（一个文件，配置nginx支持监听443端口开启ssl并设置证书路径）

浏览器发送请求；

网站从浏览器发过来的加密规则中选一组自身也支持的加密算法和hash算法，并向浏览器发送带有公钥的证书，当然证书还包含了很多信息，如网站地址、证书的颁发机构、过期时间等。

浏览器解析证书。

验证证书的合法性。如颁发机构是否合法、证书中的网站地址是否与访问的地址一致，若不合法，则浏览器提示证书不受信任，若合法，浏览器会显示一个小锁头。

若合法，或用户接受了不合法的证书，浏览器会生成一串随机数的密码（即密钥），并用证书中提供的公钥加密。

使用约定好的hash计算握手消息，并使用生成的随机数（即密钥）对消息进行加密，最后将之前生成的所有消息一并发送给网站服务器。

网站服务器解析消息。用已有的私钥将密钥解密出来，然后用密钥解密发过来的握手消息，并验证是否跟浏览器传过来的一致。然后再用密钥加密一段握手消息，发送给浏览器。

浏览器解密并计算握手消息的HASH，如果与服务端发来的HASH一致，此时握手过程结束，之后所有的通信数据将由之前浏览器生成的随机密码并利用对称加密算法进行加密。这里浏览器与网站互相发送加密的握手消息并验证，目的是为了保证双方都获得了一致的密码，并且可以正常的加密解密数据，为后续真正数据的传输做一次测试。

发送HTTP请求

首先科补一个小知识，HTTP的端口为80/8080，而HTTPS的端口为443

发送HTTP请求的过程就是构建HTTP请求报文并通过TCP协议中发送到服务器指定端口 请求报文由 请求行 ， 请求抱头 ， 请求正文 组成。

请求行

请求行的格式为 Method Request-URL HTTP-Version CRLF eg: GET index.html HTTP/1.1 常用的方法有: GET , POST , PUT , DELETE , OPTIONS , HEAD 。

常见的请求方法区别

这里主要展示 POST 和 GET 的区别

常见的区别

注意一点你也可以在GET里面藏body，POST里面带参数

重点区别

GET 会产生一个 TCP 数据包，而 POST 会产生两个 TCP 数据包。

详细的说就是：

注意一点，并不是所有的浏览器都会发送两次数据包，Firefox就发送一次

请求报头

请求报头允许客户端向服务器传递请求的附加信息和客户端自身的信息。

从图中可以看出，请求报头中使用了Accept, Accept-Encoding, Accept-Language, Cache-Control, Connection, Cookie等字段。Accept用于指定客户端用于接受哪些类型的信息，Accept-Encoding与Accept类似，它用于指定接受的编码方式。Connection设置为Keep-alive用于告诉客户端本次HTTP请求结束之后并不需要关闭TCP连接，这样可以使下次HTTP请求使用相同的TCP通道，节省TCP连接建立的时间。

请求正文

当使用POST, PUT等方法时，通常需要客户端向服务器传递数据。这些数据就储存在请求正文中。在请求包头中有一些与请求正文相关的信息，例如: 现在的Web应用通常采用Rest架构，请求的数据格式一般为json。这时就需要设置 Content-Type: application/json 。

更重要的事情-HTTP缓存

HTTP属于客户端缓存，我们常认为浏览器有一个缓存数据库，用来保存一些静态文件，下面我们分为以下几个方面来简单介绍HTTP缓存

缓存的规则

缓存规则分为 强制缓存 和 协商缓存

强制缓存

当缓存数据库中有客户端需要的数据，客户端直接将数据从其中拿出来使用（如果数据未失效），当缓存服务器没有需要的数据时，客户端才会向服务端请求。

又称对比缓存。客户端会先从缓存数据库拿到一个缓存的标识，然后向服务端验证标识是否失效，如果没有失效服务端会返回304，这样客户端可以直接去缓存数据库拿出数据，如果失效，服务端会返回新的数据

强制缓存

对于强制缓存，服务器响应的header中会用两个字段来表明——Expires和Cache-Control。

Expires

Exprires的值为服务端返回的数据到期时间。当再次请求时的请求时间小于返回的此时间，则直接使用缓存数据。但由于服务端时间和客户端时间可能有误差，这也将导致缓存命中的误差，另一方面，Expires是HTTP1.0的产物，故现在大多数使用Cache-Control替代。

Cache-Control

Cache-Control有很多属性，不同的属性代表的意义也不同。

协商缓存

协商缓存需要进行对比判断是否可以使用缓存。浏览器第一次请求数据时，服务器会将缓存标识与数据一起响应给客户端，客户端将它们备份至缓存中。再次请求时，客户端会将缓存中的标识发送给服务器，服务器根据此标识判断。若未失效，返回304状态码，浏览器拿到此状态码就可以直接使用缓存数据了。

对于协商缓存来说，缓存标识我们需要着重理解一下，下面我们将着重介绍它的两种缓存方案。

Last-Modified

Last-Modified：服务器在响应请求时，会告诉浏览器资源的最后修改时间。

从字面上看，就是说：从某个时间节点算起，是否文件被修改了

这两个的区别是一个是修改了才下载一个是没修改才下载。

Last-Modified 说好却也不是特别好，因为如果在服务器上，一个资源被修改了，但其实际内容根本没发生改变，会因为Last-Modified时间匹配不上而返回了整个实体给客户端（即使客户端缓存里有个一模一样的资源）。为了解决这个问题，HTTP1.1推出了Etag。

Etag

Etag：服务器响应请求时，通过此字段告诉浏览器当前资源在服务器生成的唯一标识（生成规则由服务器决定）

但是实际应用中由于Etag的计算是使用算法来得出的，而算法会占用服务端计算的资源，所有服务端的资源都是宝贵的，所以就很少使用Etag了。

缓存的优点

不同刷新的请求执行过程

浏览器地址栏中写入URL，回车

F5

Ctrl+F5

服务器处理请求并返回HTTP报文

它会对TCP连接进行处理，对HTTP协议进行解析，并按照报文格式进一步封装成HTTP Request对象，供上层使用。这一部分工作一般是由Web服务器去进行，我使用过的Web服务器有Tomcat, Nginx和Apache等等 HTTP报文也分成三份， 状态码 ， 响应报头 和 响应报文

状态码

状态码是由3位数组成，第一个数字定义了响应的类别，且有五种可能取值:

平时遇到比较常见的状态码有:200, 204, 301, 302, 304, 400, 401, 403, 404, 422, 500

常见状态码区别

200 成功

请求成功，通常服务器提供了需要的资源。

204 无内容

服务器成功处理了请求，但没有返回任何内容。

301 永久移动

请求的网页已永久移动到新位置。 服务器返回此响应（对 GET 或 HEAD 请求的响应）时，会自动将请求者转到新位置。

302 临时移动

服务器目前从不同位置的网页响应请求，但请求者应继续使用原有位置来进行以后的请求。

304 未修改

自从上次请求后，请求的网页未修改过。 服务器返回此响应时，不会返回网页内容。

400 错误请求

服务器不理解请求的语法。

401 未授权

请求要求身份验证。 对于需要登录的网页，服务器可能返回此响应。

403 禁止

服务器拒绝请求。

404 未找到

服务器找不到请求的网页。

422 无法处理

请求格式正确，但是由于含有语义错误，无法响应

500 服务器内部错误

服务器遇到错误，无法完成请求。

响应报头

常见的响应报头字段有: Server, Connection...。

响应报文

你从服务器请求的HTML,CSS,JS文件就放在这里面

就是 Webkit 解析渲染页面的过程。

这个过程涉及两个比较重要的概念 回流 和 重绘 ，DOM结点都是以盒模型形式存在，需要浏览器去计算位置和宽度等，这个过程就是回流。等到页面的宽高，大小，颜色等属性确定下来后，浏览器开始绘制内容，这个过程叫做重绘。浏览器刚打开页面一定要经过这两个过程的，但是这个过程非常非常非常消耗性能，所以我们应该尽量减少页面的回流和重绘

这个过程中可能会有dom操作、ajax发起的http网络请求等。

web-socket、ajax等，这个过程通常是为了获取数据

setTimeout、setInterval、Promise等宏任务、微任务队列

当Render Tree中部分或全部元素的尺寸、结构、或某些属性发生改变时，浏览器重新渲染部分或全部文档的过程称为回流。

会导致回流的操作：

一些常用且会导致回流的属性和方法：

当页面中元素样式的改变并不影响它在文档流中的位置时（例如：color、background-color、visibility等），浏览器会将新样式赋予给元素并重新绘制它，这个过程称为重绘。

JS的解析是由浏览器的JS引擎完成的。由于JavaScript是单线程运行，也就是说一个时间只能干一件事，干这件事情时其他事情都有排队，但是有些人物比较耗时（例如IO操作），所以将任务分为 同步任务 和 异步任务 ，所有的同步任务放在主线程上执行，形成执行栈，而异步任务等待，当执行栈被清空时才去看看异步任务有没有东西要搞，有再提取到主线程执行，这样往复循环（冤冤相报何时了，阿弥陀佛），就形成了Event Loop事件循环，下面来看看大人物

先看一段代码

结果我想大家都应该知道。主要来介绍JavaScript的解析，至于Promise等下一节再说

JavaScript是一门单线程语言，尽管H5中提出了 Web-Worker ，能够模拟实现多线程，但本质上还是单线程，说它是多线程就是扯淡。

既然是单线程，每个事件的执行就要有顺序，比如你去银行取钱，前面的人在进行，后面的就得等待，要是前面的人弄个一两个小时，估计后面的人都疯了，因此，浏览器的JS引擎处理JavaScript时分为 同步任务 和 异步任务

这张图我们可以清楚看到

js引擎存在monitoring process进程，会持续不断的检查主线程执行栈是否为空，一旦为空，就会去Event Queue那里检查是否有等待被调用的函数。 估计看完这些你对事件循环有一定的了解，但是事实上我们看对的没这么简单，通常我们会看到Promise，setTimeout，process.nextTick（），这个时候你和我就懵逼。

不同任务会进入不同的任务队列来执行。 JS引擎开始工作后，先在宏任务中开始第一次循环（ script里面先执行，不过我喜欢把它拎出来，直接称其进入执行栈 ），当主线程执行栈全部任务被清空后去微任务看看，如果有等待执行的任务，执行全部的微任务（其实将其回调函数推入执行栈来执行），再去宏任务找最先进入队列的任务执行，执行这个任务后再去主线程执行任务（例如执行```console.log("hello world")这种任务），执行栈被清空后再去微任务，这样往复循环（冤冤相报何时了）

下面来看一段代码

我们看看它的执行情况

具体的执行过程大致就是这样。

三、访问网站的过程？

1，浏览器通常指 IE FireFox等，客户端使用的程序

2，每台连接互联网的机器都有一个唯一的IP地址，IP地址是由4个0到256的数组成的，比如：222.131.0.229，127.0.0.1，由于每台联网的机器的IP地址都是独立的，因此可以通过IP判断一台机器。

网站所在的服务器通常有一个固定的IP地址，而我们浏览者每次上网的IP地址通常都不一样，IP地址是由ISP分配的。

域名服务器(domain name server)的简称为DNS，它存储了域名与IP地址对应的列表。

3，浏览器得到域名指向的IP后，浏览器会把我们输入的域名转化为HTTP的服务请求，例如，输入 www.mayi1992.com，可以转化为 http://www.mayi1992.com/，通过这种方式浏览器向服务器发出了请求。

由于输入的是域名，因此服务器接收到请求后，会查找域名下的默认网页(通常为default.php或default.html)，如果直接输入http://www.mayi1992.com/default.php就直接查找这个页面。

4，返回的请求通常是一些文件，包括文字信息(.html .css .asp文件等)，图片，flash等(每个文件都要有一个唯一的网址，比如 http://www.mayi1992.com/xhtml/)

5，浏览器将这些信息组织成用户可以查看的网页

四、了解为何我们浏览器中输入网址，就能看到网页了，流程如怎么样的？

因为有DNS，DNS

是域名系统

(Domain

Name

System)

的缩写，该系统用于命名组织到域层次结构中的计算机和网络服务。在Internet上域名与IP地址之间是一对一（或者多对一）的，域名虽然便于人们记忆，但机器之间只能互相认识IP地址，它们之间的转换工作称为域名解析，域名解析需要由专门的域名解析服务器来完成，DNS就是进行域名解析的服务器。

DNS

命名用于

Internet

等

TCP/IP

网络中，通过用户友好的名称查找计算机和服务。当用户在应用程序中输入

DNS

名称时，DNS

服务可以将此名称解析为与之相关的其他信息，如

IP

地址。因为，你在上网时输入的网址，是通过域名解析系统解析找到了相对应的IP地址，这样才能上网。其实，域名的最终指向是IP。

以上就是关于浏览器访问网站的流程相关问题的回答。希望能帮到你，如有更多相关问题，您也可以联系我们的客服进行咨询，客服也会为您讲解更多精彩的知识和内容。

推荐阅读：

怎么强制关闭浏览器网页（怎么强制关闭浏览器网页窗口）

浏览不良网站10次让去派出所（浏览不良网站10次让去派出所会打电话吗-）

浏览广告赚佣金的app（广告赚钱平台app）

杭州法院编外人员（杭州法院编外人员待遇）

主播住什么房子不扰民（主播都是住什么房）