LeoHsiao's Notes

# Web 技术

# Web 服务

  • 欧洲核子研究组织的 Tim Berners-Lee 发明了世界上第一个 Web 网站和浏览器，后来发展成为因特网（Internet）上普及的万维网（World Wide Web）。
    • 1994 年，他建立了万维网联盟（又称为 W3C 理事会），主持万维网的标准。
  • Web 服务是因特网上最常被人们使用的服务。
    • 用户通过浏览器可以访问一个 Web 网站，查看其显示页面。
    • Web 网页的内容通常是 HTML 格式的文本，由一个 Web 服务器提供，通过 HTTP 协议传输给用户。
  • Web 服务器
    • ：负责接收客户端发来的 HTTP 请求报文，并回复 HTTP 响应报文。
    • Web 服务器通常会将它要显示的信息保存为 HTML 格式的文本，回复给 Web 客户端。
    • 一个主机通常要运行专业的服务器软件才能成为 Web 服务器，还要一直保持运行。
  • Web 客户端
    • ：通过 HTTP 协议访问 Web 服务器上的资源。
    • 一个主机随时都可以使用浏览器等工具成为 Web 客户端，获取 Web 服务器的数据。

# 相关历史

  • 1969 年，在冷战的阴影下，美国为了避免计算机系统被集中打击而开始建立一个分布式计算机系统，以 4 所大学的计算机作为网络节点构成一个广域网。
    • 这个网络被称为阿帕网（ARPAnet），它是最早的计算机网络，也是互联网（即 Internet ）的早期骨干网。
  • 1991 年，欧洲粒子物理研究所（CERN）的 Tim Berners Lee 公布了一种针对 Internet 的文档系统，可以让任意主机通过 HTTP 协议获取网络上指定主机上的文档。
    • 他将这种系统命名为 World Wide Web ，简称为 WWW、Web ，中文译名为万维网。
    • 他还为此发明了 HTML 语言，做出了世界上第一个 Web 网页和 Web 浏览器。
  • 1994 年，网景（Netscape）公司发布网景浏览器，很快占据了大部分浏览器市场。
  • 1995 年，网景浏览器的 Brendan Eich 为浏览器设计了一种脚本语言。
    • 网景公司与发明 Java 语言的 Sun 公司合作，将这种网页脚本语言取名为 JavaScript ，以求借助 Java 的名头来推广。但 JavaScript 与 Java 的语法风格只有少部分相似。
  • 1998 年，网景浏览器逐渐衰落，市场份额被与 Windows 系统捆绑销售的 IE 浏览器抢占。
    • 网景公司将浏览器转变为开源的 Mozilla 项目。
  • 2004 年，Mozilla 社区发布 Firefox 浏览器。
    • Firefox 支持创建网页选项卡、安装插件，功能又多又灵活。而此时的 IE 浏览器生态封闭，功能老旧。
  • 2008 年，Google 公司发布 Chrome 浏览器，并将其源代码作为 Chromium 项目开放。
  • 2020 年的统计显示，Chrome 占据了 70% 的浏览器市场，Apple 公司的 Safari 占据了 10% 的浏览器市场，Firefox 占据了 8% 的浏览器市场。

# Web 浏览器

# 工作流程

用户通常使用 Web 浏览器作为 Web 客户端，访问 Web 服务器。例如，用户在浏览器中访问百度的流程为：

  1. 用户在 Web 浏览器的地址栏中输入百度的域名，按下回车开始访问。
  2. 浏览器向 DNS 服务器发送百度的域名，查询到百度的 Web 服务器的 IP 地址。
  3. 浏览器与百度的 Web 服务器建立 TCP 连接，然后发送 HTTP Request 报文。
  4. 服务器收到请求后返回 HTTP Response 报文。
  5. 浏览器从 Response 报文的 body 中取出 HTML 文本，在 GUI 界面中显示成五颜六色的网页，供用户查看。
    • 如果 HTML 文本包含其它 URL 链接，则浏览器可以访问这些链接，发出其它的 HTTP Request 报文。因此用户访问一个网页时，可能发出多个 HTTP Request 报文。

Web 浏览器按从上到下的顺序逐行解析 HTML 文件，一边解析一边显示给用户看。

  • 解析到 href 时，会在后台下载链接的资源，不影响前台进程。
  • 解析到 src 时，会等该资源加载完毕再继续解析。
  • 解析到 script 时，会加载并执行该脚本，然后再继续解析。
    • 因此应该将 script 标签放在 body 的最后部分，避免阻塞前台进程。
      • 或者使用 async 属性，等加载了该脚本之后再执行。
      • 或者使用 defer 属性，等加载了该脚本、解析了整个 HTML 之后再执行。
  • 不同 Web 浏览器支持的 HTML 语法有所差异，因此需要考虑 HTML 文件的兼容性问题。

# Web 开发

Web 软件开发主要分为两个方向：

  • 前端开发：主要是研究 Web 客户端，比如在 Web 浏览器上显示网页、与用户交互。
  • 后端开发：主要是研究 Web 服务器，比如开发服务器软件、与 Web 客户端交互。
    • Web 网站可以只做前端开发，不做后端开发。只要提供 HTML 等前端文件给浏览器显示即可，不过这样做出来的是静态网站。
    • Web 网站也可以只做后端开发，不做前端开发。这样通常只提供一些 HTTP API ，供程序访问，缺乏 HTML 等前端文件，不适合浏览器访问。