【高频】从输入URL到页面展示到底发生了什么?

一、相关衍生面试问题:

浏览器输入美团网站,从回车到浏览器展示经历了哪些过程 ?

http输入网页之后的流程?

百度搜索页面,从点开搜索框,到显示搜索页面经历了什么?

二、探究各个过程:

(以下回答针对问题1回答)

1. DNS 解析

  • 浏览器首先会检查本地 DNS 缓存,看是否有美团网站的 IP 地址。如果没有,则会向本地 DNS 服务器发送请求,查询美团网站的域名对应的 IP 地址。
  • 本地 DNS 服务器可能无法直接找到美团网站的 IP 地址,它会向根域名服务器发送请求,根域名服务器会指引本地 DNS 服务器去查询 .com 域名的顶级域名服务器。
  • 顶级域名服务器会指引本地 DNS 服务器去查询美团网站的域名服务器。
  • 美团网站的域名服务器会最终返回美团网站的 IP 地址给本地 DNS 服务器。
  • 本地 DNS 服务器将 IP 地址返回给浏览器,并将其缓存起来。

【涉及到的相关知识:

1.DNS缓存:存储近期浏览、连接过的网站服务器的IP用的一个缓存系统。浏览器会尽可能利用缓存来提高性能,减少不必要的网络请求和DNS解析。

2.域名服务器:根域名服务器、顶级域名服务器(org\com\edu)、权限域名服务器、本地域名服务器[迭代查询(常用) | | 递归查询]。

3.DNS解析:用来把便于人们记忆的主机域名和电子邮件地址映射为计算机易于识别的IP地址。

2. 建立 TCP 连接

  • 浏览器使用获得的 IP 地址,尝试与美团网站的服务器建立 TCP 连接。
  • 浏览器会发送一个 SYN 包(同步请求)到服务器,服务器收到后会回复一个 SYN-ACK 包(同步确认)。
  • 浏览器收到 SYN-ACK 包后,会发送一个 ACK 包(确认),完成三次握手过程,建立 TCP 连接。

【相关知识点:

1.三次握手的原因:首要原因是为了防止旧的重复连接初始化造成混乱,最主要原因就是防止「历史连接」初始化了连接

2.每次建立 TCP 连接时,初始化的序列号都要求不一样:为了防止历史报文被下一个相同四元组的连接接收(主要方面);为了安全性,防止黑客伪造的相同序列号的 TCP 报文被对方接收。

3.SYN攻击属于DDoS攻击的一种,它利用TCP协议缺陷,通过发送大量的半连接请求,耗费CPU和内存资源。【最直接的表现就会把 TCP 半连接队列打满,这样当 TCP 半连接队列满了,后续再在收到 SYN 报文就会丢弃,导致客户端无法和服务端建立连接。】

  • 半连接队列,也称 SYN 队列;
  • 全连接队列,也称 accept 队列;

4.避免办法:

  • 调大 netdev_max_backlog;
  • 增大 TCP 半连接队列;
  • 开启 tcp_syncookies;
  • 减少 SYN+ACK 重传次数

3. 发送 HTTP 请求

  • 浏览器向美团网站的服务器发送一个 HTTP 请求,包含以下信息:
    • 请求方法:GET
    • 请求 URL:美团网站的首页地址
    • 请求头:包含一些浏览器信息、语言信息、Cookie 信息等。
  • 服务器收到请求后,会根据请求信息进行处理。

【相关知识点:

1.post、get、put、delete就是对这个资源进行增、删、改、查的操作!

2.URI 用字符串标识某一互联网资源【身份证号】,而 URL 表示资源的地点【居住地址】

3.Cookie为“小型文本文件”,是某些网站为了辨别用户身份,进行Session跟踪而储存在用户本地终端上的数据(通常经过加密),由用户客户端计算机暂时或永久保存的信息

4. 服务器处理请求

  • 服务器会根据请求 URL,找到对应的页面文件。
  • 服务器会根据页面文件的内容,生成 HTML 代码。
  • 服务器会根据请求头中的 Cookie 信息,判断用户是否已登录,并根据用户状态,添加一些个性化的内容到 HTML 代码中。
  • 服务器会根据请求头中的语言信息,选择合适的语言版本。

【相关知识点:

1.跨站请求伪造(Cross-Site Request Forgery,简称CSRF)是指,攻击者可能利用网页中的恶意代码强迫受害者浏览器向被攻击的Web站点发送伪造的请求,篡夺受害者的认证Cookie等身份信息,从而假冒受害者对目标站点执行指定的操作。

2.保护措施主要有:(1 )加入MAC以进行完整性校验;(2)防止非法用户非法截获后的重放,可以让用户对相关信息进行数字签名,加强有效性验证;(3)对Cookie本身进行随机密钥加密,保证Cookie本身的信息安全。

5. 服务器返回响应

  • 服务器将生成的 HTML 代码,以及一些其他信息(例如图片、CSS、JavaScript 文件等),打包成 HTTP 响应,发送回浏览器。
  • 响应头包含一些状态码、内容类型、缓存信息等。

