首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

输入URL到Web页面呈现全过程

当用户在浏览器地址栏输入 URL 并点击回车后,页面是如何呈现。 简单来说,当用户在浏览器地址栏输入 URL 并点击回车后,浏览器服务端获取资源,然后将内容显示在页面上。...为了提高系统可用性、性能,整个过程很多环节都需要部署多节点。 浏览器 当用户在浏览器地址栏输入 URL 并点击回车后,首先由浏览器进行处理。...浏览器缓存 当用户在浏览器地址栏输入 URL 并点击回车后,浏览器会查看自己是否缓存了该资源。...如果没有命中协商缓存,那么服务器返回浏览器请求资源。 DNS 域名解析 当用户在浏览器地址栏输入 URL 并点击回车后,浏览器要判断 URL 是 IP 地址,还是域名。...Nginx 会根据缓存策略缓存应用服务器获取资源,浏览器也会根据缓存策略缓存收到内容。

80630

输入网址到页面呈现过程

WEB应用本质 1、用户请求远程资源 2、浏览器查找远程资源,打包用户请求并发送 3、服务器根据请求,通过逻辑计算,回复结果给浏览器 4、浏览器解析结果,呈现给用户 过程: 1、根据URL查找服务器地址...:逐级查找(浏览器缓存》系统缓存》路由器缓存》ISP DNS缓存》根服务器) 2、建立TCP/IP连接(三次握手),打包并发送请求 3、服务器收到请求,交给相关进程处理 4、服务器处理请求并响应,发送结果给浏览器...(状态码:304,本地有缓存资源请求服务器时,服务器判断若没有修改,返回状态码,不再发送数据) 5、浏览器接收结果并解析(先渲染树,然后DOM树(边下载边渲染)) 6、处理页面嵌入资源和异步请求

75870
您找到你想要的搜索结果了吗?
是的
没有找到

浏览器输入网址到页面展示过程

TCP 渲染 浏览器输入网址到渲染页面主要分为以下几个过程 URL 输入 DNS 解析 建立 TCP 连接 发送 HTTP / HTTPS 请求(建立 TLS 连接) 服务器响应请求 浏览器解析渲染页面...我们在地址栏输入 HZFE 官方网址 hzfe.org 后敲下回车,浏览器会对输入信息进行以下判断: 检查输入内容是否是一个合法 URL 链接。 是,则判断输入 URL 是否完整。...大部分浏览器历史记录、书签等地方开始查找我们输入网址,并给出智能提示。 2....DNS 解析流程如下: 1.png DNS 解析 在浏览器输入 hzfe.org 域名,操作系统检查浏览器缓存和本地 hosts 文件,是否有这个网址记录,有则从记录里面找到对应 IP 地址...服务器响应 当浏览器到 web 服务器连接建立后,浏览器会发送一个初始 HTTP GET 请求,请求目标通常是一个 HTML 文件

19.4K75

ThinkPHP5 对html页面url传参操作

https://blog.csdn.net/u011415782/article/details/79164995 ◆ 背景 毕竟PHP开发框架多数都会和前端页面嵌套使用,而不同框架升级多少都会有所变化...Route::any('cms/article/edit/:id','cms/article/edit'); ◆ 操作 §. html 嵌入方式 这种情况,一般是 form表单页面提交形式,直接在属性..."action" 中进行配置,此时可以将参数以数组参数形式进行添加,如下: method="post" action="{:url('cms/article/edit',['id'=>$todayWordData.id...,'tag'=>'test'])}" 那么页面的显示效果如下: 要注意所生成URL参数变化,其与路由配置有关 ?...§. js 嵌入方式 这种情况下多数是绑定点击事件,需要在 当前页面的 js 下配置数组参数 可是使用js提供替换函数replace(),举例如下 //菜单修改按钮点击事件 function editNavMenu

2K30

输入URL到渲染过程到底发生了什么?

CDN缓存DNSTCP三次握手、四次挥手浏览器渲染过程输入URL页面渲染过程一些优化下面我将“输入URL到渲染全过程”大概描述出来,再对其过程加以解释,了解过程可以做哪些优化。...1、URL解析2、DNS解析3、建立TCP链接4、客户端发送请求5、服务器处理和响应请求6、浏览器解析并渲染响应内容7、TCP四次挥手断开连接一、URL解析地址解析和编码我们输入URL后,浏览器会解析输入字符串...undefined(4)、当客户端DNS缓存(浏览器和操作系统)缓存为空时,DNS查找数量与要加载Web页面唯一主机名数量相同,包括页面URL、脚本、样式表、图片、Flash对象等主机名。...这些文件页面(比如html)最大区别是:这些文件都是静态,改动比较小,这类静态文件适合做CDN加速。...表达式 结语通过阅读本文,相信小伙伴们对输入URL页面渲染过程有了一个大概理解。

1.6K40

输入URL页面可交互过程探究之一:服务端到客户端

原文:https://alistapart.com/article/server-to-client/ 最近发现国外有一个系列,专门探究输入URL页面可交互详细过程,是一份干货十足好资料。...有几种方法可以实现访问:在地址栏输入URL、点击(或触碰)一个页面上或其他app超链接、或者点击你收藏。无论是哪种情况,都会触发一个动作——导航。...接着,浏览器会搞清发送过来文件MIME类型,这样它才能以适当方式去加载这份文件。比如,一份图片文件会原封不动地被加载进来,但HTML文件则会被执行解析和渲染。...如果HTML解析器被调用了,那么它会扫描出那些可能要下载资源文件URL,以便浏览器页面渲染之前就可以开始去下载。这一部分更多细节会在系列文章下一篇具体展开。...总结 既然你已经明白了资源如何服务器走到客户端以及之间所有细节,那么请继续关注网页加载下一步:HTML标签转为DOM。

