🌟名词解释

域名

www.baidu.com
www.taobao.com
www.qq.com

域名俗称网址，是由一串用点分隔的名字组成，用于标识互联网上的计算机。

原本用于标识互联网上计算机使用的是 IP 地址，但是由于 IP 地址不便于记忆，所以人们便设计出来比较容易记忆的域名，然后通过 DNS 将域名和 IP 地址关联，这样人们便可以通过记忆域名直接访问到对应的计算机。

DNS 服务器

DNS (Domain Name System)，可以理解为互联网上的一项服务，他可以将域名转换成其对应的 IP 地址。

可以将其理解为字典，字典中存储的就是域名和 IP 地址一一对应的键值对。

在浏览器输入网址后，先会去看本地hosts文件中有无对应关系，文件位置如下：

windows: c:\windows\system32\drivers\etc\hosts

mac: /etc/hosts

比如在我的本地hosts中就存在:
127.0.0.1       localhost

服务器

服务器其实就是一台计算机，但是这台计算机并和我们自己的的 PC 不一样，不是日常使用的，而是提供某项互联网服务的。

比如 web 服务器，能为我们提供网页服务，email 服务器，能为我们提供电子邮件服务，FTP 服务器能为我们提供文件存储服务等等。

为计算机安装不同的服务应用程序，即可提供相应的服务。

常见的web 服务应用程序： Apache、Nginx、IIS、Node.js

🌟 网站请求流程

静态页面

网页只请求和响应简单的 HTML、CSS、JavaScript 文件，未和服务端进行任何数据通信。这样的页面叫做静态页面。

动态页面

页面内有和服务器进行数据通信，这样的页面叫做动态页面。

前后端分离的页面

前后端分离的项目中，页面中的数据渲染是在浏览器中完成的。

前后端分离的页面请求分为两部分：静态页面请求 + ajax 数据请求

上面这张图展现的是静态页面：

1.当在浏览器输入网址时，浏览器像DNS服务器发出请求，获取当前域名所对应的唯一IP。

2.DNS服务器返回给浏览器。

3~4.浏览器向服务器请求，此时Nginx监听到请求，就去拿到我们上传到服务器的资源入口文件。

5~6.将资源返回浏览器，浏览器将HTML渲染至页面。

上面这张图展现的是动态页面：

1.当在浏览器输入网址时，浏览器像DNS服务器发出请求，获取当前域名所对应的唯一IP。

2.DNS服务器返回给浏览器。

3~4.浏览器向服务器请求，此时表示的是如ajax请求，通过配置Nginx反向代理避免跨域。

5~6.获取数据并处理。

7~8.将资源返回浏览器，浏览器将HTML渲染至页面。

其实当页面发起ajax请求时，是可以通过与Nginx不同的端口直接访问到node服务，但此时就形成了跨域，可以使用JSONP或者CORS等解决，不过目前主流是通过配置Nginx反向代理解决跨域。