从输入url到页面展现(二)找服务器其实是在找IP地址

news2024/10/5 3:31:08

前言

前一节我们讲述了url的规则,url的几种类型,以及访问web服务器的时候,如果用户访问的url如果不包含index.html的话,大概会如何去寻找这个url对应的文件,如果感兴趣的同学可以回头去看上一篇:从输入url到页面展现(一)从浏览器解析url开始

下面开始本小节的知识点,浏览器解析url后,我们先对响应请求有个认识,然后知道找web服务器,其实主要是找那台具体服务器的IP地址

目录

前言

1.  通过url发送请求,返回响应

2. 一个图片也是一个http消息 

3.  找web服务器,其实是在找IP地址

4. 我要给面试官用大白话讲网络

5. 把服务器IP地址说的更详细一点 

6. 小结


1.  通过url发送请求,返回响应

例如我们上节课中说到的 http://www.aa.com/hello/index.html 这个例子,用户输入的这个url网址,一般都是以get的方式向服务端发送请求,而浏览器通过解析,也会生成http请求消息,告诉服务器,你要读取服务器下 /hello/index.html 文件的数据,存放到响应消息中,然后返回给客户端。等浏览器收到这些响应消息的时候,就会通过一定的规范,将返回数据显示在浏览器上,呈现给用户。而返回响应的过程中,会包含一个重要的响应状态码

2. 一个图片也是一个http消息 

如果你需要请求的网页是纯文本的,那么直接返回响应,浏览器渲染即可。如果页面中包含图片信息,1个或者N个,那么网页会在相应的位置嵌入图片文件标签,我们知道HTML标签中的图片标签是img,浏览器就会在响应位置进行计算,然后留出显示图片所需要的位置,空间,信息,这个时候,会再次生成http消息,向图片所在的服务器发送请求。这个步骤和我们获取网页文件的步骤是一样的,什么这个面试题可以换一个问法,就是:如果浏览器输入一个图片的url,到页面渲染图片,这个过程是怎么样的?

我们知道,发送一个http请求,生成1个http消息,一般只包含1个url,所以也就是只能获取一个图片,那么如果网页中包含5个图片呢,算上我们之前获取网页的http请求消息,一共就会生成6个http消息了。

所以,浏览器和web服务器的重要分歧之一或者说浏览器的重点工作之一,就是指挥这一系列请求进行发送,然后获取到响应信息进行图文并茂的展示,但是web服务器,说实话,他就比较懒,他不关心你需要展示几个图片,多大多小,你需要的图片是要展示在网站上,还是自己本地的页面上,你请求,我就给你,我不关心你请求几次,你请求一条我就给你一条响应。

但响应头却也有所不同,比如响应HTML文件的content-type值是text/html,而响应图片的content-type值是 image/png

 

3.  找web服务器,其实是在找IP地址

尽管我们是在浏览器输入的 http://www.aa.com/hello/index.html,但是浏览器也就是解析一下这个url链接,他其实浏览器并没有往服务器发送请求的网络能力。我们上面说了,浏览器解析了url,生成1个或者N个http请求,这就是个预备工作,谁可以往出发送请求呢?你是不是想到了网线,wifi啥的?说的笼统点,就是浏览器希望告诉操作系统,我要往出发请求啦,你可以帮我发送出去吗?

虽然我们输入的 www.aa.com 什么什么,但服务器那台机器其实就是所谓的ip,我们一般团队里的同事都说ip为什么什么的那台机器,不会说域名所属的那台机器,也只有ip能表明我们真正要找到的那台,存放着我们index.html的那台机器。所以,我们输入的这个域名,其实和服务器那台机器的ip是有一定的绑定关系的。也就是说一个域名可能指向了1台或者N台服务器。

4. 我要给面试官用大白话讲网络

我们整个互联网的那个设计思路是啥?你要想到TCP/IP,比如我们每个公司或者家里可以称作为一个小的子网,我们的公司里有好多台机器,也就是子网其实也包含了很多台机器,我们在公司可以不联网也互相访问,很多人一问他你做过什么项目,做过管理系统,你们访问不到,我们只能内部网络访问,外边访问不着。这就好比是我们的管理系统部署在公司内部的局域网,或者是公司这个小子网上。这些个内部的机器再找个集线器链接起来,我们互相访问。但想访问外面的东西,让自己公司连上往,每个公司再添加上一个路由器,互相连接起来,组成了大的互联网。

5. 把服务器IP地址说的更详细一点 

比如许文强住在霞飞路99号,这么说可能还是不够详细,比如许文强,陆如萍都住在霞飞路99号吧,然后许文强住在99号301室。这个99号就是整个子网,99号里住着很多人,也许还有明台住在302室,所以他们很多人都住在99号,那么号这个“网络号”就分配给了住在99号,而具体到某一个室呢,就是那一台具体的服务器了,室也就有了自己的主机号,具体起来“霞飞路99号301室”,这个地址就很具体了,快递一个剃须刀直接就可以发送给许文强,而这个具体的地址不就是所谓的IP地址了嘛。