1.5K30

输入 URL浏览器接收过程中发生了什么事情?

触屏到 CPU 首先是「输入 URL」,大部分人第一反应会是键盘,不过为了与时俱进,这里将介绍触摸屏设备交互。...浏览器浏览器内核 前面提到操作系统 GUI 将输入事件传递到了浏览器,在这过程浏览器可能会做一些预处理,比如 Chrome 会根据历史统计来预估所输入字符对应网站,比如输入了「ba」,根据之前历史发现...接着是输入 URL「回车」,这时浏览器会对 URL 进行检查,首先判断协议,如果是 http 就按照 Web 来处理,另外还会对这个 URL 进行安全检查,然后直接调用浏览器内核对应方法,比如... 01 到字符 HTTP 请求返回 HTML 传递到浏览器后,如果有 gzip 会先解压,然后接下来最重要问题是要知道它编码是什么,比如同样一个「」字,在 UTF-8 编码下它内容其实是「11100100...可以有很多判断方法: 用户设置,在浏览器可以指定页面编码 HTTP 协议 charset 属性值 对于 JS 和 CSS 对于 iframe 如果在这些地方都没指明,浏览器就很难处理

78730

输入URL页面加载完过程中都发生了什么事情

一个HTTP请求过程 为了简化我们先从一个HTTP请求开始,简要介绍一下一个HTTP求情网络传输过程,也就是所谓输入 URL页面下载完过程中都发生了什么事情” ●DNS Lookup 先获得...URL对应IP地址 ●Socket Connect 浏览器和服务器建立TCP连接 ●Send Request 发送HTTP请求 ●Content Download 服务器发送响应 如果下到物理层去讲就有点耍流氓了...●如果你对DNS查询还有印象的话现在反思一下,DNS Lookup就是为了获取一串IP地址要和无数个DNS服务器进行通信,这要消耗多少时间?别忘了你查询完了时候你还没和那边服务器通信呢。...说到缓存就一定要提到缓存层级: ●浏览器DNS缓存,chrome可以看 chrome://net-internals/#dns ●系统DNS缓存 ●hosts文件,墙里小伙伴们应该有印象 ●各个DNS...●HTTP Cache 文件级别的Cache存在本地文件系统上按照RFC2616实现。

1.4K100

企业面试题: 如何获取浏览器URL查询字符串参数

考核内容: BOMR操作与函数使用 题发散度: ★★★ 试题难度: ★★ 解题思路: window.location 对象用于获得当前页面的地址 (URL),并把浏览器重定向到新页面。...Location 对象属性 hash 返回一个URL锚部分 host 返回一个URL主机名和端口 hostname 返回URL主机名 href 返回完整URL pathname 返回URL路径名...port 返回一个URL服务器使用端口号 protocol 返回一个URL协议 search 返回一个URL查询部分 split() 方法 把一个字符串分割成字符串数组: 如果把空字符串 ("")...用作 separator,那么 stringObject 每个字符之间都会被分割。...字符串或正则表达式,该参数指定地方分割 string Object。 limit 可选。该参数可指定返回数组最大长度。如果设置了该参数,返回子串不会多于这个参数指定数组。

4K30

【前端】输入URL页面加载完成过程中都发生了什么事情

URL分割成几个部分:协议(http, https)、网络地址(xxx.xxx.xxx.xxx)、资源路径(/xxx/xxx.xx)、端口号(默认80)。...向2和3确定IP和端口号发起网络连接。 根据http协议要求,组织一个请求数据包,里面包含大量请求信息(包括请求资源路径、你身份等)。 服务器响应请求,将数据返回给浏览器。...数据可能是根据HTML协议组织网页,里面包含页面的布局、文字。数据也可能是图片、脚本程序等。...如果上一步返回是一个页面,根据页面里一些外链URL,例如图片地址,按照1~5再次获取。...开始根据资源类型,将资源组织成屏幕上显示图像,这个过程叫渲染,网页渲染是浏览器最复杂、最核心功能。 将渲染好页面图像显示出来,并开始响应用户操作。

12020

springboot系列学习(十四):springboot项目里templates文件夹下HTML页面是如何获取

但是项目开发是有很多HTML页面,我们自己定义名字HTML页面要放到项目里面的什么位置呢?我们又如何可以获取到这些页面呢?或者如何实现这些页面的跳转呢?...templates文件夹 用脚手架创建springboot项目,就会自动创建这个文件夹。以后我们写HTML页面就是要放到这个文件夹下面 ?...或者我们自己手动在pom加入这个依赖 回顾之前jsp页面的开发 前端交给我们页面,是html页面。...现在我们看这个模板引擎自动配置类 双击shift ,全局查找这个配置类 ? ? 根据这个源码,在templates这个文件夹下,要有以html结尾文件。...所以以后我们在这个文件夹下要写东西都是以html结尾文件。 5 我们在这个文件夹下创建一个页面 ? 6 在controller层写跳转 ?

7.1K40
领券