百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术文章 > 正文

从浏览器地址栏输入url到显示页面的步骤

myzbx 2025-02-03 14:12 23 浏览

当您在浏览器地址栏输入 URL 并按下回车键时,浏览器将启动一个过程。

网络版本

1.DNS 解析:浏览器会检查 URL 中的域名并将其发送到 DNS 服务器以获取与该域名相对应的 IP 地址。

2.建立 TCP 连接:一旦 DNS 解析完成,浏览器将与该 IP 地址建立 TCP 连接。

3.发送 HTTP 请求:一旦 TCP 连接建立,浏览器将向服务器发送 HTTP 请求。请求消息中包含请求方法 (如 GET 或 POST)、URL 和任何请求头。

4.接收响应并处理:一旦服务器收到请求,它将发送 HTTP 响应。响应消息包含状态码、响应头和响应体。浏览器将接收响应并处理它。

5.渲染页面:一旦浏览器收到响应并解析它,它将使用 HTML、CSS 和 JavaScript 等语言解析页面并渲染出来。浏览器将下载和执行页面上所有的资源,如图片、样式表和脚本,以呈现出完整的页面。

6.关闭连接:最后,一旦浏览器完成渲染页面,它将关闭与服务器的连接。

这些步骤的顺序和细节可能会因浏览器和服务器的具体情况而有所不同。

基础版本

1.浏览器根据请求的URL交给DNS域名解析,找到真实IP,向服务器发起请求;

2.服务器交给后台处理完成后返回数据,浏览器接收文件(HTML、JS、CSS、图象等);

3.浏览器对加载到的资源(HTML、JS、CSS等)进行语法解析,建立相应的内部数据结构(如HTML的DOM);

4.载入解析到的资源文件,渲染页面,完成。

详细简版

1.从浏览器接收url到开启网络请求线程(这一部分可以展开浏览器的机制以及进程与线程之间的关系)

2.开启网络线程到发出一个完整的HTTP请求(这一部分涉及到dns查询,TCP/IP请求,五层因特网协议栈等知识)

3.l从服务器接收到请求到对应后台接收到请求(这一部分可能涉及到负载均衡,安全拦截以及后台内部的处理等等)

4.后台和前台的HTTP交互(这一部分包括HTTP头部、响应码、报文结构、cookie等知识,可以提下静态资源的cookie优化,以及编码解码,如gzip压缩等)

5.单独拎出来的缓存问题,HTTP的缓存(这部分包括http缓存头部,ETagcatch-control等)

6.浏览器接收到HTTP数据包后的解析流程(解析html-词法分析然后解析成dom树、解析css生成css规则树、合并成render树,然后layoutpainting渲染、复合图层的合成、GPU绘制、外链资源的处理、loadedDOMContentLoaded等)

7.CSS的可视化格式模型(元素的渲染规则,如包含块,控制框,BFCIFC等概念)

8.JS引擎解析过程(JS的解释阶段,预处理阶段,执行阶段生成执行上下文,VO,作用域链、回收机制等等)

9.其它(可以拓展不同的知识模块,如跨域,web安全,hybrid模式等等内容)

相关推荐

使用 Siemens Teamcenter Digital Reality Viewer 打造逼真的数字孪生

现代产品通常由数百万个部件组成,需要复杂的设计和协作。工业世界在管理复杂性方面面临重大挑战,传统的可视化工具无法渲染这些大型的多CAD组件,从而无法充分利用数字孪生的优势。为了解决这些难题,西门子...

如何在JavaScript中实现数字输入框的范围限制?

在JavaScript语言中,实现数字输入框的范围限制可以通过多种方式实现,最常见的方式是利用JavaScript的事件监听机制,和通过JavaScript的条件判断语句来实现范围限制。以...

2.3.8.J速算24点终极挑战(速算24点题目及答案)

各位数学高手、脑力达人,今天给大家带来一道超烧脑的**24点挑战**!**数字:2、3、8、J(J=11规则很简单:**用加减乘除和括号,把四个数字组合成24!每个数字只能用一次!****看起...

分布式系统进阶二十一之短链接生成原理

前言短链接(ShortURL)是一种通过缩短网页链接长度来方便分享的技术。相比于传统的长链接,短链接更简洁明了,更易于在社交媒体等平台上分享和传播。在本文中,我们将会详细解释短链接的定义、作用及其构...

一、SpringBoo中Mybatis多数据源动态切换

我们以一个实例来详细说明一下如何在SpringBoot中动态切换MyBatis的数据源。一、需求1、用户可以界面新增数据源相关信息,提交后,保存到数据库2、保存后的数据源需要动态生效,并且可以由用户动...

「JS 逆向百例」层层嵌套!某加速商城 RSA 加密

声明本文章中所有内容仅供学习交流,敏感网址、数据接口均已做脱敏处理,严禁用于商业用途和非法用途,否则由此产生的一切后果均与作者无关,若有侵权,请联系我立即删除!逆向目标目标:某加速商城登录接口主页:a...

Spring Data Jpa 介绍和详细入门案例搭建

1.SpringDataJPA的概念在介绍SpringDataJPA的时候,我们首先认识下Hibernate。Hibernate是数据访问解决技术的绝对霸主,使用O/R映射(Object-Re...

SpringBoot 开发 Web 系统,快速入门指南!

01、背景介绍在之前的文章中,我们简单的介绍了SpringBoot项目的创建过程,了解了SpringBoot开箱即用的特性,本篇文章接着上篇的内容继续介绍SpringBoot用于we...

Nacos3.0重磅来袭!全面拥抱AI,单机及集群模式安装详细教程!

之前和大家分享过JDK17的多版本管理及详细安装过程,然后在项目升级完jdk17后又发现之前的注册和配置中心nacos又用不了,原因是之前的nacos1.3版本的,版本太老了,已经无法适配当前新的JD...

golang语言的魅力精华之玩转通道channel 值得你反复阅读100遍

通道用例大全在阅读本文之前,请先阅读通道一文。那篇文章详细地解释了通道类型和通道值,以及各种通道操作的规则细节。一个Go新手程序员可能需要反复多次阅读那篇文章和当前这篇文章来精通Go通道编程。本文...

2小时快速搭建一个高可用的IM系统

“笔者2019年参加了一次Gopher大会,有幸听探探的架构师分享了他们2019年微服务化的过程。图片来自Pexels本文快速搭建的IM系统也是使用Go语言来快速实现的,这里先和...

分库分表以后,如何管理几万张分片表?

大家好,我是小富~ShardingSphere实现分库分表,如何管理分布在不同数据库实例中的成千上万张分片表?上边的问题是之前有个小伙伴看了我的分库分表的文章,私下咨询我的,看到他的提问我第一感觉就是...

Spring Boot JDBC 与 JdbcTemplate 全面指南(万字保姆级教程)

一、SpringBootJDBC基础1.1JDBC简介与演进JDBC(JavaDatabaseConnectivity)是Java语言中用来规范客户端程序如何访问数据库的应用程序...

Flink SQL 知其所以然(六)| 维表 join 的性能优化之路(上)

废话不多说,咱们先直接上本文的目录和结论,小伙伴可以先看结论快速了解博主期望本文能给小伙伴们带来什么帮助:背景及应用场景介绍:博主期望你能了解到,flinksql提供了轻松访问外部存储的loo...

大数据Hadoop之——Flink Table API 和 SQL(单机Kafka)

一、TableAPI和FlinkSQL是什么TableAPI和SQL集成在同一套API中。这套API的核心概念是Table,用作查询的输入和输出,这套API都是批处理和...