通过这个具体的IP地址,我们找到了许文强,也就是找到了存放 /hello/index.html 的服务器,从而将之前生成的http消息发送到具体的服务器。不过真实的网络肯定还有先过“集线器”这一步,不过做为回答面试题,这一步可以省略掉。

说点题外话,网络中有个专用词叫“下一跳”,大概思路就是我们本地的浏览器把http消息委派给操作系统,操作系统往出发消息,然后我们处于一个子网呀,对吧,子网把消息发送给“集线器”,集线器又找到我们自己或者离我们最近的路由器,这个时候已经把ip地址告诉路由器了,路由器看到ip地址“霞飞路99号301室”,看到后发现,哦,我要去找下一个路由器了,决定把这个消息发送给下一个路由器了,“下一跳”大概意思就是我下一次要跳到那个路由器去了。如果你某一天听到网络同学说xiayitiao,万不可理解为他被吓坏了,吓了一大跳。

 

6. 小结

从浏览器输入url到页面展现,这本身就是一个很蛋疼的问题,我们做为前端开发,如果经验少一些,很容易对服务器啦,网络啦,了解的不多,但如果你不了解这些呢,回答起这道面试题必定很空洞,说白了就是你回答完了,很容易让面试官无感,觉得你回答后根本无法给你加分。

所以希望读完本专栏,可以让你对整体的http链条,其中的网络走向知识,请求回的页面优化都有个更详细的认知。我相信,读完后,你的横向知识面一定会超出前端范畴的

 

 

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

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

相关文章

PyTorch中的可视化工具

目录 一、网络结构的可视化 1.1 通过HiddenLayer可视化网络 1.2 通过PyTorchViz可视化网络 二、训练过程可视化 2.1 通过tensorboardX可视化训练过程 2.2 HiddenLayer可视化训练过程 三、使用Visdom进行可视化 一、网络结构的可视化 我们训练神经网络时,除…

xshell是什么软件

xshell是什么软件? Xshell 是一个强大的远程管理软件,它支持SSH,TELNET 协议。Xshell可以在Windows下访问远端服务器、路由器、网络机顶盒等,类似的常用软件还有putty,以及Windows下的Telnet。 下面简单介绍一下xshell软件。 X…

康耐视Designer,通过VC5与三菱Q系列PLC-SLMP通讯说明

测试使用软件版本 Designer Version: 2.7 GX Works2 Version: 1.77F 测试使用硬件 Cognex Vision Controller VC5 CIC-5000R Mitsubishi PLC: Q06UDEHCPU PLC端设置(内置以太网口型号) 1.新建一个工程,选择对应的PLC系列和PLC类型: 2.PLC参数设置(以太网设置):…

LabVIEW-数值控件和布尔控件

简介 LabVIEW 以其强大、开放、图形化的虚拟仪器软件开发环境使得无论是否有过编程经验的工程师或科学家使用它时都可以快速、高效地与测量和控制硬件通信,并进行复杂的数据分析及处理。LabVIEW集成了满足GPIB、PXI、VXI、RS232、RS485、USB、DAQ等多种形式的设备互…

MATLAB算法实战应用案例精讲-【自动驾驶】激光雷达LiDAR(补充篇)

目录 前言 几个高频面试题目 自动驾驶中的传感器:LiDAR和 Radar的区别 LiDAR Radar 性能对比 激光雷达中是如何做到和GPS时间同步的? 一、三种方案PPSGPRMC、PTP、gPTP 二、同步过程 算法原理 发展历程 国内外厂商 算法思想 测距 三角测…

【博学谷学习记录】超强总结,用心分享丨人工智能 AI项目 前向概率计算笔记

