纯前端对服务器的概念
1. 纯前端的服务器概念
前端接触的服务器有多种，比如：机房的物理服务器、后端装自己电脑上的虚拟机服务器、华为云或腾讯云上租的云服务器、node或nginx提供本地文件访问的web服务器 等。
对于我们纯前端而言，服务器就分为两类 web服务器 和 非web服务器。
- web服务器：就是一个软件程序，运行之后，可以让客户端（浏览器）访问 vue/react/angular 打包后的文件。
- 非web服务器：就是一个系统或空间，可以承载文件、安装软件、运行程序等， 类似一个window系统。
注释：它们也分 本地服务器 和 远程服务器，名如其意。
本地服务器：
- web服务器：node代理服务器、nginx运行后提供的静态资源访问服务器。
- 非web服务器：虚拟机服务器
远程服务器：
- web服务器：安装到云服务器上的node/nginx；
- 非web服务器：云服务器
2. 纯前端的部署项目概念
前端项目本地开发完之后，只有部署到远程服务器上，才可以被浏览器的远程地址访问。
而前端部署项目文件，一般是将本地打包文件上传到 远程服务器的指定目录下即可。常用的文件上传工具，如 FTP / XFTP / Filezilla 等。
注意：这里的把打包文件上传到远程服务器指定的目录中，只是上传了文件而已，并不是完全的部署了。
其实，真正的完全部署需要服务器管理者（通常是后端或运维）将指定的文件夹路径添加到远程web服务器配置中，并运行远程web服务器。（当然这一般不需要纯前端去关注）
3. 远程web服务器的部署（以 nginx 为例）
（1）购买云服务器与 远程登陆
从 华为云 或 腾讯云 等平台购买一个云服务器（可以选 个人认证的试用体验1个月），华为云的 购买流程与远程登陆操作 可以参考地址：https://zhuanlan.zhihu.com/p/650903988
注释：这里，注意自己选择的操作系统是 windows 还是 Linux！
- windows系统的登陆账号默认为 Administrator，密码是云服务器的密码；
- Linux系统的登陆账号默认为 root，密码是云服务器的密码；
购买完之后，重置下密码，然后进行登陆，登陆之后就可以在本地 ping 公网IP了（windows系统的，登陆了就可以看见一个windows桌面面板）。
注释：xshell主要用于连接Unix或Linux服务器的，详细解释参考：https://baijiahao.baidu.com/s?id=1779901784295230705&wfr=spider&for=pc
（2）nginx 部署
a. windows系统
可以使用 Windows桌面远程连接（详见上面的远程登陆操作），连接之后，将本地的 nginx软件 拷贝到远程系统的硬盘下，然后将之运行即可。（nginx 配置就不讲了）
（前端项目打包文件拷贝到nginx配置地址，然后重新运行nginx即可）
b. Linux系统（腾讯云服务器为例）
(1) 本地下载 Xshell 和 Xftp(或filezilla等文件上传工具），并分别进行安装和配置（用户名与密码），然后运行起来。
(2) Xshell 安装 nginx：yum install -y nginx // 具体的细节详见：https://www.cnblogs.com/wujf-myblog/p/9872099.html
注意：/etc/nginx/ 目录下的 nginx.conf.default文件可以直接删除，然后只需要配置 nginx.conf 文件 即可。
启动 nginx（执行命令：nginx ）
(3) 配置nginx-多个server或端口
在http中的server下面再添加一个或多个server，修改 端口、 root 路径、try_files。
注释：通过 Xftp 或 filezilla 下载或上传文件到远程服务器，进行更新文件。
(4) 腾讯云控制台添加 防火墙规则（这里对配置nginx多个端口很重要！！！）
(5) Xshell 对防火墙的处理（这里对配置nginx多个端口很重要！！！）
注释：这里主要是查看是否运行、是否含有所需运行的端口，如果没有就需要运行或添加端口，然后重启。
(6) Xshell 重新运行 nginx：nginx -s reload
注意：nginx命令报错：nginx: [error] invalid PID number in "/run/nginx.pid，解决方法详见：https://blog.csdn.net/Xbinbin/article/details/99542799
(7) 最后，就可以在浏览器访问 "公网IP:端口" 了。
注意：在 nginx.conf 文件中配置了指定的 server或端口 之后，重新运行nginx（运行正常），然后在浏览器中仍然无法访问，大概是因为上述的 (4) 或 (5) 没有操作到位！
