【技术方案分享】一文搞定传统、容器、CCE云上部署应用

HuaweiCloudDeveloper 发表于 2022/01/19 09:11:29 2022/01/19
【摘要】 基于一个前后端分离的应用,从传统部署、容器化部署,华为云CCE部署以及华为云CCE helm 模板部署进行实操,体验传统部署到华为云CCE部署的变化,详细内容可阅读文章了解。

目录

1、验证进程

2、传统化部署

   2.1、数据库部署
   2.2、前端部署
   2.3、后端部署
   2.4、系统验证

3、容器化部署

   3.1、前端容器制作及部署
   3.2、后端容器制作及部署
   3.3、系统验证

4、华为云CCE部署

   4.1、镜像上传华为云SWR
   4.2、华为云CCE部署镜像

      4.2.1、购买华为云CCE
      4.2.2、创建MySQL工作负载
      4.2.3、创建Javajob工作负载
      4.2.4、创建front工作负载

   4.3、系统验证

5、CCE helm模板部署

   5.1、获取配置文件以及负载的yaml文件
   5.2、基于服务器安装helm
   5.3、基于helm chart模型打包
   5.4、上传至华为云CCE
   5.5、一键部署到华为云CCE
   5.6、系统验证

1、验证进程

image.png

2、传统化部署

image.png

2.1、数据库部署

  • 数据库部署参考:https://www.runoob.com/mysql/mysql-install.html
  • 后端业务数据存储在 MySQL ,暴露端口为3306;(实际项目中,数据库请使用部署系统所系的数据库,当前仅为演示。)
  • 数据库初始化脚本:initdb.sql
  • 数据库密码使用:!1Zezhang(实际项目中,数据库密码请自行设置,当前仅为演示。)
  • 数据库部署完成后,使用Navicat连接数据库,导入initdb.sql文件初始化数据库,编码格式选择gbk。

