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

图解 URL 网页通信原理

来源:http://t.cn/RBzkRYO 前言 一、文本对话--请求响应 二、TCP/IP 协议族介绍 三、基于TCP/IP通信过程 四、TCP建立连接及断开(重点补充) 小结 前言 互联网原始目的...那我们使用浏览器发送请求后页面是如何呈现在我们面前呢? 接下来由图片介绍下URL呈现页面的过程。 一、文本对话--请求响应 ?...客户端(浏览器)请求过程.jpg 我们在浏览器中输入一个 URL,回车之后便会在浏览器中观察页面内容。...这个文本对话过程是建立在怎样规则上面呢?简单说,这个通信过程是基于TCP/IP通信协议族规范上实现,完成客户端服务器端等一系列信息交换流程。...3、HTTP协议生成请求报文 HTTP协议:HyperText Transfer Protocol超文本传输协议位于应用层,决定客户端服务器端等一系列通信内容及方式,这通过生成报文并发送完成通信。

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

输入URL渲染完整过程1

浏览器会对跨域资源访问进行一些限制图片同源策略对 ajax 跨域限制最为凶狠,默认情况下,它不允许 ajax 访问跨域资源图片所以,我们通常所说跨域问题,就是同源策略对 ajax 产生影响有多种方式解决跨域问题...服务器拿到请求后,响应一段JS代码,这段代码实际上是一个函数调用,调用是客户端预先生成好函数,并把浏览器需要数据作为参数传递函数中,从而间接把数据传递给客户端图片JSONP有着明显缺点,即其只能支持...它总体思路是:如果浏览器要跨域访问服务器资源,需要获得服务器允许图片而要知道,一个请求可以附带很多信息,从而会对服务器造成不同程度影响比如有的请求只是获取一些新闻,有的请求会改动服务器数据针对不同请求...,高兴像一个两百斤孩子,于是,它就把响应顺利交给 js,以完成后续操作下图简述了整个交互过程图片需要预检请求简单请求对服务器威胁不大,所以允许使用上述简单交互即可完成。...();xhr.withCredentials = true;// fetch apifetch(url, { credentials: 'include',});这样一来,该跨域 ajax 请求就是一个附带身份凭证请求当一个请求需要附带

64840

URL 输入页面渲染全流程

前面的话   本文将详细介绍输入URL页面加载全过程 概述   输入URL页面加载主干流程如下:   1、浏览器构建HTTP Request请求   2、网络传输   3、服务器构建HTTP...使用本地一个大于1024以上随机TCP源端口(这里假设是1030)建立目的服务器TCP80号端口(HTTPS协议对应端口号是443)连接,TCP源端口和目的端口被加入报文段中,学名叫协议数据单元...,网卡发送出去,再把比特转换成电子、光学或微波信号在网络中传输 【总结】   上面的6个步骤可总结为:DNS解析URL地址、生成HTTP请求报文、构建TCP连接、使用IP协议选择传输路线、数据链路层保证数据可靠传输...网络传输   客户机服务器需要通过许多网络设备, 一般地,包括集线器、交换器、路由器等 【集线器】   集线器是物理层设备,比特流到达集线器后,集线器简单地对比特流进行放大,除接收端口以外所有端口转发出去...  (2)在内存中多次操作节点,完成后再添加到文档中去   (3)对于一个元素进行复杂操作时,可以先隐藏它,操作完成后再显示   (4)在需要经常获取那些引起浏览器回流属性值时,要缓存到变量

1.5K10

URL输入页面展现到底发生什么?

前言 打开浏览器输入网址网页呈现在大家面前,背后到底发生了什么?经历怎么样一个过程?先给大家来张总体流程图,具体步骤请看下文分解! ?...为了解决上述问题,DNS 服务应运而生。 2.什么是域名解析 DNS 协议提供通过域名查找 IP 地址,或逆向 IP 地址反查域名服务。...3、控制器(controller) 它负责根据用户"视图层"输入指令,选取"模型层"中数据,然后对其进行相应操作,产生最终结果。...(第四次挥手:由浏览器发起,告诉服务器,我响应报文接受完了,我准备关闭了,你也准备吧) 参考文章 输入页面地址展示页面信息都发生了些什么?...前端经典面试题: 输入 URL 页面加载发生了什么?

1K20

URL 输入页面展现发生了什么

所以互联网设计者需要在用户方便性与可用性方面做一个权衡,这个权衡就是一个网址IP地址转换,这个过程就是DNS解析。它实际上充当了一个翻译角色,实现了网址IP地址转换。...4、浏览器解析渲染页面 在收到HTML,CSS,JS文件后,浏览器通过WebKit渲染,将页面呈现屏幕上。下图对应就是WebKit渲染过程。 ?...Paste_Image.png 浏览器是一个边解析边渲染过程。首先浏览器解析HTML文件构建DOM树,然后解析CSS文件构建渲染树,等到渲染树构建完成后,浏览器开始布局渲染树并将其绘制屏幕上。...这个过程比较复杂,涉及两个概念: reflow(回流)和repain(重绘)。...所有的同步任务在主线程上执行,形成一个执行栈;异步任务有了运行结果就会在任务队列中放置一个事件;脚本运行时先依次运行执行栈,然后会任务队列里提取事件,运行任务队列中任务,这个过程是不断重复,所以又叫做事件循环

