面试 - 地址栏输入url回车后, 发生了什么?

news/2024/7/24 7:09:29 标签: 网络, 前端, 面试

面试 - 地址栏输入url回车后, 发生了什么?目录

URL解析
DNS查询
TCP连接
处理请求
接收响应
渲染页面

答案大致如下：

用户输入URL地址
浏览器解析URL解析出域名
浏览器将域名转换成服务器ip地址（浏览器先查找本地DNS缓存列表没有的话再向浏览器默认的DNS服务器发送查询请求同时缓存）
浏览器将端口号从URL中解析出来
浏览器通过 三次握手 建立一条与目标Web服务器TCP连接
浏览器向服务器发送一条HTTP 请求报文
服务器向浏览器返回一条HTTP 响应报文
浏览器解析文档
通过 四次挥手 断开TCP连接
页面渲染, 可能会引起回流、重绘
如果文档中有资源重复6 7 8 动作直至资源全部加载完毕

在这里插入图片描述

http://www.niftyadmin.cn/n/1263679.html

常用vscode插件

常用vscode插件目录Auto Close TagAuto Rename TagBetter CommentsBracket Pair ColorizerChinese (Simplified) Language Pack for Visual Studio CodeCode Spell CheckerCSS PeekEasy LESSHTML CSS SupportHTML SnippetsImage previewJavaScript BoosterLive ServerLiveReloa…

HTTP协议及请求、响应报文

HTTP协议及请求、响应报文目录注意点http协议http请求报文http响应报文注意点注: 以下图片内容基于Chrome浏览器的 Network面板抓包获取, 但是抓取的数据并不完全符合规范;有条件的同学可以自行购买“HttpWatch”抓包工具的服务. http协议 http协议: 规定了客户端和服务器之…

vue路由传参-Vue2.x和3.x一样

vue路由传参-目录注意动态路由匹配queryparams注意作用 ： 跳转路由时给组件传参; 类似于以前跳转页面window.location.href 传参注意: 路由地址使用 path, 路由地址前面的 / 可省略, 因为写的是路径;路由地址使用 name, 路由名字前面的 / 必须省略, 因为写…

vue中-图片上传预览和FormData上传

vue中-图片上传预览和FormData上传图片上传预览FormData上传图片上传预览原理: 通过监听input表单的 change事件, 获取标签的文件 FormData上传要实现文件上传, 必须借助FormData对象;表单域中, 需要提交的数据, 必须设置name属性, 且取值和接口的参数名一致;FormData实例…

ES6提供的数组操作

一、复制数组数组是复合的数据类型，直接使用 “” 复制的话，只是复制的数组的指针，当改变复制数组的值时，原数组也会发生变化。要想克隆一个全新的数组，可以使用以下方法 var a [1,2]; var b [...a]; 二、找出第一…

在箭头函数中, 返回字面量形式的对象

需要用小括号把对象字面量包起来;大括号被解释为代码块，所以如果箭头函数直接返回一个对象，必须在对象外面加上小括号。 const arrO [{ a: 12, b: 卡卡西, name: 鸣人 }] const newArr arrO.map(({ a, b }) > ({ a, b })) console.dir(newArr)

解构对象 - 无声明赋值

详情点击此处—>mdn详讲: 无声明赋值一个变量可以独立于其声明进行解构赋值。 var a, b; ({a, b} {a: 1, b: 2}); 注意：赋值语句周围的圆括号 ( … ) 在使用对象字面量无声明解构赋值时是必须的。 {a, b} {a: 1, b: 2} 不是有效的独立语法，因为…

前端-环境变量配置(vue)

说明一个实际开发项目最少有两种环境： 开发环境: 程序员正在开发项目;生产环境: 程序员的代码已经写完了，项目已经上线了; 当然除此以外, 根据实际情况还有预发布环境、测试环境等…但是以上2个环境是最低要求配置环境变量注意: 修改任一环境变量…

面试 - 地址栏输入url回车后, 发生了什么?

面试 - 地址栏输入url回车后, 发生了什么?目录

相关文章