2.2、前端部署

  • 前端是vue的项目,通过webpack打包成dist文件夹。再通过nginx做代理,把静态资源暴露在前端服务器80端口上
  • 获取前端静态资源:dist.zip
  • 静态资源解压到 /root/
  • yum 安装 nginx。并配置nginx.conf 文件,参考配置如下;
	 user root;                    //nginx 启动用户
	    worker_processes auto;
	    error_log /var/log/nginx/error.log;
	    pid /run/nginx.pid	    
	    # Load dynamic modules. See /usr/share/doc/nginx/README.dynamic.
	    include /usr/share/nginx/modules/*.conf;	    
	    events {
	        worker_connections 1024;
	    }	    
	    http {
	        log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
	                          '$status $body_bytes_sent "$http_referer" '
	                          '"$http_user_agent" "$http_x_forwarded_for"';	                          
	    access_log  /var/log/nginx/access.log  main;	    
	    sendfile            on;
	    tcp_nopush          on;
	    tcp_nodelay         on;
	    keepalive_timeout   65;
	    types_hash_max_size 4096;	    
	    include             /etc/nginx/mime.types;
	    default_type        application/octet-stream;	    
	    # Load modular configuration files from the /etc/nginx/conf.d directory.
	    # See http://nginx.org/en/docs/ngx_core_module.html#include
	    # for more information.
	    include /etc/nginx/conf.d/*.conf;	    
	    server {
	        listen       80;             //前端访问端口
	        listen       [::]:80;
	        server_name  _;
	        root         /usr/share/nginx/html;	        
	    # Load configuration files for the default server block.
	        include /etc/nginx/default.d/*.conf;	        
	        location / {                    //前端静态资源配置
	        root /root/dist;
	        index index.html;
	        }	        
	        error_page 404 /404.html;
	        location = /404.html {
	        }	        
	        error_page 500 502 503 504 /50x.html;
	        location = /50x.html {
	        }
	    }
  • service nginx start 启动前端并进行访问。

image.png

2.3、后端部署

  • 后端是springboot项目,编译成一个jar包,服务默认端口为8081,启动服务需要Java环境,需要提前安装jdk。
  • 获取jar包:score-system-1.0-SNAPSHOT.jar
  • 启动命令
	nohup java -jar score-system-1.0-SNAPSHOT.jar --spring.profiles.active=dev --MYSQLADDR=localhost &
  • 访问:curl localhost:8081 获取返回信息

image.png

2.4、系统验证

  • 访问前端界面并设置后端服务地址

image.png

  • 登录系统

image.png

3、容器化部署

image.png

3.1、前端容器制作及部署

  • 新建文件夹存放构建镜像需要的静态资源、配置文件、dockfile等

image.png

  • dockerfile 内容如下:
	FROM centos
	RUN yum intsall nginx -y
	COPY nginx.conf /etc/nginx/nginx.conf
	COPY dist /root/dist
	ENTRYPOINT ["nginx","-g","daemon off ;"]
  • 构建镜像,在当前目录下执行以下命令
	docker build -t front:v1 .      //构建镜像

image.png

	docker images    //查看镜像

image.png

  • 运行镜像
	docker run -it --name front -p 80:80 -d front:v1

image.png

3.2、后端容器制作及部署

  • 新建文件夹存放构建镜像需要的jar包、配置文件、dockfile等

image.png

  • dockerfile 内容如下:
	FROM centos
	RUN yum intsall java-1.8.0-openjdk -y
	COPY score-system-1.0-SNAPSHOT.jar /root/
	CMD java -jar /root/score-system-1.0-SNAPSHOT.jar --spring.profiles.active=dev
  • 构建镜像,在当前目录下执行以下命令
	docker build -t javajob:v1 .      //构建镜像
	docker images    //查看镜像

image.png

  • 运行镜像
	docker run -e MYSQLADDR='实际部署数据库的主机IP' -it --name javajob -p 8080:8081 -d javajob:v1

image.png

3.3、系统验证

  • 访问前端界面并设置后端服务地址

image.png

  • 登录系统

image.png


4、华为云CCE部署

4.1、镜像上传华为云SWR

image.png

  • 镜像上传-step1 连接华为云镜像服务

image.png

  • 镜像上传-step2 本地镜像重新打标签

image.png

  • 镜像上传-step3 本地镜像上传

image.png

image.png

4.2、华为云CCE部署镜像

4.2.1、购买华为云CCE

image.png

4.2.2、创建MySQL工作负载

  • 设置数据库配置项 configmap(初始化脚本)

image.png

  • 设置数据库秘钥 Secert

image.png

  • 创建有状态工作负载MySQL-step1-工作负载信息

image.png

  • 创建有状态工作负载MySQL-step2-容器设置

1.开源镜像站选择MySQL 版本号为 8.0
image.png
2.环境变量导入设置好的Secret
image.png
3.configmap挂载到容器目录/docker-entrypoint-initdb.d
image.png

  • 创建有状态工作负载MySQL-step3-工作负载访问设置

image.png

  • 创建有状态工作负载MySQL-step4-高级设置默认即可,点击创建

4.2.3、创建Javajob工作负载

  • 创建无状态工作负载Javajob-step1-工作负载基本信息

image.png

  • 创建无状态工作负载Javajob-step2-容器设置
    1.选择我的镜像 test-java 版本号V1

image.png

2.环境变量设置 MYSQLADDR

image.png

image.png

  • 创建无状态工作负载Javajob-step3-工作负载访问设置

image.png

  • 创建无状态工作负载Javajob-step4-高级设置默认即可,点击创建

  • 查看javajob负载并访问服务

image.png

image.png

4.2.4、创建front工作负载

  • 创建无状态工作负载front-step1-工作负载基本信息

image.png

  • 创建无状态工作负载front-step2-容器设置
    1.选择我的镜像 test-front 版本号V1

image.png

  • 创建无状态工作负载front-step3-工作负载访问设置
    由于当前负载起了两个实例,可以通过负载均衡方式进行访问

image.png
image.png

  • 创建无状态工作负载front-step4-高级设置默认即可,点击创建

  • 查看front负载并访问服务

image.png

image.png

4.3、系统验证

  • 访问前端界面并设置后端服务地址

image.png

  • 登录系统

image.png


5、CCE helm模板部署

image.png

5.1、获取配置文件以及负载的yaml文件

  • 负载yaml文件获取
    1、点击编辑yaml文件并下载获取

image.png

  • 获取配置项configmap配置项yaml文件
    1、点击编辑yaml文件并下载获取

image.png

  • 获取秘钥Secrect配置项yaml文件

image.png

  • yaml 文件汇总

image.png

  • 避免后续冲突删除掉yaml文件中的 resourceVersion 字段

5.2、基于服务器安装helm

  • 下载代码包
	wget https://get.helm.sh/helm-v3.0.2-linux-amd64.tar.gz
  • 解压安装包
	tar –zxvf helm-v3.0.2-linux-amd64.tar.gz
	```shell
	 
	- 复制helm文件到bin目录
	 
	```shell
	cp linux-amd64/helm /usr/local/bin/
  • helm version查看
	helm version

5.3、基于helm chart模型打包

  • helm创建chart模型
	helm create score-chart
  • yaml 文件上传到 score-chart/templates

image.png

  • helm 打包模型
	helm package socre-chart

image.png

5.4、上传至华为云CCE

  • 将打包好的文件上传华为云CCE

image.png

5.5、一键部署到华为云CCE

注意:安装前请删除工作负载、service、Configmap、Secret

  • 点击模板中的安装按钮进入到配置界面

image.png

  • 配置完成点击自定义安装,提交

image.png

5.6、系统验证

  • 访问前端界面并设置后端服务地址

image.png

  • 登录系统

image.png

【版权声明】本文为华为云社区用户原创内容,转载时必须标注文章的来源(华为云社区),文章链接,文章作者等基本信息,否则作者和本社区有权追究责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件至:cloudbbs@huaweicloud.com进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容。
  • 点赞
  • 收藏
  • 关注作者

评论(0

0/1000
抱歉,系统识别当前为高风险访问,暂不支持该操作

全部回复

上滑加载中

设置昵称

在此一键设置昵称,即可参与社区互动!

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。

*长度不超过10个汉字或20个英文字符,设置后3个月内不可修改。