00:00
好,前面呢,我们已经使用流水线,然后后台管理系统的这个前端项目已经在这呢上云部署了,而且呢,整个部署也没问题,我们查数据库什么都能做到。接下来呢,我们再来把用户端的这个前端项目,我们来给他上云部署。而这个整个上游部署过程呢,几乎跟前面是一模一样的,而且呢,我在这个项目里边也已经把金克斯fair docker fair这些东西呢,我们都写好了,其实呢,只要这个东西呢,一写好,我们整个上云是不是就变得非常简单了,只不过呢,我们在上云之前给大家呢,再来说一下我们这个项目呢,跟前面的这个项目的前啊,这个上云还稍微有点不一样。因为我们这个前端项目呢,是使用VIVO写的,我们想要上云呢,它的这个刀ER费长这样。德菲呢,长这样,就是呢,无U的这个项目啊,你只要一把它编译,编译呢产生DST文件,这个里边的页面你放到NS里边就能运行,而我们接下来用户端的这个前端项目是用NAS写的,NAS呢是一个服务端渲染技术,也要说呢,我们的这个刀ER费啊,不能是简单的项目,一打包把什么HTM文件放到NS里边,而我们这个呢,Do菲是这么来写的。
01:14
使用node GS环境拿过来,然后呢把我们整个的项目复制过来,然后呢把项目的依赖什么都安装好,把项目打包好,暴露了3000个端口,然后n PM run start,而这个n PM runar呢,相当是last。以服务器的方式在3000端口启动的,所以呢,我们把它称为服务端渲染,而且呢,如果我们那是来做服务端渲染的,它还有一个比较好的优点,比如我们来到这request GS。我们以前呢,在这写的生产环境的这块地址,是写生产环境的网关地址,随便一个机器加网关暴露的端口号,这样的话呢,其实我们这个前端项目要访问网关还得先来到公网IP,然后呢,然后网关把所有的流量再放给我们这个集群内部。
02:01
而实际上呢,如果我们一用服务端渲染纳的这个项目,最终一启动给纳,它本身呢是一个服务器,然后呢,我浏览器先给纳发请求,纳呢呢自己然后呢给我们这个后台集群发请求,所以我的这一块的地址可以改成我们网关在后台集群的内网地址,这样就访问快了。而以前我又写的这个项目是不行的,为什么F12大家就能看到,如果我这个项目呢,我点击查询。浏览器是来作为我们用户代理给我们发请求的,所以呢会从我们浏览器端,比如说我的电脑端去给我们网关发请求,如果我在这一块写的是网关的集群内网地址,什么his get外,那我浏览器是不知道his get外到底是哪一块地方的,所以呢,我们这些后台管理系统打包静态页的,我们只能呢在这儿写网关暴露的这个地址,而如果我用了服务端渲染技术,我们最终纳的这个应用跟我们后台集群以及网关都待在一个集群里边,那我们就可以直接通过集群内的地址访问网关,所以呢,我在整个部署之前,我只做一件事。
03:11
其他东西呢,都是写好的,我做一件事就是把这一块的网关地址重新改一下,改成我们集群内要用到网关地址,点进来我们已经部署好的所有服务来找到网关,我们网关集群的的地址呢,就拿到他的DNS加上8000端口,哎,8080端口就行了。所以我把这一块一改。这样的话呢,我们整个走内网是不是非常快啊,然后8080把这改了以后呢,我把这停掉吧。然后呢,改了以后,我们把这个get and把它推送上去啊get and包括commit。他说这是一次优化,包括给他push。好,我们把我们所有的内容呢推送上去,那至此呢,我们这个前端项目啊,它的这个金s fair刀ER fair什么都是有的,呃,那我们接下来呢,就直接来进行部署就行了,来到cooper s。
04:06
S工程来到这儿。我们想要部署一个新项目,直接点击创建,我们先拿到我们这个项目的get地址。复制。来到我们片里边,比如我们就叫医院挂号的用户端set。代码仓库来选一下get仓库,这是我们的代码地址,我们使用马云的账号,让他自己来下载,点击下一步,而且呢,让他自己下载来找到金克fair的位置,对吧?而且呢,这还有一个什么web hook推送我呢,给大家把这一块的地址也是先提前复制过来。我们后来说这个地址是用来干嘛的。这一站。然后呢,接下来我们现在点击创建,我让这个流水线自己创建好元挂号set这个流水线创建了,创建以后呢,接下来他给我们来启动。他第一次呢,自己把代码下载来,根据我们远程仓库的金file,它呢会把我们流水线初始化出来,初始化出来我们就来稍等一下整个流水线的运行过程。
05:08
那流水线呢,现在已经是启动了。接下来来到我们这个项目编译过程,这个过程呢,稍微有点慢,我就等待一下。那稍等几分钟呢,我们项目编译就成功了,接下来又来到我们的构建镜像过程来看构建镜像。个镜像呢,使用我们的node GS的运行环境,把我们项目的整个代码呢,先拉过去copy,先复制过去,然后呢,NPMSP,我们安装项目相关的这个依赖。安装完以后呢,我们来项目打包什么NPM装build好打包完以后我们就来稍等一下。几项构架?那打包完以后呢,我们这一块也提示都一切正常了吧,然后呢,接下来最后我们这镜像就已经打包成功了,接下来就进入到推送镜像的过程,那推送镜像呢,跟网速有关,你就让他慢慢推,等一阵。
06:13
那等了十来分钟以后呢,我们发现这块镜像呢也推送成功,而且呢也部署到地域环境,他还给我发了确认邮件,来看一下我的确认邮件,点击首页未读邮件。这又未读邮件,那就是库fair这个set构建结果,哎,构建成功了,第一次构建那就没问题,那这个成功了以后呢,那我们就来看一下上云部署。来到case这一块,那么接下来呢,就会重新新部署一个叫啊,因为挂号的这个set它呢也已经成功了,这个成功呢,我们当然要测试访问,这个测试访问呢,最快的方式,我先编辑一个外网访问。我们把它呢note端口暴露一下。好,这个端口暴露出来以后呢,那就是访问任何一个机器的32455就行了,那我们就来访问任何一台机器的32455端口。
07:12
这就是我们的用户的前端项目,那这个前端项目呢,大家看一下啊,它呢默认网关啊,这个网站拒绝了我们这个请求,拒绝这个请求的原因是什么?来给大家看一下。我呢可以在它的容器内部,我来做一件这个事,Cul好,没问题,我呢我先curl,我来访问local host local host不就是本机吗?或者127。7.0.0.1的3000端口。因为那次呢在3000工作,但是3000这个端口呢,我们发现它其实有返回数据的,而我们现在呢,一在外边访访问就没返回数据了,原因是什么?原因就是我们这个纳应用,这个纳应用,比如我给大家再来启动一下n PM run DV给大家看一下。
08:05
那这个应用啊,默认启动监听是不是只监听logo host的3000啊,而我这个呢,相当于用集群外的任何一个IP,最终呢,转到我们这个内部,相当于我们用其他的非local host IP最终访到我们这个网关以后呢,它监听不到的,所以呢,我们接下来要修改的是让纳。不仅是监听local host,最好呢,这一块应该变成什么叫0000,对吧,就是呢,任任何地址的这个3000我都可以监听,那么先来改一下它。这个修改呢,其实可以参照纳官方文档,他呢也说过这个事儿主要呢是在package杰森,在这一块呢,我们可以加上一项配置。嗯,有这么一项配置,比如呢,有一个配置叫con对吧,我来配配什么呢,配。来配一下。
09:01
我们对那来做一个配置,Na里边呢,我们来主要配上这么一个叫host吧,就是na呢,它监听的这个host主机。我。主机呢?那我们就来写000。然后以及端口端口呢写上。比如就是我们3000。3000,还少了一个豆块。那这个配置我们加上了以后呢,先把这个喷置喷纸解死,我保存一下,然后呢,我重新启动一下那。大家看一下,然后呢,它打印,诶我们现在呢,这一块打印呢,不再是local host,就是任意IP地址,我们当前本金是什么就是什么,那就行了啊。所以呢,那这块改完以后呢,我就把整个应用重新打包,现在呢,拿本机地址啥也都能访问。
10:00
那块报错的原因是我们网关地址它访问不到,没关系,现在呢,Get and,把这个代码呢重新编写一下,以及commit。Push。推出我们最新的改变。好,这个推送完了以后呢,让他流水线重新运行一次,把我们这个呢重新部署一下。那什么?先听到任意的这个IP地址吧,好,我们点一个确定。我们改的3000纳呢,之前默认就是3000,包括doer fair,那暴露的也是3000啊,没问题。我们就来等一下。看一下整个进度吧。这个进度呢,项目编译,构建镜像,那就等它慢慢运行。现在呢?编译完成,进入到构建镜像的过程。这构建镜像,哎构建镜像呢已结束了啊,进入到我们的推送过程,你就来等这。
11:06
就像呢,在这儿等了一阵,也推送成功下来呢,他说部署部署完了以后呢,他也会发送邮件。嗯,来看一下是不是又有新的成功邮件,哎,这新邮件已经到达了。我们的这次医院挂号的前端这个系统二第二次构建又成功了,这个成功以后呢,接下来我们来到我们的工作台上,银通项目里边。我们来看我们部署的这个医院挂号set好。这块呢,已经有东西了,那为了方便访问,我先来暴露外网。这个暴露外网呢是32070,那么就集群内任何一个机器的32070。来访问,哎,我们来到整个医院的统一挂号平台,那这块的数据呢,应该也是查出来的,没问题,这都加载出来了。哎,可能呢,这一块等级这个数据呢,啊,没着急查到再多刷几遍。
12:07
看一下F12有些数据呢,可能会有网络原因等等啊,这个网络呢连不上。医院的his这个呢?重新来刷一下。他呢会连到我们集群内的网关,然后呢给我们网关发请求,而这一块网关呢。Server gateway his 8080api,他这个说A。说我们这个name。Not resolved,就是我们这个域名呢,它没有给我们解析成功。实际上呢,是应该解析成功的。嗯,这个域名,除非我们把这个线上的配错了。确定一下。Server gateway8080。来,随便测一下吧。这块数据都能出来啊,那就没啥问题,呃,我就随便来到这个。那的这个容器里边来访问一下网关呗,Curl它说访问不到,实际上咱来看一下。
13:07
这部能访问到吗?然后呢,包括。我们把它访问不到的,他说访问不到的这个域名呢,它解析不了的完整地址。刷一下。你把这个完整地址呢拿来。Contra。C。我们CU呢,在这访问一下。在。在,在我们的这个容器内。CURL。我们也照着这个网关呢,访问一遍网关,这不接口有数据返回吗?所以我们这一块呢,是能访问到的,它这有问题呢,那就等一阵估计就好了,那至此呢,我们整个这些应用呢,我们就部署上去了。其实呢,未来也就是我们任何项目,只要呢,你有会写这个金fair文件,我们这个cooper整合起来呢,还是非常方便的,即使你不会写,像我们以前,嗯,像我们以前这我们的这个。
14:10
后台系统即使不会写呢,我们也可以使用可视化界面创建出来,当然这个东西呢,用多了以后,慢慢大家就都会写了,当然金斯费呢,我们现在只是来写了一些简单的步骤流程,更多的更详细的流程,大家也可以参照金克斯的官方文档,或者库珀斯菲尔的金克斯可视化界面,它呢还有一些其他额外的一些步骤,我们都能做。那整个这个流水线呢,我们就先用到这儿。
我来说两句