目录前向概率模型基础参数公式推导代码实现前向概率 给定隐马尔可夫模型λ\lambdaλ,定义到时刻ttt部分观测序列为o1,o2,⋯,oto_1,o_2,\cdots,o_to1​,o2​,⋯,ot​且状态为sis_isi​的概率为前向概率,记作αt(i)P(o1,o2,⋯,ot,itsi∣λ)\alpha_t(i)P(o…

GDPU C语言 天码行空9

填空题 1. 指针排序 数组 输入 n5 30 85 12 77 6输出 6 12 30 77 85 &#x1f920; 代码 #include<stdio.h>#define N 10void sort(int *x,int n)// *x 是 数组 a 的地址 {int i,j,k,t;for(i0;i<n-1;i)//从前往后枚举 坑位{ki; for(ji1;j<n;j) if(x[k…

计算机网络 实验五

⭐计网实验专栏&#xff0c;欢迎订阅与关注&#xff01; ★观前提示&#xff1a;本篇内容为计算机网络实验。内容可能会不符合每个人实验的要求&#xff0c;因此以下内容建议仅做思路参考。 一、实验目的 理解DNS的域名解析机制&#xff0c;理解DHCP的工作机制熟悉WEB应用及超…

逍遥自在学C语言 | 位运算符>>的高级用法

前言 在上一篇文章中&#xff0c;我们介绍了<<运算符的高级用法&#xff0c;本篇文章&#xff0c;我们将介绍>> 运算符的一些高级用法。 一、人物简介 第一位闪亮登场&#xff0c;有请今后会一直教我们C语言的老师 —— 自在。 第二位上场的是和我们一起学习的小…

HCIP-6.8BGP的团体属性、BGP联盟

BGP的团体属性、BGP联盟1、Community:团体属性1.1、案例配置2、BGP联盟属性2.1、配置案例&#xff1a;2.2、四种类型的AS_PATH&#xff1a;对于大型网络或者路由条目较多&#xff0c;使用一种BGP特有的路由标记&#xff0c;用于简化路由策略的执行。对于减少路由条目&#xff0…

unity,制作一个环状滑动条

介绍 unity&#xff0c;制作一个环状滑动条 方法 1.导入png图片素材2.新建一个滑动条&#xff0c;两者图片都设置为图片3.调节slider的参数4.调节backgroud的参数5.fill area、fill的参数同上。 得到两个叠加的圆环。6.设置fill的背景颜色为红色7.设置fill填充方式&#xff0…

【C++】容器适配器之priority_queue 仿函数

一、priority_queue 的介绍和使用 1.priority_queue 的介绍 我们和学习之前的容器一样&#xff0c;可以使用cplusplus官网进行学习&#xff1a;priority_queue文档介绍 priority_queue(优先级队列)是一种容器适配器&#xff0c;它 和queue使用同一个头文件&#xff0c;其底层…

Elastic(ELK) Stack 架构师成长路径

Elastic Stack&#xff08;ELK Stack&#xff09;是一个开源的日志分析平台&#xff0c;由 Elasticsearch、Logstash 和 Kibana 三个组件组成&#xff0c;主要用于数据搜索、分析和可视化。要成为一名 ELK Stack 架构师&#xff0c;需要遵循一定的成长路径&#xff0c;以便逐步…

详解HiveSQL执行计划

一、前言 Hive SQL的执行计划描述SQL实际执行的整体轮廓&#xff0c;通过执行计划能了解SQL程序在转换成相应计算引擎的执行逻辑&#xff0c;掌握了执行逻辑也就能更好地把握程序出现的瓶颈点&#xff0c;从而能够实现更有针对性的优化。此外还能帮助开发者识别看似等价的SQL其…

【计算机组成原理】计算机组成原理(三)

计算机组成原理&#xff08;三) 奇偶校验码&#xff1a; 校验原理&#xff1a; 2个比特位可以映射出4种合法的情况 2的2次方 3个比特位可以映射出8种不同的情况&#xff0c;其中4种为合法情况&#xff0c;另外4种为非法情况 上图的每个编码都是一个码字 在同一组码字内&am…

【DES详解】(一)处理input block(64 bits)

一、DES 加密算法总览 0-1、初识置换 IP&#xff08;Initial Permutation&#xff09; 输入&#xff1a;明文&#xff08;64 bits&#xff09; 过程&#xff1a;初识置换 输出&#xff1a;处理后的明文permuted input&#xff08;64 bits&#xff09; 首先&#xff0c;对需要解…

手写一个IO泄露监测框架

作者&#xff1a;长安皈故里 大家好&#xff0c;最近由于项目原因&#xff0c;对IO资源泄漏的监测进行了一番调研深入了解&#xff0c;发现IO泄漏监测框架实现成本比较低&#xff0c;效果很显著&#xff1b;同时由于IO监测涉及到反射&#xff0c;还了解到了通过一种巧妙的方式实…

AEC-Q认证介绍及所有最新工程文件下载

AEC-Q认证介绍及所有最新文件&#xff08;英文版&#xff09;下载 注意&#xff1a; 更多交流及资料请加V&#xff1a;john-130 AEC-Q认证介绍 1&#xff0c;AEC-Q认证总体情况介绍 &#xff08;​1&#xff09;AEC&#xff08;Automotive Electronics Council&#xff09;…

图像分类:Pytorch图像分类之-- MobileNet系列模型

文章目录前言MobileNetV1模型介绍DW&#xff08;Depthwise Convolution&#xff09;卷积PW &#xff08;Pointwise Convolution&#xff09;卷积深度可分离卷积&#xff08;DWPW&#xff09;ReLU6激活函数的介绍MobileNet V1网络结构MobileNet V1程序MobileNetV2模型介绍Invert…

链接、包管理工具、polyrepo、monorepo以及Lerna 工具的使用

nodejs 链接、包管理工具、多包管理以及Lerna 工具的使用jcLee95&#xff1a;https://blog.csdn.net/qq_28550263?spm1001.2101.3001.5343 邮箱 &#xff1a;291148484163.com 本文地址&#xff1a;https://blog.csdn.net/qq_28550263/article/details/129903902 目 录1. 概述…