远程部署流程
之前介绍了用nginx把项目部署在本地window服务器上的操作,现在讲解一下远程部署在服务器上的操作。
注意本次讲解是基于远程服务器为Linux系统,如果是window系统可以通过远程桌面连接可视化控制远程桌面,然后部署过程与本地部署大致一致,原理是这样的,在此不做演示。
另外:本次的部署依靠的API是别人服务器部署好的在线API接口,并非本地后台服务器运行搭建的数据库,由于本人属于新手,经过多次尝试,依旧未能将本地数据库也部署到远程服务器上,因此此种状况依旧不做讲解,后续掌握了再进行补充。此处只对使用在线API的前端项目进行远程部署,请知悉!
1、基本需求准备 (1)、服务器系统
基于已有腾讯云服务器的前提,本人服务器系统为Linux下的CentOS系统,此处只对该系统服务器介绍。
注意以腾讯云服务器为例,买了服务器之后会发送站内信告诉服务器账户为root,以及相应密码,千万注意等下xshell链接用的就是这个账户密码!!!!!千万别用自己的腾讯云登录账户密码去xshell链接!!!那样会一直失败!!!
(2)、需要的软件 (3)、实现原理的解释 通过xshell软件连接上我们的腾讯云服务器;通过命令符安装和启动nginx;通过WinSCP软件可视化的把打包文件复制到服务器上;通过WinSCP软件找到nginx.conf文件修改默认执行路径;nginx重新加载配置;服务器ip地址打开部署的项目; 2、部署过程 (1)、安装 xshell
下载xshell,并安装。
①安装之后打开文件>新建,按下面提示输入并确定。
②点击新建ssh链接会话,在弹出框输入用户名root(可以在系统发送的站内信看,有写用户名密码,注意此处填写的用户名密码不是腾讯云网站的登录密码!切记!),点击确定。
③输入密码,点击确定(如果xshell没有提示成功可以多试几次)。
④看到如下信息表示链接成功。
(2)、远程服务器安装nginx
依次输入下面三条命令:
一些其他命令(等下会用到,先贴出来):
(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安全协议加密)
以上便是前端项目部署在远程服务器上的操作过程!
本文如有解释不当之处,望不吝告知,谢谢!!!