53640

输入url看到页面的过程分析

理解输入url看到页面的过程,弄明白这中间有哪些步骤,再仔细分析这些步骤原理和行为,是我所能想到最清晰一条知识脉络了。 2. 如何看到我们页面?...最后,本地DNS服务器将含有http://www.cnblogs.comIP地址响应报文发送给客户端。 客户端本地服务器属于递归查询,而DNS服务器之间交互属于迭代查询。...[2] (2) 在步骤2与步骤3之间,执行被动关闭一端执行主动关闭一端流动数据是可能,这称为“半关闭”(half-close)。...总结 以上步骤只是大略地解析了浏览器输入url最终页面展示在用户眼前流程,更多细节我会开单章进行讲解。...参考 "天龙八步"细说浏览器输入URL后发生了什么 【译】输入URL页面渲染完成 输入 URL 页面加载完过程中都发生了什么事情?

1.3K30

输入URL页面加载发生了什么

问题:在浏览器中输入URL整个页面显示在用户面前时这个过程中到底发生了什么。仔细思考这个问题,发现确实很深,这个过程涉及东西很多。...所以互联网设计者需要在用户方便性与可用性方面做一个权衡,这个权衡就是一个网址IP地址转换,这个过程就是DNS解析。它实际上充当了一个翻译角色,实现了网址IP地址转换。...从上述过程中,可以看出网址解析是一个右向左过程: com -> google.com -> www.google.com。但是你是否发现少了点什么,根域名服务器解析过程呢?...请求行 格式如下: Method Request-URL HTTP-Version CRLF eg: GET index.html HTTP/1.1 常用方法有: GET, POST, PUT, DELETE...5、服务器处理请求并返回HTTP报文 自然而然这部分对应就是后端工程师眼中HTTP。后端在固定端口接收到TCP报文开始,这一部分对应于编程语言中socket。

1.3K30

输入URL页面展示到底发生了什么

地址:http://www.cnblogs.com/xianyulaodi/ 作者:咸鱼老弟 刚开始写这篇文章还是挺纠结,因为网上搜索“输入url页面展示到底发生了什么”,你可以搜到一大堆资料。...总过程大概如下: 1、输入地址 当我们开始在浏览器中输入网址时候,浏览器其实就已经在智能匹配可能得 url 了,他会历史记录,书签等地方,找到已经输入字符串可能对应 url,然后给出智能提示...,让你可以补全url地址。...301和302状态码都表示重定向,就是说浏览器在拿到服务器返回这个状态码后会自动跳转到一个新URL地址,这个地址可以响应Location首部中获取(用户看到效果就是他输入地址A瞬间变成了另一个地址...有的文件可能会不需要与服务器通讯,而从缓存中直接读取,或者可以放到CDN中   至此,输入url页面展示过程终于整理完了。

1.8K30

Python菜鸟高手(3):声明变量

变量(variable)是Python语言中一个非常重要概念。变量主要作用就是为Python程序中某个值起一个名字。类似于“张三”、“李四”、“王二麻子”一样的人名,便于记忆。   ...在Python语言中,声明变量同时需要为其赋值,毕竟不代表任何值变量毫无意义,Python语言中也不允许有这样变量。   ...注意:变量不能随便起名,必须符合一定规则。变量名通常包含字母、数字和下划线(_),变量名不能以数字开头。例如,value315是一个合法变量名,而315value是错误变量名。   ...下面的代码声明了多个变量,这些变量数据类型包括整数、字符串、布尔和浮点数。最后输出这些变量值。...变量值 print(u) # 输出u变量值   程序运行结果如下图所示。

53110

Rust 入门精通04-变量

1.2 方便引入类型推导功能 Rust 声明变量特点:要声明变量前置,类型描述后置。 这是因为在变量声明语句中,最重要变量本身,而类型其实是个附属额外描述,并非必不可少部分。...另外:要注意下划线 _ 特殊用法。 3、变量遮蔽 Rust 允许在同一个代码块中声明同样名字变量,后面声明变量会将前面声明变量“遮蔽”起来。...4、变量类型推导 Rust类型推导有两种: ①、变量声明的当前语句中获取信息进行推导 ②、通过上下文信息进行推导 //类型推导 fn type_derivation(){ //1.1 没有明确标出变量类型...,启动到退出,static 变量生命周期永远是 ‘static’,它占用内存空间也不会在执行过程中被回收。...,而局部变量是写在函数内部,所以需要保证全局变量声明时候就要初始化); ②、全局变量初始化必须是编译期可确定常量,不能包括执行期才能确定表达式、语句和函数调用; ③、带有 mut 修饰全局变量

