浏览器输入url到发起http请求的具体过程介绍
本篇文章给大家带来的内容是关于浏览器输入url到发起http请求的具体过程介绍,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。
用户输入url
当用户输入url,操作系统会将输入事件传递到浏览器中,在这过程中,浏览器可能会做一些预处理,比如 Chrome 会根据历史统计来预估所输入字符对应的网站,例如输入goog,根据之前的历史发现 90% 的概率会访问「www.google.com 」,因此就会在输入回车前就马上开始建立 TCP 链接甚至渲染了。
接着是输入url之后,点击回车,这时浏览器会对 URL 进行检查,首先判断协议,如果是 http 就按照 Web 来处理,另外还会对这个 URL 进行安全检查
安全检查完成之后,在浏览器内核中会先查看缓存,然后设置 UA 等 HTTP 信息,接着调用不同平台下网络请求的方法。
注意:
浏览器和浏览器内核是不同的概念,浏览器指的是 Chrome、Firefox,而浏览器内核则是 Blink、Gecko,浏览器内核只负责渲染,GUI 及网络连接等跨平台工作则是浏览器实现的
http网络请求
通过 DNS 查询 IP;
通过 Socket 发送数据
dns查询ip
DNS,英文是Domain Name System,中文叫域名系统,是Internet的一项服务,他将域名和IP地址相互映射的一个分布式数据库
假设用户在浏览器中输入的是www.google.com,大概过程:
如果输入的是域名,则需要进行dns查询,将域名解析成ip;
进行DNS查询的主机或软件叫做DNS解析器,用户使用的工作站或电脑都属于解析器。域名解析就是利用DNS解析器得到对应IP过程,解析器会向域名服务器进行查询处理。
主要过程如下:
从浏览器缓存中查找域名www.google.com的IP地址
在浏览器缓存中没找到,就在操作系统缓存中查找,这一步中也会查找本机的hosts看看有没有对应的域名映射(当然已经缓存在系统DNS缓存中了)
在系统中也没有的话,就到你的路由器来查找,因为路由器一般也会有自己的DNS缓存
如果以上都没有找到,则继续往下向dns域名服务器查询
用户电脑的解析器向LDNS(也就是Local DNS,互联网服务提供商ISP),发起域名解析请求,查询www.google.com的IP地址,这是一个递归查找过程
在缓存没有命中的情况下,LDNS向根域名服务器.查询www.google.com的IP地址,LDNS的查询过程是一个迭代查询的过程
根告诉LDNS,我不知道www.google.com对应的IP,但是我知道你可以问com域的授权服务器,这个域归他管
LDNS向com的授权服务器问www.google.com对应的IP地址
com告诉LDNS,我不知道www.google.com对应的IP,但是我知道你可以问google.com域的授权服务器,这个域归他管
LDNS向google.com的授权服务器问www.google.com对应的IP地址
google.com查询自己的ZONE文件(也称区域文件记录),找到了www.google.com对应的IP地址,返回给LDNS
LDNS本地缓存一份记录,把结果返回给用户电脑的解析器
在这之后,用户电脑的解析器拿到结果后,缓存在自己操作系统DNS缓存中,同时返回给浏览器,浏览器依旧会缓存一段时间。
注意,
域名查询时有可能是经过了CDN调度器的(如果有cdn存储功能的话)
而且,需要知道dns解析是很耗时的,因此如果解析域名过多,会让首屏加载变得过慢,可以考虑dns-prefetch优化
tcp/ip请求
有了 IP 地址,就可以通过 Socket API 来发送数据了,这时可以选择 TCP 或 UDP 协议。
http本质是tcp协议。
TCP是一种面向有连接的传输层协议。他可以保证两端(发送端和接收端)通信主机之间的通信可达。他能够处理在传输过程中丢包、传输顺序乱掉等异常情况;此外他还能有效利用宽带,缓解网络拥堵。
建立TCP连接一开始都要经过三次握手:
第一次握手,请求建立连接,发送端发送连接请求报文
第二次握手,接收端收到发送端发过来的报文,可知发送端现在要建立联机。然后接收端会向发送端发送一个报文
第三次握手,发送端收到了发送过来的报文,需要检查一下返回的内容是否是正确的;若正确的话,发送端再次发送确认包
在TCP连接建立完成之后就可以发送HTTP请求了。
注意
浏览器对同一个域名有连接数限制,大部分是 6,http1.0中往往一个资源下载就需要对应一个tcp/ip请求,而像 HTTP 2.0 协议尽管只使用一个 TCP 连接来传输数据,但性能反而更好,而且还能实现请求优先级。
以上是浏览器输入url到发起http请求的具体过程介绍的详细内容。更多信息请关注PHP中文网其他相关文章!

热AI工具

Undresser.AI Undress
人工智能驱动的应用程序,用于创建逼真的裸体照片

AI Clothes Remover
用于从照片中去除衣服的在线人工智能工具。

Undress AI Tool
免费脱衣服图片

Clothoff.io
AI脱衣机

Video Face Swap
使用我们完全免费的人工智能换脸工具轻松在任何视频中换脸!

热门文章

热工具

记事本++7.3.1
好用且免费的代码编辑器

SublimeText3汉化版
中文版,非常好用

禅工作室 13.0.1
功能强大的PHP集成开发环境

Dreamweaver CS6
视觉化网页开发工具

SublimeText3 Mac版
神级代码编辑软件(SublimeText3)

在 Vue.js 中使用 Bootstrap 分为五个步骤:安装 Bootstrap。在 main.js 中导入 Bootstrap。直接在模板中使用 Bootstrap 组件。可选:自定义样式。可选:使用插件。

WebDevelovermentReliesonHtml,CSS和JavaScript:1)HTMLStructuresContent,2)CSSStyleSIT和3)JavaScriptAddSstractivity,形成thebasisofmodernWebemodernWebExexperiences。

HTML定义网页结构,CSS负责样式和布局,JavaScript赋予动态交互。三者在网页开发中各司其职,共同构建丰富多彩的网站。

React通过JSX与HTML结合,提升用户体验。1)JSX嵌入HTML,使开发更直观。2)虚拟DOM机制优化性能,减少DOM操作。3)组件化管理UI,提高可维护性。4)状态管理和事件处理增强交互性。

在 Bootstrap 中插入图片有以下几种方法:直接插入图片,使用 HTML 的 img 标签。使用 Bootstrap 图像组件,可以提供响应式图片和更多样式。设置图片大小,使用 img-fluid 类可以使图片自适应。设置边框,使用 img-bordered 类。设置圆角,使用 img-rounded 类。设置阴影,使用 shadow 类。调整图片大小和位置,使用 CSS 样式。使用背景图片,使用 background-image CSS 属性。

创建 Bootstrap 分割线有两种方法:使用 标签,可创建水平分割线。使用 CSS border 属性,可创建自定义样式的分割线。

要设置 Bootstrap 框架,需要按照以下步骤:1. 通过 CDN 引用 Bootstrap 文件;2. 下载文件并将其托管在自己的服务器上;3. 在 HTML 中包含 Bootstrap 文件;4. 根据需要编译 Sass/Less;5. 导入定制文件(可选)。设置完成后,即可使用 Bootstrap 的网格系统、组件和样式创建响应式网站和应用程序。

要调整 Bootstrap 中元素大小,可以使用尺寸类,具体包括:调整宽度:.col-、.w-、.mw-调整高度:.h-、.min-h-、.max-h-