6. 浏览器解析响应

  • 浏览器收到响应后,会解析响应头中的状态码。
    • 如果状态码为 200,表示请求成功,浏览器会继续解析响应内容。
    • 如果状态码为 404,表示页面未找到,浏览器会显示错误页面。
  • 浏览器会解析响应内容中的 HTML 代码,并将其渲染成网页。
  • 浏览器会加载响应内容中的图片、CSS、JavaScript 文件,并将其应用到网页中。

【相关知识点:

  • 1xx(信息性状态码):表示接收的请求正在处理。
  • 2xx(成功状态码):表示请求正常处理完毕。
  • 3xx(重定向状态码):需要后续操作才能完成这一请求。
  • 4xx(客户端错误状态码):表示请求包含语法错误或无法完成。
  • 5xx(服务器错误状态码):服务器在处理请求的过程中发生了错误。

7. 网页展示

  • 浏览器将渲染好的网页展示给用户。

8. 持续交互

  • 用户在网页上进行操作,例如点击链接、提交表单等,浏览器会发送新的 HTTP 请求到服务器,服务器会根据请求进行处理,并返回新的响应,浏览器会继续更新网页内容。

三、面试回答:

  1. 用户在浏览器地址栏输入"meituan.com"并按下回车键。

  2. 浏览器首先会查看自己的缓存,看是否之前已经访问过这个网站并缓存了相关资源。如果缓存中有相关的资源,浏览器就可以直接使用缓存中的内容,无需进行其他操作。

  3. 如果缓存中没有找到所需的资源,浏览器就需要进行DNS解析,查找"meituan.com"对应的IP地址。这个过程中,浏览器会先查看本地DNS缓存,如果没有找到就会向DNS服务器发起查询请求。

  4. 获得IP地址后,浏览器会向该IP地址发起HTTP请求,向web服务器请求获取"meituan.com"网页的内容。

  5. web服务器收到请求后,会处理并生成相应的HTML页面内容,然后将其返回给浏览器。

  6. 浏览器收到HTML页面内容后,会对其进行解析和渲染,构建出网页的DOM树并显示出来。

  7. 在渲染网页的过程中,还可能需要加载额外的资源,如CSS文件、JavaScript文件、图片等。对于这些资源,浏览器也会遵循之前的流程,先检查缓存,再进行DNS解析和网络请求。

  8. 当所有必需的资源都加载完毕后,浏览器就能将完整的网页呈现给用户。

【下图为代码随想录推荐回答:】

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/diannao/14632.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

maven--解决Idea没有拉取SNAPSHOT的问题

原文网址:maven--解决Idea没有拉取SNAPSHOT的问题_IT利刃出鞘的博客-CSDN博客 简介 本文介绍Idea解决maven没有拉取SNAPSHOT的问题。 问题描述 项目依赖了以-SNAPSHOT结尾的包,它更新了。Idea点了重新导入后没有拉取到最新的包: 解决方案…

从“图形可视化”到“图生代码”,低代码平台的新挑战

前言: 低代码平台最大的一个特点就是可视化,将代码采用可视化的方式展示管理。一时间拥有图形化界面的各类系统都挂上了低代码的标签。但更多的代码从业者在使用中却发现,在众多的低代码平台中都是“别人家的代码”其可视化主要是别人家的代…

如何解决vcruntime140.dll丢失问题,详细介绍5种靠谱的解决方法

