type
status
date
slug
summary
tags
category
icon
password
主要是通过阅读MDN上的一些文章整理而来的笔记, 方便日后回顾查询, 不得不说MDN上的文章是真的质量高, 即使机器翻译也比很多照本宣科的晦涩课程质量高 以下文章均可点击展开😊
资源链接
点击可展开
互联网是如何工作的(基础设施)
路由器（router）
通常一个网络不仅限于两台电脑。你可以尽你所想地连接电脑，但是情况立刻变得复杂了。如果你尝试连接，比如说十台电脑，每台电脑有九个插头，总共需要 45 条网线。
为了解决这个问题，网络上的每台电脑需要链接到一个叫做路由器（router）的特殊小电脑。路由器只干一件事：就像火车站的信号员，它要确保从一台电脑上发出的一条信息可以到达正确的电脑。为了把信息发送给电脑 B，电脑 A 必须把信息发送给路由器，路由器将收到的信息转发给电脑 B，并且确保信息不会发送给电脑 C。
一旦我们把路由器加入到这个系统，我们的网络中便只需要十条网线：每台电脑一个插口，路由器上十个插口。
解调器（modem）
到目前为止一切都很好 . 但是我们要连接成百上千，上亿台电脑呢？当然一台路由器覆盖不了这么远，但是，如果你阅读得比较认真，我们曾提到路由器像其他电脑一样，所以我们为什么不把两个路由器彼此连接呢？我们把电脑连接路由器，接着路由器连接路由器，我们就会有无穷的规模。
在你的房子和世界其它地方之间架设电缆将这些不同的网络连接起来是不可能的，那么你该如何处理这件事呢？其实已经有电缆连接到你的房子了，比如，电线和电话。电话基础设施已经可以把你家连接到世界的任何角落，所以它就是我们需要的线。为了连接电话这种网络我们需要一种基础设备叫做调制解调器（modem），调制解调器可以把网络信息变成电话设施可以处理的信息，反之亦然。
ISP
这样，我们可以通过电话基础设施相互连接。下一步是把信息从我们的网络发送到我们想要到达的地方。为了做这些，我们需要把我们的网络连接到互联网服务提供商（ISP）。ISP 是一家可以管理一些特殊的路由器的公司，这些路由器连接其他 ISP 的路由器。你的网络消息可以被 ISP 捕获并发送到相应的网络。互联网就是由这些所有的网络设施所组成。
IP地址和域名
如果你想给一台电脑发送一条信息，你必须指明它是哪台电脑。因此，任何连接到网络中的电脑都需要有一个唯一的地址来标记它，叫做 "IP 地址" （IP 代表网络协议）。这个地址由四部分被点分隔的数字序列组成，比如：
192.168.2.10。对于电脑这样已经很好了，但是人类却很难记忆这一串地址。为了简单处理，我们给 IP 地址取一个容易阅读的别名：域名。比如，
google.com 被用于 IP 地址 172.217.7.14。这样我们通过这些域名可以很容易的通过网络连接到电脑。我: 从电脑的IP地址和域名—路由器router—解调器modem—互联网服务提供商ISP组成了互联网这个基础设施, 网络就是在这个基础设施上的服务
互联网和网络
你可能注意到了，当我们通过浏览器上网的时候，我们通常是用域名去到达一个网站。这是否意味着互联网（Internet）和网络（Web）是一样的？事实并非这么简单。正如向我们所见，互联网是一种基础的技术，它允许我们把成千上万的电脑连接在一起。在这些电脑中，有 一些电脑（我们称之为网络服务器（Web servers））可以发送一些浏览器可以理解的信息。互联网是基础设施，网络是建立在这种基础设施之上的服务。值得注意的是，一些其他服务运行在互联网之上，比如邮箱和IRC
.
万维网是如何工作的(基础设施上的客户端与服务器如何交流)
客户端和服务器
连接到互联网的计算机被称作客户端和服务器
客户端发送请求, 服务器回应请求
- 客户端 是典型的 Web 用户入网设备（比如，你连接了 Wi-Fi 的电脑，或接入移动网络的手机）和设备上可联网的软件（通常使用像 Firefox 和 Chrome 的浏览器）。
- 服务器 是存储网页，站点和应用的计算机。当一个客户端设备想要获取一个网页时，一份网页的拷贝将从服务器上下载到客户端机器上来在用户浏览器上显示。
其他部分(除客户端与服务端之外)
假如你生活在一个封闭的村子叫做“盘溪新村”，村子盛产苹果。
互联网：好比地球上众横交错的道路。
网络连接:道路通到了村子路口。从此，村子里的苹果就可以运出去卖了。
- 网络连接: 允许你在互联网上发送和接受数据。基本上和你家到商店的街道差不多。
TCP/IP：
为了将村里的苹果能规范有效的运卖出去而不出问题，村长作出如下规定：“
用规格刚好 20 cm * 20 cm * 20 cm 的泡沫箱来装，之后外面又用相应规格的纸箱包裹上，最后打上透明胶”。
并且要求，对方收到时，一定要外包装完好，不然就会补发。
而且还给对方发了一张发货单，明确说明了，苹果有多少，是用什么方法包装的，只有货和发货单对上了，对方才会确认收货。
- TCP/IP: 传输控制协议和因特网互连协议是定义数据如何传输的通信协议。这就像你去商店购物所使用的交通方式，比如汽车或自行车（或是你能想到的其他可能）。
DNS：
突然一天，郭德纲想吃苹果，就跟于谦说，“我听说盘溪新村（域名）的苹果好，要他们那个套餐一选项啊！”，于谦一听，得，也不知道盘溪新村在哪，
打开地图查（DNS）吧，一查，好嘛，江苏省苏州市（IP 地址），
于是于谦去了苏州，找了村子，告诉村长，要套餐一，要用顺丰快递，并且留下了北京德云社的地址。
- DNS: 域名系统服务器像是一本网站通讯录。当你在浏览器内输入一个网址时，浏览器获取网页之前将会查看域名系统。浏览器需要找到存放你想要的网页的服务器，才能发送 HTTP 请求到正确的地方。就像你要知道商店的地址才能到达那。
HTTP：
过了几天，德云社的人一看，有快递来了，来了这么一句，“只收‘顺丰’，拒收其他快递”。司机忙说，“是顺丰，是顺丰”，这才对上暗号，德云社的人收下了货。
- HTTP: 超文本传输协议是一个定义客户端和服务器间交流的语言的协议（protocol ）。就像你下订单时所说的话一样。
组成文件：送来的货可不止一车，而且也不止一种苹果，这车是红富士，那车黄富士的。
- 组成文件: 一个网页由许多文件组成，就像商店里不同的商品一样。这些文件有两种类型：
代码：有点像，村长事先安排的说明书，让司机到了地方，如何卸车，货放到什么位置，而德云社的看说明书，知道什么样的苹果放到什么位置上，什么样苹果如何食用最佳，等等。
- 代码 : 网页大体由 HTML、CSS、JavaScript 组成，不过你会在后面看到不同的技术。
资源：不同种类的苹果。
- 资源 : 这是其他组成网页的东西的集合，比如图像、音乐、视频、Word 文档、PDF 文件。
DNS解析
数据包讲解
前面我们用“包”来描述了数据从服务器到客户端传输的格式。这是什么意思？基本上，当数据在 Web 上传输时，是以成千上万的小数据块的形式传输的。大量不同的用户都可以同时下载同一个网页。如果网页以单个大的数据块形式传输，一次就只有一个用户下载，无疑会让 Web 非常没有效率并且失去很多乐趣。
当你在浏览器里输入一个网址时
（在我们的例子里就是走向商店的路上时）：
- 浏览器在域名系统（DNS）服务器上找出存放网页的服务器的实际地址（找出商店的位置）。
- 浏览器发送 HTTP 请求信息到服务器来请拷贝一份网页到客户端（你走到商店并下订单）。这条消息，包括其他所有在客户端和服务器之间传递的数据都是通过互联网使用 TCP/IP 协议传输的。
- 服务器同意客户端的请求后，会返回一个“200 OK”信息，意味着“你可以查看这个网页，给你～”，然后开始将网页的文件以数据包的形式传输到浏览器（商店给你商品，你将商品带回家）。
- 浏览器将数据包聚集成完整的网页然后将网页呈现给你（商品到了你的门口 —— 新东西，好棒！）。
用户 在浏览器输入一个网址, 浏览器 在域名服务器上 找出 存放网页的服务器的实际地址 浏览器 通过TCP/IP协议 向存放网页的服务器 发送HTTP请求(请求拷贝一份网页到客户端) 服务器收到并同期请求, 返回一个200OK, 并且 将网页文件 以数据包形式传输到浏览器 浏览器将数据包聚集成完整的网页呈现给用户
浏览器解析文件的顺序
当浏览器向服务器发送请求获取 HTML 文件时，HTML 文件通常包含
<link> 和 <script> 元素，这些元素分别指向了外部的 CSS 样式表文件和 JavaScript 脚本文件。了解这些文件被浏览器解析的顺序是很重要的：- 浏览器首先解析 HTML 文件，并从中识别出所有的
<link>和<script>元素，获取它们指向的外部文件的链接。
- 继续解析 HTML 文件的同时，浏览器根据外部文件的链接向服务器发送请求，获取并解析 CSS 文件和 JavaScript 脚本文件。
- 伴随着构建 DOM 树、应用 CSSOM 树的样式、以及执行 JavaScript 脚本文件，浏览器会在屏幕上绘制出网页的界面；用户看到网页界面也就可以跟网页进行交互了。
HTTP
自动翻译成中文也很好读
网页，网站，网络服务器和搜索引擎的区别是什么？
网页
一份网页文档是交给浏览器显示的简单文档。这种文档是由超文本标记语言 HTML来编写的 (在other articles可查看更多详细内容)。网页文档可以插入各种各样不同类型的资源，例如：
- 样式信息 — 控制页面的观感
- 脚本— 为页面添加交互性
- 多媒体— 图像，音频，和视频
网络上所有可用的网页都可以通过一个独一无二的地址访问到。要访问一个页面，只需在你的浏览器地址栏中键入页面的地址。
网站
网站是共享唯一域名的相互链接的网页的集合。
给定网站的每个网页都提供了明确的链接—一般都是可点击文本的形式
—允许用户从一个网页跳转到另一个网页。
要访问网站，请在浏览器地址栏中输入域名，浏览器将显示网站的主要网页或主页。
网络服务器
一个网络服务器是一台托管一个或多个网站的计算机。 "托管"意思是所有的网页和它们的支持文件在那台计算机上都可用。网络服务器会根据每位用户的请求，将任意网页从托管的网站中发送到任意用户的浏览器中。
别把网站和网络服务器弄混了。
例如，当你听到某人说："我的网站没有响应"，这实际上指的是网络服务器没响应，并因此导致网站不可用。
更重要的是，自从一个网络服务器能够托管多个网站，"网络服务器"这个术语从来都没被用来指定一个网站，因为这可能导致很大的混乱。
在上面的例子中，如果我们说，“我的网络服务器没有响应”，这就指的是在那台网络服务器上的所有网页都不可用。
什么是 URL？
URL是 Web 中的一个核心概念。它是浏览器用来检索 web 上公布的任何资源的机制。
URL
代表着是统一资源定位符（Uniform Resource Locator）。URL 无非就是一个给定的独特资源在 Web 上的地址。理论上说，每个有效的 URL 都指向一个唯一的资源。这个资源可以是一个 HTML 页面，一个 CSS 文档，一幅图像，等等。而在实际中，也有一些例外，最常见的情况就是一个 URL 指向了不存在的或是被移动过的资源。由于通过 URL 呈现的资源和 URL 本身由 Web 服务器处理，因此 web 服务器的拥有者需要认真地维护资源以及与它关联的 URL。
eg: 我给别人分享了notion页面以后就不要随意拖动到其他页面之下改变路径, 否则将会访问失败
一个 URL 由不同的部分组成，其中一些是必须的，而另一些是可选的。
协议
http 是协议。它表明了浏览器必须使用何种协议。它通常都是 HTTP 协议或是 HTTP 协议的安全版，即 HTTPS。 Web 需要它们二者之一，但浏览器也知道如何处理其他协议，比如
mailto:（打开邮件客户端）或者 ftp:（处理文件传输），所以当你看到这些协议时，不必惊讶。Authority
- authority 在 URL 中指的是用来标识 Web 服务器的部分,authority 通常包括域名（例如 www.example.com）和端口号（例如 80），用冒号分隔
www.example.com是域名。它表明正在请求哪个 Web 服务器。或者，可以直接使用IP address，但是因为它不太方便，所以它不经常在网络上使用。
:80是端口。它表示用于访问 Web 服务器上的资源的技术“门”。如果 Web 服务器使用 HTTP 协议的标准端口（HTTP 为 80，HTTPS 为 443）来授予其资源的访问权限，则通常会被忽略。否则是强制性的。
资源路径
/path/to/myfile.html
是网络服务器上资源的路径。在 Web 的早期阶段，像这样的路径表示 Web 服务器上的物理文件位置。如今，它主要是由没有任何物理现实的 Web 服务器处理的抽象。参数
?key1=value1&key2=value2
是提供给网络服务器的额外参数。这些参数是用
&符号分隔的键/值对列表。在返回资源之前，Web 服务器可以使用这些参数来执行额外的操作。每个 Web 服务器都有自己关于参数的规则，唯一可靠的方式来知道特定 Web 服务器是否处理参数是通过询问 Web 服务器所有者。
锚点
#SomewhereInTheDocument
是资源本身的另一部分的锚点。锚点表示资源中的一种“书签”，给浏览器显示位于该“加书签”位置的内容的方向。例如，在 HTML 文档上，浏览器将滚动到定义锚点的位置;在视频或音频文档上，浏览器将尝试转到锚代表的时间。值得注意的是，＃后面的部分（也称为片段标识符）从来没有发送到请求的服务器。理解域名
什么是域名
域名（Domain names）是互联网基础架构的关键部分。它们为互联网上任何可用的网页服务器提供了方便人类理解的地址。
任何连上互联网的电脑都可以通过一个公共IP地址访问到，
对于 IPv4 地址来说，这个地址有 32 位（它们通常写成四个范围在 0~255 以内，由点分隔的数字组成，比如 173.194.121.32），
而对于 IPv6 来说，这个地址有 128 位，通常写成八组由冒号分隔的四个十六进制数 (e.g.,
2027:0da8:8b73:0000:0000:8a2e:0370:1337). 计算机可以很容易地处理这些 IP 地址，但是对一个人来说很难找出谁在操控这些服务器以及这些网站提供什么服务。IP 地址很难记忆而且可能会随着时间的推移发生改变。为了解决这些问题，我们使用方便记忆的地址，称作域名。
域名的结构
一个域名是由几部分（有可能只是一部分，也许是两部分，三部分...）组成的简单结构，它被点分隔，不同于中文书写顺序，它需要从右到左阅读。
域名的每一部分都提供着特定信息。
顶级域名可以告诉用户域名所提供的服务类型。
TLD (en-US) （Top-Level Domain，顶级域名）
最通用的顶级域名（.com, .org, .net）不需要 web 服务器满足严格的标准，
但一些顶级域名则执行更严格的政策。比如：
- 地区的顶级域名，如.us，.fr，或.sh，可以要求必须提供给定语言的服务器或者托管在指定国家。这些 TLD 通常表明对应的网页服务从属于何种语言或哪个地区。
- 包含.gov 的顶级域名只能被政府部门使用。
- .edu 只能为教育或研究机构使用。
顶级域名既可以包含拉丁字母，也可以包含特殊字符。顶级域名最长可以达到 63 个字符，不过为了使用方便，大多数顶级域名都是两到三个字符。
顶级域名的完整列表是ICANN维护的。
标签 (或者说是组件)
标签都是紧随着 TLD 的。标签由 1 到 63 个大小写不敏感的字符组成，这些字符包含字母 A-z，数字 0-9，甚至“-”这个符号（当然，“-”不应该出现在标签开头或者标签的结尾）。举几个例子，
a，97，或者 hello-strange-person-16-how-are-you 都是合法的标签。Secondary Level Domain, 二级域名
刚好位于 TLD 前面的标签也被称为二级域名 (SLD)。
一个域名可以有多个标签（或者说是组件），没有强制规定必须要 3 个标签来构成域名。例如，www.inf.ed.ac.uk 是一个正确的域名。当拥有了“上级”部分 (例如 mozilla.org)，你还可以创建另外的域名 (有时被称为 "子域名") (例如 developer.mozilla.org).
谁拥有域名？
你不能真正地“购买一个域名”，你只能花钱获得一个域名在一年或多年内的使用权。不过你可以延长你的使用权，同时你的续期将优先于其他人的使用申请。但你从来都没有拥有过域名。
被称为域名注册商的公司通过域名登记来记录连接你和你的域名的技术与管理信息。
对于一些域名，它可能不归属于某个域名注册商来负责记录。比如说，每个在.fire 下的域名由 Amazon 管理
找个可用的域名
想要知道一个给定的域名是否可用，
- 去域名注册商的网站。它们大多会提供"whois"服务，告诉你一个域名是否可用。
- 另外，如果你使用系统的内置 shell，可以在里面输入 whois 命令
whois mozilla.org
获得一个域名
过程很简单：
- 去域名注册商的网站。
- 通常那些网站上都有突出的"获得域名"宣传，点击它。
- 按要求仔细填表。一定要仔细检查你是否有将你想要的域名拼错。一旦你给错误域名付款了，便为时已晚！
- 注册商将会在域名正确注册后通知你。数小时之内，所有 DNS 服务器都会收到你的 DNS 信息。
DNS 刷新
DNS 数据库存储在全球每个 DNS 服务器上，所有这些服务器都源于 (refer to) 几个被称为“权威名称服务器”或“顶级 DNS 服务器”。
只要您的注册商创建或更新给定域名的任何信息，信息就必须在每个 DNS 数据库中刷新。
知道给定域名的每个 DNS 服务器都会存储一段时间的信息，然后再次刷新（DNS 服务器再次查询权威服务器）。
因此，知道此域名的 DNS 服务器需要一些时间才能获取最新信息。
DNS请求如何工作
正如我们所看到的，当你想在浏览器中展示一个网页的时候，输入域名比输入 IP 简单多了。让我们看一下这个过程：
- 在你的浏览器地址栏输入
mozilla.org。
- 您的浏览器询问您的计算机是否已经识别此域名所确定的 IP 地址（使用本地 DNS 缓存）。如果是的话，这个域名被转换为 IP 地址，然后浏览器与网络服务器交换内容。结束。
- 如果你的电脑不知道
mozilla.org域名背后的 IP, 它会询问一个 DNS 服务器，这个服务器的工作就是告诉你的电脑已经注册的域名所匹配的 IP。
- 现在电脑知道了要请求的 IP 地址，你的浏览器能够与网络服务器交换内容。
我该怎样开始设计我的网站？
一个项目永远不应该从技术的一方开始建立。音乐家没办法谱写任何旋律除非他知道他要创作出怎样的歌曲，对于画家、作家、Web 开发者来说同样如此。技术是我们接下来才需要考虑的。
我到底想完成什么? 这是你需要想清楚的最重要的问题，因为它主导着所有其它的事情。列出你想要达到的所有目标。这个目标可以是任何事情：销售商品来赚钱、发表时政评论...…
简单的步骤（也就是写下目标并进行分类）将在你需要做出重大决定的时候帮助你（比如，我需要植入这些功能吗？需要使用这些服务吗？需要做这些设计吗？）
网站如何实现我的目标
…阅读原网址