当前位置: 首页 > news >正文

从浏览器输入url到页面加载(六)前端必须了解的路由器和光纤小知识

前言

上一章我们说到了数据包在网线中的故事,说到了双绞线,还说到了麻花。这一章继续沿着这条线路往下走,说一些和cdn以及路由器相关,运营商以及光纤相关的小知识,前端同学应该了解一下的

 

目录

前言

1.  CDN和路由器有关系吗?

2. 你的电脑能直接上网吗?

3.  运营商的井盖

4. 通信线路服务 

5. 小结


1.  CDN和路由器有关系吗?

我们做前端开发经常会谈到cdn加速的话题,意思就是比如我们的网站部署在县里,村里的人访问网站,就要发送请求数据,输入url,然后请求从生产队出发,到达村里,村里在到乡里,乡里又到县里,最终找到那台服务器,访问网站内容,然后数据再从县里原路返回生产队,然后我们的手机上显示了响应的网页内容。

这样必定路途遥远,所以县里为了解决这个问题,出现了一家服务商,提供cdn加速服务。他们在在全县18个乡镇部署了CDN缓存节点,每次县里升级网站后,顺带着把最新的内容部署到18个乡镇的CDN缓存节点上。这样,我们在自己家里,再发出请求的时候,到自己的乡里就直接请求到数据了,这样是不是很快了。所以,如果这个CDN服务商足够强悍,可以往全县193个存大队书记家也部署上节点,这样,我们在家里访问网站就更快啦。

而在数据电信号传输过程中,请求包是要从村里往乡里发,在从乡里往县里发,我们知道每次数据走向是路由器根据配置信息做的决定。所以,路由器和CDN服务器配置后,路由器便知道如何调度到适当的缓存服务器上,当然,路由器还可以根据用户与服务器的就近性,服务器的设备状态等情况进行分配。

如果在回答CDN问题的时候,如果可以顺带着说一些路由器的小知识点,是绝对有用的。但也不排除,那个面试官不知道这回事,觉得你在瞎说,然后断定你回答的不好。

 

 

2. 你的电脑能直接上网吗?

很多时候,例如在公司的个人电脑,是没有公有地址的,意思就是你的个人电脑其实并没有直接连接到互联网中。

一般我们用公司的电脑上网查资料,上CSDN找代码, 其实是必须通过公司的大路由器设备的。但在家里,如果你的网线直接插在电脑上,其实就给自己的电脑配置了TCP/IP信息,这就相当于家里的电脑有了公有地址。但在公司的电脑,这个公有地址会配置在路由器上,我们的个人电脑就被配置了一个私有地址,必须得依靠这个大路由器才能上网。

很多公司控制的比较严格,记得有一次给朋友发图片发不出去了,后来才发现,自己电脑为了调试,用whistle做了代理,导致和公司的那一层代理服务器起了冲突,被拦截了。

但如果个人电脑配置了TCP/IP信息,就拥有了公有地址,这意味着来自互联网的包可以直接到达计算机,这可能导致计算机被攻击。因此,对于直接上网的客户端计算机,我们应该采取安装防火墙软件等防御手段。

3.  运营商的井盖

