nginx 部署前端项目至腾讯云服务器（CentOS系统）

远程部署流程

之前介绍了用nginx把项目部署在本地window服务器上的操作，现在讲解一下远程部署在服务器上的操作。
注意本次讲解是基于远程服务器为Linux系统，如果是window系统可以通过远程桌面连接可视化控制远程桌面，然后部署过程与本地部署大致一致，原理是这样的，在此不做演示。
另外：本次的部署依靠的API是别人服务器部署好的在线API接口，并非本地后台服务器运行搭建的数据库，由于本人属于新手，经过多次尝试，依旧未能将本地数据库也部署到远程服务器上，因此此种状况依旧不做讲解，后续掌握了再进行补充。此处只对使用在线API的前端项目进行远程部署，请知悉！

1、基本需求准备

（1）、服务器系统

基于已有腾讯云服务器的前提，本人服务器系统为Linux下的CentOS系统，此处只对该系统服务器介绍。
注意以腾讯云服务器为例，买了服务器之后会发送站内信告诉服务器账户为root，以及相应密码，千万注意等下xshell链接用的就是这个账户密码！！！！！千万别用自己的腾讯云登录账户密码去xshell链接！！！那样会一直失败！！！

（2）、需要的软件

• xshell(用于链接服务器)及命令服务器操作
• WinSCP(用于可视化操作本地和服务器的文件传输)
• nginx（用于通过服务器启动部署好的项目，同本地部署一样）

（3）、实现原理的解释

1. 通过xshell软件连接上我们的腾讯云服务器；
2. 通过命令符安装和启动nginx；
3. 通过WinSCP软件可视化的把打包文件复制到服务器上；
4. 通过WinSCP软件找到nginx.conf文件修改默认执行路径；
5. nginx重新加载配置；
6. 服务器ip地址打开部署的项目；

2、部署过程

（1）、安装 xshell

下载xshell，并安装。
①安装之后打开文件>新建，按下面提示输入并确定。

②点击新建ssh链接会话，在弹出框输入用户名root（可以在系统发送的站内信看，有写用户名密码，注意此处填写的用户名密码不是腾讯云网站的登录密码！切记！），点击确定。

③输入密码，点击确定（如果xshell没有提示成功可以多试几次）。

④看到如下信息表示链接成功。

（2）、远程服务器安装nginx

依次输入下面三条命令：

• 安装nginx：yum install nginx
• 开启nginx服务：systemctl start nginx.service
• nginx随系统启动：systemctl enable nginx.service

一些其他命令（等下会用到，先贴出来）：

• 查询nginx的安装目录，master process后面接的就是地址（等下重新加载nginx会用到）：ps -ef | grep nginx
• 重启nginx，修改完nginx.conf配置后需要重启加载nginx：nginx -s reload

（3）、使用WinSCP

①安装过程省略，链接过程也省略，进去输入ip和密码就能连上。

连接后效果图如下，左边是本地的文件管理，右边的是我们腾讯云服务器的文件管理（注意是在root路径内）

②我们从本地把打包好的dist文件夹复制到右侧服务器上。接下来就是找到nginx.conf修改默认路径，并重启nginx就可以。nginx.conf文件放在/etc/nginx/nginx.conf，打开这个文件。

③我们把文件的server中默认的 root /usr/share/nginx/html;前面加#注释掉，然后再下面location中配置自己得实际路径，代码如上图，具体路径根据实际需求修改。

④保存退出，注意此处还有一个地方要修改，可以暂时不改，等下来改，就是该文件顶部在我们修改完上述内容后退出重启nginx后会发现依旧连不上，此时再进来会发现顶部写着user nginx;即使用权在nginx，我们需要改成user root；使用权改为用户本身。此步骤可以先忽略等下来改。

⑤接下来重启nginx，先用ps -ef | grep nginx查找到nginx目录，然后输入cd进该目录中，并输入nginx -s reload 重启nginx。

⑥按理说我们修改完配置，也重新加载了nginx，我们通过ip地址在浏览器便可以打开我们的项目，但是我们实际打开浏览器会发现，页面提示404错误！这是因为我们没有使用权限，因此就需去执行步骤④的内容，然后重新执行步骤⑤重新加载nginx，就可以了。

⑦现在我们打开浏览器，输入服务器地址（注意本文操作未对ip地址进行https安全协议加密）

以上便是前端项目部署在远程服务器上的操作过程！
本文如有解释不当之处，望不吝告知，谢谢！！！