vcruntime140.dll是Microsoft Visual C Redistributable Package的一部分,它为使用Visual C编译器开发的应用程序提供必要的运行时环境。该DLL文件包含了大量应用程序运行时需要调用的库函数,这些函数是实现C标准库、异常处理机制、RTTI(运行…

go-zero 实战(5)

引入Prometheus 用 Prometheus 监控应用 1. 用 docker 启动 Prometheus 编辑配置位置,我将 prometheus.yaml 和 targets.json 文件放在了 /opt/prometheus/conf目录下 prometheus.yaml global:scrape_interval: 15s # 抓取间隔evaluation_interval: 15s # 评估…

【代码随想录 二叉树】二叉树前序、中序、后序遍历的迭代遍历

文章目录 1. 二叉树前序遍历(迭代法)2. 二叉树后序遍历(迭代法)3. 二叉树中序遍历(迭代法) 1. 二叉树前序遍历(迭代法) 题目连接 🍎因为处理顺序和访问顺序是一致的。所…

类和对象的基本概念

类和对象的基本概念 C和C中struct区别类的封装封装访问权限总结struct和class的区别 将成员变量设置为private C和C中struct区别 C语言struct只有变量C语言struct 既有变量,也有函数 类的封装 封装 把变量(属性)和函数(操作&a…

交换机部分综合实验

实验要求 1.内网IP地址使用172.16.0.0/16 2.sw1和sW2之间互为备份; 3.VRRP/mstp/vlan/eth-trunk均使用; 4.所有pc均通过DHcP获取Ip地址; 5.ISP只配置IP地址; 6.所有电脑可以正常访问IsP路由器环回 实验拓扑 实验思路 1.给交换机创建vlan,并将接口划入vlan 2.在SW1和…

Unity Render Streaming 云渲染 外网访问

初版: 日期:2024.5.20 前言:临时思路整理,后期会详细补充 环境: 1. 阿里云服务器 需要安装好nodejs 、npm 2. windows电脑,需安装好 nodejs 、npm 3.Unity 2021.3.15f1 4.Unity Render Streaming …

乡村振兴的农业供给侧结构性改革:优化农业产业结构,提升农产品质量,满足市场需求,实现美丽乡村产业振兴

一、引言 乡村振兴战略是我国当前及未来一段时间内的重大战略部署,旨在推动农业农村现代化,实现城乡融合发展。在乡村振兴战略中,农业供给侧结构性改革是核心任务之一。通过优化农业产业结构、提升农产品质量、满足市场需求,不仅…

AI巨头争相与Reddit合作:为何一个古老的论坛成为AI训练的“宝藏”?

每周跟踪AI热点新闻动向和震撼发展 想要探索生成式人工智能的前沿进展吗?订阅我们的简报,深入解析最新的技术突破、实际应用案例和未来的趋势。与全球数同行一同,从行业内部的深度分析和实用指南中受益。不要错过这个机会,成为AI领…

debian nginx upsync consul 实现动态负载

1. consul 安装 wget -O- https://apt.releases.hashicorp.com/gpg | sudo gpg --dearmor -o /usr/share/keyrings/hashicorp-archive-keyring.gpg echo "deb [signed-by/usr/share/keyrings/hashicorp-archive-keyring.gpg] https://apt.releases.hashicorp.com $(lsb_r…

MariaDB 给指定列值自动加密(持久数据加触发器)

文章目录 代码插入时,自动加密更新时,自动加密查看触发器数据操作示例update数据取出解密取 注意一次尝试,看加密后数据长度 参考链接: 一篇非常好的讲解触发器的文章:示例、原理MySQL/MariaDB触发器。 用触发器自动加…

前端工程化07-常见的包管理工具npm、yarn、cnpm、npx、pnpm

8、包管理工具 8.1、包管理工具概述 npm包管理工具、在安装node的时候这个东西就已经安装过了,通过npm去管理包的时候这个时候回有一个配置文件叫做package.json,他是以json的方式来书写对应的一个配置文件,这个配置文件是可以添加特别多的一些字段的&…

案例题(第二版)

案例题目 信息系统架构设计 基本概念 信息系统架构(ISA)是对某一特定内容里的信息进行统筹、规划、设计、安排等一系列的有机处理的活动。特点如下 架构是对系统的抽象,它通过描述元素、元素的外部可见属性及元素之间的关系来反映这种抽象…

k8s 1.28.10 浏览器访问6443查看api,需要证书

添加证书 使用client-certificate-data和client-key-data生成一个p12文件 1.生成client-certificate-data grep client-certificate-data ~/.kube/config | head -n 1 | awk {print $2} | base64 -d >> kubecfg.crt2.生成client-key-data grep client-key-data ~/.kub…

K8S中YAML案例

目录 案例:自主式创建service并关联上面的pod 案例:部署redis 案例:部署myapp 案例:部署MySQL数据库 总结 1.K8S集群中访问流向 K8S集群外部:客户端——nodeIP:nodeport——通过target port——podIP…

Java入门基础学习笔记44——String

为什么要学习String的处理呢? 开发中,对字符串的处理是非常常见的。 String是什么?可以做什么? java.lang.String 代表字符串。可以用来创建对象封装字符串数据,并对其进行处理。 1、创建对象 2、封装字符串数据 3…

blender 烘焙渲染图片,已经导出fbx,导出贴图。插件生成图片

1.新建一个模型。选择资产浏览器的材质,并拖动到模型身上,如下图。资产浏览器的材质可以网上找。 2.打开着色器面板。正下方着色器窗口中,点击空白取消选择,然后右击-添加-着色器-原理化BSDF,右击-添加-纹理-图像纹理。…

宝塔Linux下安装EMQX服务并设置匿名访问

简述 之前有在Windows和Linux下搭建过EMQX服务并且使用方面都没问题,但那都是使用的用户和密码方式访问,且前提都是通过浏览器进入EMQX的配置页面设置的属性; 但这次使用的是腾讯云租用的宝塔Liniux,由于没有浏览器只能通过命令行方式修改EMQX配置以达到目的;由于事先没看…

【博主推荐】HTML5实现520表白、情人节表白模板源码

文章目录 1.设计来源1.1 表白首页1.2 甜蜜瞬间11.3 甜蜜瞬间21.4 甜蜜瞬间31.5 甜蜜瞬间41.6 甜蜜瞬间51.7 甜蜜瞬间61.8 永久珍藏 2.效果和源码2.1 页面动态效果2.2 页面源代码2.3 源码目录2.4 更多为爱表白源码 3.源码下载地址 作者:xcLeigh 文章地址:…