我们普通用户要访问一个网站,中间必定要经过运营商的地盘。(没错,运营商是基建)而我们访问后,数据包绝对不会只通过一家运营商的地盘,他们的管辖盘根错节的。

 一般我们公司的机房或者个人家庭电脑就是那种网线,上一章说到那种双绞线就满足使用了,但运营商走的数据量一定是巨大的,他们会更多的使用光纤。(哈哈,近几年小区单元门里,墙上经常看见一张纸上写的光纤入户,说明了什么?

光纤不像普通的电线,架设个高压线大高塔就行了(我曾不止一次看见那种高压线高塔就想,我啥时候能往上爬一爬啊)。光纤需要地下铺设,出了问题还需要大量的维护人员进行排查维修,日常还需要巡检维护,所以能用得起光纤的运营商必定很有能力。而且平时我们在路上看见的井盖,也不都是下水道的,的确也有运营商相关的。

4. 通信线路服务 

运营商有光纤,那么也有一些小的例如电话公司(咱们的运营商就是电话公司),他们没有光纤,但是如果电话线走光纤传输速度那将是相当快的。没有光纤,怎么办,租。但一条光纤并不是只能传输一条语音数据,光纤是可以复用的,一条语音数据只占其通信能力的一部分。

这样,拥有光纤的运营商就可以靠收租金,收服务费带来一定的收益,这就是通信线路服务。

其实“从浏览器输入url到页面加载”这个话题,你可以换着问,

  • 例如我们页面中加载一个图片的过程是怎么样的?
  • 例如我们发送一个ajax请求的过程是怎么样的?
  • 你甚至还可以问,打电话的时候,你说出一句“好阿又”,对方回复了一句“艾亩fai 三可由”的过程是怎么样的?

所以,无论电话业务,还是互联网业务,他们在传输这一点上,其实是有共同性的。你是不是想问,我的安卓手机打个电话还要走光纤?我说的是这个电话,如下图的电话:

 

5. 小结

其实学完这一节,我们可以解释很多问题,比如为什么国外某些网站我们可以访问,但有些访问不了;比如为什么那些知名网站可以访问速度这么快(排序他们本身做的web性能优化);比如我们日常看见的井盖为什么还有运营商标志的;比如为什么公司的陆游气坏了,大家都上不了网了等等吧。

 我为大家精心准备了投票环节,你一定会喜欢哒!!!

相关文章:

从浏览器输入url到页面加载(六)前端必须了解的路由器和光纤小知识

前言 上一章我们说到了数据包在网线中的故事,说到了双绞线,还说到了麻花。这一章继续沿着这条线路往下走,说一些和cdn以及路由器相关,运营商以及光纤相关的小知识,前端同学应该了解一下的 目录 前言 1. CDN和路由器…...

C语言假期作业 DAY 06

题目 一、选择题 1、以下叙述中正确的是( ) A: 只能在循环体内和 switch 语句体内使用 break 语句 B: 当 break 出现在循环体中的 switch 语句体内时,其作用是跳出该 switch 语句体,并中止循环体的执行 C: continue 语句的作用是&…...

[nlp] tokenizer加速:fast_tokenizer=True

fast_tokenizer 是一个布尔值参数,用于指定是否使用快速的 tokenizer。在某些情况下,使用快速的 tokenizer 可以加快模型训练和推理速度。如果 fast_tokenizer 参数为 True,则会使用快速的 tokenizer;否则,将使用默认的 tokenizer。 快速的 tokenizer 通常使用一些技巧来减…...

基于OpenCV solvePnP函数估计头部姿势

人脸识别 文章目录 人脸识别一、姿势估计概述1、概述2、姿态估计3、在数学上表示相机运动4、姿势估计需要什么5、姿势估计算法6、Levenberg-Marquardt 优化 二、solvePnP函数1、函数原型2、参数详解 三、OpenCV源码1、源码路径 四、效果图像示例参考链接 一、姿势估计概述 1、…...

STC12C5A系列单片机内部 EEPROM 的应用

参考范例程序。 eeprom.c #include "eeprom.h"/*---------------------------- Disable ISP/IAP/EEPROM function Make MCU in a safe state ----------------------------*/ void IapIdle() {IAP_CONTR 0; //Close IAP functionIAP_CMD 0; …...

搭建测试平台开发(一):Django基本配置与项目创建

一、安装Django最新版本 1 pip install django 二、创建Django项目 首先进入要存放项目的目录,再执行创建项目的命令 1 django-admin startproject testplatform 三、Django项目目录详解 1 testplatform 2 ├── testplatform  # 项目的容器 3 │ ├──…...

JavaWeb教程笔记

JavaWeb Java Web 1、基本概念 1.1、前言 web开发: web,网页的意思 , www.baidu.com静态web html,css提供给所有人看的数据始终不会发生变化! 动态web 淘宝,几乎是所有的网站;提供给所有人…...

数据库压力测试方法小结

一、前言 在前面的压力测试过程中,主要关注的是对接口以及服务器硬件性能进行压力测试,评估请求接口和硬件性能对服务的影响。但是对于多数Web应用来说,整个系统的瓶颈在于数据库。 原因很简单:Web应用中的其他因素,…...

Spring Boot——Spring Boot自动配置原理

系列文章目录 Spring Boot启动原理 Spring Boot自动配置原理 系列文章目录前言一、Spring Boot自动配置原理剖析二、自动配置生效三、总结: 前言 一直在使用Spring Boot特别好奇的是为什么Spring Boot比Spring在项目构建和开发过程中要方便很多,无需编…...

深度学习:Pytorch最全面学习率调整策略lr_scheduler

深度学习:Pytorch最全面学习率调整策略lr_scheduler lr_scheduler.LambdaLRlr_scheduler.MultiplicativeLRlr_scheduler.StepLRlr_scheduler.MultiStepLRlr_scheduler.ConstantLRlr_scheduler.LinearLRlr_scheduler.ExponentialLRlr_scheduler.PolynomialLRlr_sched…...

【uniapp】更改富文本编辑器图片大小

代码块 //<view v-html"productDetails"></view><rich-text :nodes"productDetails"></rich-text>// 假设htmlContent字段是后台返回的富文本字段var htmlContent res.result.productDetailsconst regex new RegExp(<img, gi…...

数据结构和算法一(空间复杂度、时间复杂度等算法入门)

时间复杂度&#xff1a; 空间复杂度&#xff1a; 时间比空间重要 递归&#xff1a; 递归特征&#xff1a; 递归案例&#xff1a; 汉诺塔问题&#xff1a; def hanoi(n,A,B,C):if n>0:hanoi(n-1,A,C,B)print("moving from %s to %s"%(A,C))hanoi(n-1,B,A,C)hanoi…...

Pytorch深度学习-----神经网络的基本骨架-nn.Module的使用

系列文章目录 PyTorch深度学习——Anaconda和PyTorch安装 Pytorch深度学习-----数据模块Dataset类 Pytorch深度学习------TensorBoard的使用 Pytorch深度学习------Torchvision中Transforms的使用&#xff08;ToTensor&#xff0c;Normalize&#xff0c;Resize &#xff0c;Co…...

QT开发快捷键

QT开发快捷键 alt enter // 自动创建类的定义 Ctrl / 注释当前行 或者选中的区域 Ctrl R 运行程序 Ctrl B Build 项目 CtrlShiftF 查找内容 F5 开始调试 ShiftF5 停止调试 F9 设置和取消断点 F10 单步前进 F11 单步进入函数 Shift F11 单步跳出函数 F1 // 查看帮助&#…...

RabbitMQ 教程 | RabbitMQ 入门

&#x1f468;&#x1f3fb;‍&#x1f4bb; 热爱摄影的程序员 &#x1f468;&#x1f3fb;‍&#x1f3a8; 喜欢编码的设计师 &#x1f9d5;&#x1f3fb; 擅长设计的剪辑师 &#x1f9d1;&#x1f3fb;‍&#x1f3eb; 一位高冷无情的编码爱好者 大家好&#xff0c;我是 DevO…...

【雕爷学编程】MicroPython动手做(10)——零基础学MaixPy之神经网络KPU2

KPU的基础架构 让我们回顾下经典神经网络的基础运算操作&#xff1a; 卷积&#xff08;Convolution&#xff09;:1x1卷积&#xff0c;3x3卷积&#xff0c;5x5及更高的卷积 批归一化&#xff08;Batch Normalization&#xff09; 激活&#xff08;Activate&#xff09; 池化&…...

BUG分析以及BUG定位

一般来说bug大多数存在于3个模块&#xff1a; 1、前台界面&#xff0c;包括界面的显示&#xff0c;兼容性&#xff0c;数据提交的判断&#xff0c;页面的跳转等等&#xff0c;这些bug基本都是一眼可见的&#xff0c;不太需要定位&#xff0c;当然也不排除一些特殊情况&#xf…...

Day46 算法记录| 动态规划 13(子序列)

这里写目录标题 300.最长递增子序列 674. 最长连续递增序列718. 最长重复子数组 300.最长递增子序列 视频解析&#xff1a; 第一层for循环遍历每一个元素&#xff0c; ------- 第二层for循环找到当前元素前面有几个小于该值的元素 结尾需要统计最多的个数 class Solution {pu…...

结构型-桥接模式(Bridge Pattern)

概述 桥接模式&#xff08;Bridge Pattern&#xff09;是一种结构型设计模式&#xff0c;将抽象部分和实现部分分离&#xff0c;使它们可以独立地变化。桥接模式通过将继承关系转化为关联关系&#xff0c;将抽象部分和实现部分分离开来&#xff0c;从而使它们可以独立地变化。…...

基于小波哈尔法(WHM)的一维非线性IVP测试问题的求解(Matlab代码实现)

目录 &#x1f4a5;1 概述 &#x1f4da;2 运行结果 &#x1f389;3 参考文献 &#x1f308;4 Matlab代码实现 &#x1f4a5;1 概述 小波哈尔法&#xff08;WHM&#xff09;是一种求解一维非线性初值问题&#xff08;IVP&#xff09;的数值方法。它基于小波分析的思想&#xf…...

前端(Electron Nodejs)如何读取本地配置文件

使用electron封装了前端界面之后&#xff0c;最终打包为一个客户端&#xff08;exe&#xff09;。但是&#xff0c;最近项目组内做CS&#xff08;c开发&#xff09;的&#xff0c;想把所有的配置都放进安装目录的配置文件中&#xff08;比如config.json&#xff09;。这做法&am…...

没有 telnet 不能测试端口?容器化部署最佳的端口测试方式

写在前面 生产中遇到&#xff0c;整理笔记在容器中没有 telnet &#xff0c;如何测试远程端口理解不足小伙伴帮忙指正 他的一生告诉我们&#xff0c;不能自爱就不能爱人&#xff0c;憎恨自己也必憎恨他人&#xff0c;最后也会像可恶的自私一样&#xff0c;使人变得极度孤独和悲…...

漏洞发现-BurpSuite插件-Fiora+Fastjson+Shiro

BurpSuite插件安装 插件&#xff1a;Fiora Fiora是LoL中的无双剑姬的名字&#xff0c;她善于发现对手防守弱点&#xff0c;实现精准打击。该项目为PoC框架nuclei提供图形界面&#xff0c;实现快速搜索、一键运行等功能&#xff0c;提升nuclei的使用体验。 该程序即可作为burp插…...

Elasticsearch-倒排索引

Elasticsearch和Lucene的关系 Lucene 是一个开源、免费、高性能、纯 Java 编写的全文检索引擎&#xff0c;可以算作是开源领域最好的全文检索工具包。ElasticSearch 是基于Lucene实现的一个分布式、可扩展、近实时性的高性能搜索与数据分析引擎。 Lucene索引层次结构 Lucene的…...

pagehelper与mybatis-plus冲突的解决办法

背景&#xff1a; springcloud项目开发新功能时因想使用mybatis-plus&#xff0c;原有功能只使用了mybatis&#xff0c;但在开发时发现某个公共模块使用了com.github.pagehelper&#xff0c;且很多模块都集成了该模块依赖&#xff08;为了保证原有功能不发生问题&#xff0c;…...

解决使用Timer时出现Task already scheduled or cancelled异常的问题

在使用java.util.Timer和java.util.TimerTask执行定时任务时&#xff0c;如果在调用Timer的schedule或scheduleAtFixedRate方法时&#xff0c;报错如下&#xff1a; java.lang.IllegalStateException: Task already scheduled or cancelled 说明当前Timer对象已经执行结束或被取…...

P1175 后缀表达式

题意 传送门 P1175 表达式的转换 题解 编码运算符的优先级&#xff0c;线性复杂度将中缀表达式转换为后缀表达式。为了方便输出&#xff0c;可以用类似对顶栈的结构&#xff0c;初始时右侧栈为后缀表达式&#xff1b;对于每一步计算&#xff0c;右侧栈不断弹出数字到左侧栈&…...

【HashMap】49. 字母异位词分组

49. 字母异位词分组 解题思路 创建一个哈希容器 key是每一个字母异位词 排序之后的词 List是所有的字母异位词因为所有的字母异位词排序之后的结果都是一样的增强for循环遍历字符串数组将每一个字符串转换为字符数组因为字母异位词排序之后 都是一样的将排序之后的字符数组 转…...

golang实现多态

Go 通过接口来实现多态。在 Go 语言中&#xff0c;我们是隐式地实现接口。一个类型如果定义了接口所声明的全部方法&#xff0c;那它就实现了该接口。现在我们来看看&#xff0c;利用接口&#xff0c;Go 是如何实现多态的。 package mainimport "fmt"type Income in…...

formatter的用法,深拷贝, Object.assign 方法实战。

1. :formatter的用法 :formatter 接受一个函数作为参数&#xff0c;这个函数有三个参数&#xff1a;row&#xff0c;column 和 cellValue。row 是当前行的数据&#xff0c;column 是当前列的数据&#xff0c;cellValue 是当前单元格的值。 <el-table-column prop"SYS…...