使用kubesphere-devops部署在线教育项目【前端】
【部署后台管理vue项目】
1、准备工作
(0)版本kubesphere3.1.1 kubernetes1.20.4
(1)准备Dockerfile
FROM nginx
#将dist目录内容复制到nginx容器html内部
COPY dist /usr/share/nginx/html/
EXPOSE 80
(2)准备deploy.yml
apiVersion: apps/v1
kind: Deployment
metadata:
labels:
app: cyy-admin
name: cyy-admin
namespace: edu #一定要写名称空间
spec:
progressDeadlineSeconds: 600
replicas: 1
selector:
matchLabels:
app: cyy-admin
strategy:
rollingUpdate:
maxSurge: 50%
maxUnavailable: 50%
type: RollingUpdate
template:
metadata:
labels:
app: cyy-admin
spec:
imagePullSecrets:
- name: aliyun-docker-hub #提前在项目下配置访问阿里云的账号密码
containers:
- image: $REGISTRY/$DOCKERHUB_NAMESPACE/cyy-admin:SNAPSHOT-$BUILD_NUMBER
# readinessProbe:
# httpGet:
# path: /actuator/health
# port: 8080
# timeoutSeconds: 10
# failureThreshold: 30
# periodSeconds: 5
imagePullPolicy: Always
name: app
ports:
- containerPort: 80
protocol: TCP
resources:
limits:
cpu: 300m
memory: 600Mi
terminationMessagePath: /dev/termination-log
terminationMessagePolicy: File
dnsPolicy: ClusterFirst
restartPolicy: Always
terminationGracePeriodSeconds: 30
---
apiVersion: v1
kind: Service
metadata:
labels:
app: cyy-admin
name: cyy-admin
namespace: edu
spec:
ports:
- name: http
port: 80
protocol: TCP
targetPort: 80
nodePort: 32248
selector:
app: cyy-admin
sessionAffinity: None
type: NodePort
(3)准备Jenkinsfile
pipeline {
agent {
node {
label 'nodejs'
}
}
stages {
stage('拉取代码') {
agent none
steps {
container('nodejs') {
git(url: 'https://gitee.com/ayu-elephant/zxjyfront.git', branch: 'master', changelog: true, poll: false)
sh 'ls -al'
}
}
}
stage('项目编译') {
agent none
steps {
container('nodejs') {
sh 'npm i node-sass --sass_binary_site=https://npm.taobao.org/mirrors/node-sass/'
sh 'npm install --registry=https://registry.npm.taobao.org'
sh 'npm run build'
sh 'ls'
}
}
}
stage('构建镜像') {
agent none
steps {
container('nodejs') {
sh 'ls'
sh 'docker build -t cyy-admin:latest -f Dockerfile .'
}
}
}
stage('推送镜像') {
agent none
steps {
container('nodejs') {
withCredentials([usernamePassword(credentialsId : 'aliyun-docker-image' ,usernameVariable : 'DOCKER_USERNAME_VAR' ,passwordVariable : 'DOCKER_PASSWORD_VAR' ,)]) {
sh 'echo "$DOCKER_PASSWORD_VAR" | docker login $REGISTRY -u "$DOCKER_USERNAME_VAR" --password-stdin'
sh 'docker tag cyy-admin:latest $REGISTRY/$DOCKERHUB_NAMESPACE/cyy-admin:SNAPSHOT-$BUILD_NUMBER'
sh 'docker push $REGISTRY/$DOCKERHUB_NAMESPACE/cyy-admin:SNAPSHOT-$BUILD_NUMBER'
}
}
}
}
// stage('部署到dev环境') {
// agent none
// steps {
// kubernetesDeploy(configs: 'deploy/**', enableConfigSubstitution: true, kubeconfigId: "$KUBECONFIG_CREDENTIAL_ID")
// }
// }
stage('部署到dev环境') {
steps {
container ('nodejs') {
withCredentials([
kubeconfigFile(
credentialsId: env.KUBECONFIG_CREDENTIAL_ID,
variable: 'KUBECONFIG')
]) {
sh 'envsubst < deploy/deploy.yml | kubectl apply -f -'
}
}
}
}
//1、配置全系统的邮件： 全系统的监控
//2、修改ks-jenkins的配置，里面的邮件； 流水线发邮件
stage('发送确认邮件') {
agent none
steps {
mail(to: '[email protected]', subject: 'cyy-admin构建结果', body: "构建成功了 $BUILD_NUMBER")
}
}
}
environment {
DOCKER_CREDENTIAL_ID = 'dockerhub-id'
GITHUB_CREDENTIAL_ID = 'github-id'
KUBECONFIG_CREDENTIAL_ID = 'demo-kubeconfig'
REGISTRY = 'registry.cn-chengdu.aliyuncs.com'
DOCKERHUB_NAMESPACE = 'ayu-edu'
GITHUB_ACCOUNT = 'kubesphere'
APP_NAME = 'devops-java-sample'
}
}
2、修改请求地址为网关地址
4、修改index.html
- 当初引入富文本的时候使用了变量 BASE_URL 这个变量在HTML-WEBPACK-PLUGIN中需要声明,但是在开发环境使用BASE_URL 打包的时候必须改成 htmlWebpackPlugin.options.url 而且二者只能存在其一 注视也会报错
5、使用git的方式自动生成流水线
部署成功：
【部署用户界面nuxt项目】
1、准备工作
(0)版本kubesphere3.1.1 kubernetes1.20.4
(1)准备Dockerfile
FROM node:14.17.6
WORKDIR /app
#把.nuxt目录下的所有内容复制到/app/.nuxt/
COPY . /app/
#安装核心依赖 npm cache clean -f
RUN ["npm","install","--registry=https://registry.npm.taobao.org"]
RUN ["npm","run","build"]
EXPOSE 3000
CMD ["npm", "run", "start"]
(2)准备deploy.yml
apiVersion: apps/v1
kind: Deployment
metadata:
labels:
app: cyy-site
name: cyy-site
namespace: edu #一定要写名称空间
spec:
progressDeadlineSeconds: 600
replicas: 1
selector:
matchLabels:
app: cyy-site
strategy:
rollingUpdate:
maxSurge: 50%
maxUnavailable: 50%
type: RollingUpdate
template:
metadata:
labels:
app: cyy-site
spec:
imagePullSecrets:
- name: aliyun-docker-hub #提前在项目下配置访问阿里云的账号密码
containers:
- image: $REGISTRY/$DOCKERHUB_NAMESPACE/cyy-site:SNAPSHOT-$BUILD_NUMBER
# readinessProbe:
# httpGet:
# path: /actuator/health
# port: 8080
# timeoutSeconds: 10
# failureThreshold: 30
# periodSeconds: 5
imagePullPolicy: Always
name: app
ports:
- containerPort: 3000
protocol: TCP
resources:
limits:
cpu: 300m
memory: 600Mi
terminationMessagePath: /dev/termination-log
terminationMessagePolicy: File
dnsPolicy: ClusterFirst
restartPolicy: Always
terminationGracePeriodSeconds: 30
---
apiVersion: v1
kind: Service
metadata:
labels:
app: cyy-site
name: cyy-site
namespace: edu
spec:
ports:
- name: http
port: 3000
protocol: TCP
targetPort: 3000
nodePort: 32070
selector:
app: cyy-site
sessionAffinity: None
type: NodePort
(3)准备Jenkinsfile
pipeline {
agent {
node {
label 'nodejs'
}
}
stages {
stage('拉取代码') {
agent none
steps {
container('nodejs') {
git(url: 'https://gitee.com/ayu-elephant/zxjy-nuxt-front.git', branch: 'master', changelog: true, poll: false)
sh 'ls -al'
}
}
}
stage('项目编译') {
agent none
steps {
container('nodejs') {
sh 'ls'
sh 'npm install --registry=https://registry.npm.taobao.org'
sh 'npm run build'
}
}
}
stage('构建镜像') {
agent none
steps {
container('nodejs') {
sh 'ls '
sh 'docker build -t cyy-site:latest -f Dockerfile .'
}
}
}
stage('推送镜像') {
agent none
steps {
container('nodejs') {
withCredentials([usernamePassword(credentialsId : 'aliyun-docker-image' ,usernameVariable : 'DOCKER_USERNAME_VAR' ,passwordVariable : 'DOCKER_PASSWORD_VAR' ,)]) {
sh 'echo "$DOCKER_PASSWORD_VAR" | docker login $REGISTRY -u "$DOCKER_USERNAME_VAR" --password-stdin'
sh 'docker tag cyy-site:latest $REGISTRY/$DOCKERHUB_NAMESPACE/cyy-site:SNAPSHOT-$BUILD_NUMBER'
sh 'docker push $REGISTRY/$DOCKERHUB_NAMESPACE/cyy-site:SNAPSHOT-$BUILD_NUMBER'
}
}
}
}
// stage('部署到dev环境') {
// agent none
// steps {
// kubernetesDeploy(configs: 'deploy/**', enableConfigSubstitution: true, kubeconfigId: "$KUBECONFIG_CREDENTIAL_ID")
// }
// }
stage('部署到dev环境') {
steps {
container ('nodejs') {
withCredentials([
kubeconfigFile(
credentialsId: env.KUBECONFIG_CREDENTIAL_ID,
variable: 'KUBECONFIG')
]) {
sh 'envsubst < deploy/deploy.yml | kubectl apply -f -'
}
}
}
}
//1、配置全系统的邮件： 全系统的监控
//2、修改ks-jenkins的配置，里面的邮件； 流水线发邮件
stage('发送确认邮件') {
agent none
steps {
mail(to: '[email protected]', subject: 'cyy-site构建结果', body: "构建成功了 $BUILD_NUMBER")
}
}
}
environment {
DOCKER_CREDENTIAL_ID = 'dockerhub-id'
GITHUB_CREDENTIAL_ID = 'github-id'
KUBECONFIG_CREDENTIAL_ID = 'demo-kubeconfig'
REGISTRY = 'registry.cn-chengdu.aliyuncs.com'
DOCKERHUB_NAMESPACE = 'ayu-edu'
GITHUB_ACCOUNT = 'kubesphere'
APP_NAME = 'devops-java-sample'
}
}
2、修改请求地址为后台网关地址
3、修改nuxt监听端口(这个框架默认只监听localhost端口改成0.0.0.0)
4、部署结果
（网关服务active=prod就会调用不到其他服务，不知道什么原因）
5、补充
1、之前springgateway一直读取不到配置中心的配置，后面我尝试更换nacos的版本和项目依赖的nacos版本一致，然后就能读取到配置了，或者重启nacos服务；服务器内存小的朋友不要限制每个服务的内存大小，可能是设置的内存不够，kubesphere提示无法调度的问题，但是不设置内存会把服务器卡死，可以先设置好内存限制，然后出现无法调度的时候手动打开内存限制，但是多了也会卡死。
2、nuxt打包过后，aliyunplayer 引入不成成功，要写在nuxt.config.js里面才行
script:[{src:"https://g.alicdn.com/de/prismplayer/2.9.17/aliplayer-min.js",type:"text/javascript"}]