45020

url输入页面返回数据经历了什么?

结束 1>DNS解析可以理解为主寻找这个IP地址过程,其中如果找到IP地址会进行本地缓存,以便下次继续使用 ?...2>HTTP协议是使用TCP作为其传输层协议 3>HTTP请求报文是由三部分组成: 请求行, 请求报头和请求正文。...状态码是由3位数组成,第一个数字定义了响应类别,且有五种可能取值: 1xx:指示信息–表示请求已接收,继续处理。 2xx:成功–表示请求已被成功接收、理解、接受。...3xx:重定向–要完成请求必须进行更进一步操作。 4xx:客户端错误–请求有语法错误或请求无法实现。 5xx:服务器端错误–服务器未能实现合法请求。...响应报头:常见响应报头字段有: Server, Connection...。 响应报文:服务器返回给浏览器文本信息,通常HTML, CSS, JS, 图片等文件就放在这一部分。

86520

输入url页面展示到底发生了什么?

刚开始写这篇文章还是挺纠结,因为网上搜索“输入url页面展示到底发生了什么”,你可以搜到一大堆资料。...总过程大概如下: ---- 1、输入地址 当我们开始在浏览器中输入网址时候,浏览器其实就已经在智能匹配可能得 url 了,他会历史记录,书签等地方,找到已经输入字符串可能对应 url,然后给出智能提示...,让你可以补全url地址。...301和302状态码都表示重定向,就是说浏览器在拿到服务器返回这个状态码后会自动跳转到一个新URL地址,这个地址可以响应Location首部中获取(用户看到效果就是他输入地址A瞬间变成了另一个地址...301 Moved Permanently 永久性重定向,响应报文Location首部应该有该资源URL 302 Found 临时性重定向,响应报文Location首部给出URL用来临时定位资源

91510

输入 URL 渲染页面整个过程 梳理篇

渲染进程:主要职责是把网络下载 HTML、JavaScript、CSS、图片等资源解析为可以显示和交互页面。...第一步:用户输入 首先,浏览器进程接收到用户输入 URL 请求,浏览器进程便将该 URL 转发给网络进程。然后,在网络进程中发起真正 URL 请求。...图中可以看出,当浏览器刚开始加载一个地址之后,标签页上图标便进入了加载状态。但此时图中页面显示依然是之前打开页面内容,并没立即替换为百度首页页面。...这里设计状态码,可以在当前目录找到相关文章 比如遇到状态码是 301/302/306/307,这些都是重定向状态码 那么说明服务器需要浏览器重定向其他 URL。...第三步:准备渲染 网络进程将请求文档传给浏览器主进程,主进程通知渲染进程,渲染进程和网络进程建立连接管道, 将网络进程请求 html 文档,渲染页面上。

73200

输入URLWeb页面呈现全过程

当用户在浏览器地址栏中输入 URL 并点击回车后,页面是如何呈现。 简单来说,当用户在浏览器地址栏中输入 URL 并点击回车后,浏览器服务端获取资源,然后将内容显示在页面上。...这个过程经过了:浏览器缓存 -> DNS 域名解析 -> URL 编码 -> 使用 HTTP 或者使用 HTTPS 协议发送请求 -> 对于访问静态资源 HTTP 请求:CDN -> CDN 回源对象存储...Nginx 会根据缓存策略缓存应用服务器获取到资源,浏览器也会根据缓存策略缓存收到内容。...API 网关根据路由规则,将外部访问网关地址流量路由内部服务集群中正确服务节点上。...监控:性能监控、日志监控 其他:协议适配转换、缓存 --- 外部访问网关地址流量被路由内部服务集群中正确服务节点上之后,服务节点会再访问缓存系统(比如 Redis、EhCache 等),存储系统

81030

输入URL页面展示到底发生了什么

刚开始写这篇文章还是挺纠结,因为网上搜索“输入url页面展示到底发生了什么”,你可以搜到一大堆资料。...总过程大概如下: 1、输入地址 当我们开始在浏览器中输入网址时候,浏览器其实就已经在智能匹配可能得 url 了,他会历史记录,书签等地方,找到已经输入字符串可能对应 url,然后给出智能提示...,让你可以补全url地址。...301和302状态码都表示重定向,就是说浏览器在拿到服务器返回这个状态码后会自动跳转到一个新URL地址,这个地址可以响应Location首部中获取(用户看到效果就是他输入地址A瞬间变成了另一个地址...有的文件可能会不需要与服务器通讯,而从缓存中直接读取,或者可以放到CDN中   至此,输入url页面展示过程终于整理完了。

1.2K10
领券