万维网概念+web中html/ccs/scripts的解析顺序
互联网
是基础设施,好比地球上众横交错的道路。
网络
是建立在这种基础设施之上的服务。值得注意的是,一些其他服务运行在互联网之上,比如邮箱和IRC.
网页(webpage)
一份能够显示在网络浏览器(如 Firefox,,Google Chrome,Microsoft Internet Explorer 或 Edge,Apple 的 Safari)上的文档。网页也常被称作"web pages"(网页)或者就叫"pages"(页面)。
一份网页文档是交给浏览器显示的简单文档。这种文档是由超文本标记语言 HTML来编写的。网页文档可以插入各种各样不同类型的资源,例如:
- 样式信息 — 控制页面的观感
- 脚本— 为页面添加交互性
- 多媒体— 图像,音频,和视频
备注: 浏览器也能显示其他文档,例如 PDF 文件或图像,但网页(webpage)这一概念专指 HTML 文档。其他情况我们则只会使用文档(document)这一概念
网络上所有可用的网页都可以通过一个独一无二的地址访问到。要访问一个页面,只需在你的浏览器地址栏中键入页面的地址。
网站(website)
一个由许多网页组合在一起,并常常以各种方式相互连接的网页组成的集合。网站常被称作"web site"(网站)或简称"site"(站点)。
网站是共享唯一域名的相互链接的网页的集合。给定网站的每个网页都提供了明确的链接—一般都是可点击文本的形式—允许用户从一个网页跳转到另一个网页。
要访问网站,请在浏览器地址栏中输入域名,浏览器将显示网站的主要网页或主页。
当网站只包含一个网页时,网站和网页二者尤其容易弄混。这样的网站有时称之为单页网站(single-page website)。
站点安全?
互联网很危险!我们经常听到网站因为拒绝服务攻击或主页显示被修改的(通常是有害的)内容而无法使用。在一些出名的案例中,上百万的密码、邮件地址和信用卡信息被泄露给了公众,导致网站用户面临个人尴尬和财务威胁。
站点安全的目的就是为了防范这些(或者说所有)形式的攻击。更正式点说,站点安全就是为保护站点不受未授权的访问、使用、修改和破坏而采取的行为或实践。
有效的站点安全需要在对整个站点进行设计:包括 Web 应用编写、Web 服务器的配置、密码创建和更新的策略以及客户端代码编写等过程。尽管这听起来很凶险,好消息是如果你使用的是服务器端的 Web 服务框架,那么多数情况下它默认已经启用了健壮而深思熟虑的措施来防范一些较常见的攻击。其他的攻击手段可以通过站点的 Web 服务器配置来减轻威胁,例如启用 HTTPS. 最后,可以用一些公开可用的漏洞扫描工具来协助发现你是否犯了一些明显的错误。
有效的站点安全需要在对整个站点进行设计:包括 Web 应用编写、Web 服务器的配置、密码创建和更新的策略以及客户端代码编写等过程。尽管这听起来很凶险,好消息是如果你使用的是服务器端的 Web 服务框架,那么多数情况下它默认已经启用了健壮而深思熟虑的措施来防范一些较常见的攻击。其他的攻击手段可以通过站点的 Web 服务器配置来减轻威胁,例如启用 HTTPS. 最后,可以用一些公开可用的漏洞扫描工具来协助发现你是否犯了一些明显的错误。
网络服务器(web server)
一个在互联网上托管网站的计算机。
一个网络服务器是一台托管一个或多个网站的计算机。 "托管"意思是所有的网页和它们的支持文件在那台计算机上都可用。网络服务器会根据每位用户的请求,将任意网页从托管的网站中发送到任意用户的浏览器中。
别把网站和网络服务器弄混了。例如,当你听到某人说:"我的网站没有响应",这实际上指的是网络服务器没响应,并因此导致网站不可用。更重要的是,自从一个网络服务器能够托管多个网站,"网络服务器"这个术语从来都没被用来指定一个网站,因为这可能导致很大的混乱。在上面的例子中,如果我们说,“我的网络服务器没有响应”,这就指的是在那台网络服务器上的所有网页都不可用。
网络服务器(web server)的托管文件
一个网络服务器首先需要存储这个网站的文件,也就是说所有的 HTML 文档和它们的相关资源(related assets),包括图片,CSS 样式表,JavaScript 文件,字形(fonts)以及影像。
严格来说,如果你自己建立一个网站,你可以在你自己的计算机上托管所有的这些文件,但是在一个专用的网络服务器上存储它们会方便得多,因为它
- 会一直启动和运行
- 会一直与互联网连接
- 会一直拥有一样的 IP 地址(不是所有的 ISP 都会为家庭线提供一个固定的 IP 地址)
- 由一个第三方提供者维护
因为所有的这些原因,寻找一个优秀的托管提供者是建立你的网站的一个重要部分。比较不同公司提供的服务并选择一个适合你的需求和预算的服务(服务的价格从免费到每月上万美金不等)。你可以在这篇文章(article)中找到更多的细节。一旦你设置好一个网络托管解决方案,你只需要去上传你的文件到你的 web 服务器。
搜索引擎(search engine)
帮助你寻找其他网页的网站,比如 Google,Bing,或 Yahoo。
搜索引擎是网络上常见的混乱之源。搜索引擎是一个特定类型的网站,用以帮助用户在其他网站中寻找网页。
搜索引擎数不胜数,有Google, Bing, Yandex, DuckDuckGo等等。其中有的功能宽泛,有的专注于特定的主题。你可按需使用。
浏览器
许多网上的初学者将搜索引擎和浏览器混淆了。让我们明确一下:浏览器是一个 从 Web 接收并显示网页的软件或程序,并且让用户通过 超链接 访问更多页面。搜索引擎则是一个帮助用户从其他网站中寻找网页的网站。
这种混淆之所以出现是因为当一个人打开一个浏览器的时候,浏览器展现的是一个搜索引擎的主页。这有什么意义呢?很明显,因为你打开浏览器要做的第一件事就是去寻找一个网站。
不要把基础设施(浏览器)和服务(搜索引擎)混淆。这种区分会对你很有帮助。举一个例子,一个火狐浏览器把谷歌搜索框当作它默认开始页面。但是甚至有些专业人员也还把它们说得很宽泛,所以不用对这种区分太过谨慎。
浏览器安全
每个浏览器标签页就是其自身用来运行代码的独立容器(这些容器用专业术语称为“运行环境”)。大多数情况下,每个标签页中的代码完全独立运行,而且一个标签页中的代码不能直接影响另一个标签页(或者另一个网站)中的代码。这是一个好的安全措施,如果不这样,黑客就可以从其他网站盗取信息,等等。
备注: 要以安全的方式在不同网站/标签页中传送代码和数据,这种方法现在是普遍存在的。
HTTP (The HyperText Transfer Protocol,超文本传输协议)
正如它的名字暗示,HTTP 明确提出了如何在两台计算机间传输超文本(比如说链接的网络文档(linked web documents))。
一个*协议*是一套为了在两台计算机间交流而制定的规则。HTTP 是一个文本化的(textual),无状态的(stateless)协议。文本化:所有的命令都是纯文本的(plain-text)和人类可读的(human-readable)。无状态:无论是服务器还是客户都不会记住之前的交流。举个例子,仅依靠 HTTP,一个服务器不能记住你输入的密码或者你正处于业务中的哪一步。你需要一个应用服务器来进行这样的工作。(我们会在日后的文章中涵盖这类的技术。)
HTTP 为客户和服务器间的如何沟通提供清晰的规则。就目前而言,只需要知道这几点:
- 只有用户可以制定 HTTP 请求,然后只会发送到服务器。服务器只能响应客户端的 HTTP 请求。
- 当通过 HTTP 请求一个文件时,客户必须提供这个文件的URL。
- 网络服务器必须应答每一个 HTTP 请求,至少也要回复一个错误信息。
总之,HTTP是用于在 Web 上传输超媒体文件的底层 协议 ,最典型场景的是在浏览器和服务器之间传递数据,以供人们浏览。现行的 HTTP 标准的版本是 HTTP/2。HTTP 是基于文本的 (所有的通信都以纯文本的形式进行) 以及无状态的 (当前通信状态不会发现以前的通信状态),该特性极大方便了在 www 上浏览网页的人。除此之外,HTTP 也可以用于构建服务器之间交互的 REST web 服务,以及使得网站内容更加动态化的 AJAX 请求。
而http:// 称为 schema,是 URI 的组成部分,一般位于网络地址的开头。
一个网络服务器提供了 HTTP(超文本传输协议)支持。
在一个网络服务器上,HTTP 服务器负责处理和应答传入的请求。
- 当收到一个请求时,HTTP 服务器首先要检查所请求的 URL 是否与一个存在的文件相匹配。
- 如果是,网络服务器会传送文件内容回到浏览器。如果不是,一个应用服务器会建立必要的文件。
- 如果两种处理都不可能,网络服务器会返回一个错误信息到浏览器,最常见的是“404 未找到” ["404 Not Found"]。(这错误太常见以至于很多网页设计者花费许多时间去设计 404 错误页面 [404 error pages]。)
对用户而言,在浏览器上通过 HTTP 请求这个文件。当这个请求到达正确的网络服务器(硬件)时,HTTP 服务器(软件)收到这个请求,在它自己的存储空间中搜索所请求的文件。当找到这文件时,这个服务器会读取它(如果这个文档不存在,那么将返回一个 404 响应),按需处理它,并把这个文档通过 HTTP 发送给浏览器。
HTTPS
以 https://developer.mozilla.org 为例,该地址说明请求文档时使用 HTTP 协议;这里的 https 代指 HTTP 协议的安全版本,即 SSL (或称 TLS)
SSL(安全套接层)
SSL(Secure Sockets Layer,安全套接层)是旧的标准安全技术,用于在服务器和客户端之间创建加密的网络链路,确保传递的所有数据都是私密且安全的。SSL 的当前版本是 Netscape 于 1996 年发布的 3.0 版本,已被 TLS 协议取代。
URL和超链接
Web 的最初目的是提供一种简单的方式来访问,阅读和浏览文本文档。从那时起,网络已经发展到提供图像,视频和二进制数据的访问,但是这些改进几乎没有改变三大支柱。
早在 1989 年,网络发明人蒂姆·伯纳斯 - 李(Tim Berners-Lee)就提出了网站的三大支柱:
- URL, 跟踪 Web 文档的地址系统
- HTTP, 一个传输协议,以便在给定 URL 时查找文档
- HTML, 允许嵌入超链接的文档格式
正如您在三大支柱中所看到的,网络上的一切都围绕着文档以及如何访问它们。
URL
URL 代表着是统一资源定位符(Uniform Resource Locator)。URL 无非就是一个给定的独特资源在 Web 上的地址。理论上说,每个有效的 URL 都指向一个唯一的资源。这个资源可以是一个 HTML 页面,一个 CSS 文档,一幅图像,等等。而在实际中,也有一些例外,最常见的情况就是一个 URL 指向了不存在的或是被移动过的资源。由于通过 URL 呈现的资源和 URL 本身由 Web 服务器处理,因此 web 服务器的拥有者需要认真地维护资源以及与它关联的 URL。
URL示例如下,您可以将上面的这些网址输进您的浏览器地址栏来告诉浏览器加载相关联的页面(或资源)。
https://developer.mozilla.org https://developer.mozilla.org/en-US/docs/Learn/ https://developer.mozilla.org/en-US/search?q=URL
一个 URL 由不同的部分组成,其中一些是必须的,而另一些是可选的。让我们以下面这个 URL 为例看看其中最重要的部分:

http 是协议。它表明了浏览器必须使用何种协议。它通常都是 HTTP 协议或是 HTTP 协议的安全版,即 HTTPS。Web 需要它们二者之一,但浏览器也知道如何处理其他协议,比如 mailto:(打开邮件客户端)或者 ftp:(处理文件传输),所以当你看到这些协议时,不必惊讶。
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 文档上,浏览器将滚动到定义锚点的位置;在视频或音频文档上,浏览器将尝试转到锚代表的时间。值得注意的是,#后面的部分(也称为片段标识符)从来没有发送到请求的服务器。
如何使用 URL
可以直接在浏览器的地址栏里输入任何 URL,来获得后台的资源。但是这仅仅是冰山一角。
HTML 语言 — 后续会再来讨论 (en-US) — 对 URLs 有大量的使用:
- 为在其他文档中新建链接,用 ;
- 为将文档与它的相关资源关联,用各种标签如 或
