腾讯云服务器部署前后端服务

服务器:OpenCloudOS (兼容centos8)

后端:java+Springboot

前端:Vue


下载jdk

1)下载jdk11

wget https://download.java.net/openjdk/jdk11/ri/openjdk-11+28_linux-x64_bin.tar.gz

2)解压jdk

tar -xzvf openjdk-11+28_linux-x64_bin.tar.gz

3)环境变量配置

vim /etc/profile 加入以下内容

JAVA_HOME=/home/lighthouse/jdk-11

PATH=$JAVA_HOME/bin:$PATH

CLASSPATH=$JAVA_HOME/lib

export JAVA_HOME CLASSPATH PATH

4)刷新配置文件使生效 source /etc/profile

5)查看java版本信息 java -version

下载jenkins

下载 wget https://mirrors.aliyun.com/jenkins/redhat-stable/jenkins-2.426.2-1.1.noarch.rpm

安装

rpm -ivh jenkins-2.426.2-1.1.noarch.rpm

yum install jenkins

修改配置文件 /usr/lib/systemd/system/jenkins.service

修改user为root

修改端口

javahome

防火墙开启8180端口

启动jenkins sudo systemctl start jenkins

Manage Jenkins -》 Plugins -〉 Advanced settings -》 Update Site
修改插件镜像源
https://mirrors.tuna.tsinghua.edu.cn/jenkins/updates/update-center.json
https://updates.jenkins.io/update-center.json
http://mirror.xmission.com/jenkins/updates/update-center.json

-----------

服务器下载git

查看版本 git --version

如果版本过低则卸载 yum remove -y git

git下载地址:Index of /pub/software/scm/git/

[root@localhost ~]# yum -y install libcurl-devel expat-devel curl-devel  gettext-devel openssl-devel zlib-devel[root@localhost ~]# yum -y install  gcc perl-ExtUtils-MakeMaker[root@localhost ~]# cd /usr/local/src/# 下面的地址就是通过上面的下载地址获取的
[root@localhost src]# wget https://mirrors.edge.kernel.org/pub/software/scm/git/git-2.9.5.tar.gz[root@localhost src]# tar -zvxf git-2.9.5.tar.gz[root@localhost src]# cd git-2.9.5.tar[root@localhost git-2.9.5]# make prefix=/usr/local/git all[root@localhost git-2.9.5]# make prefix=/usr/local/git install

添加git到环境变量 vi /etc/profile

export PATH=$PATH:/usr/local/git/bin

刷新环境变量 source /etc/profile

查看更新后的git版本和所在路径

[root@localhost ~]# git --version[root@localhost ~]# whereis git

进入jenkins设置

Path to Git executable填入whereis git展示的内容+/bin/git

如上面"whereis git"的地址为"/usr/local/git",则应该填入 "/usr/local/git/bin/git"
 

jenkins配置git信息

1)github上新建token, 并记录

Settings/Developer Settings / Personal access tokens (classic)

2) 去到要操作的远程仓库,添加一个 webhook

PayloadURL填的就是http://XXX(你的服务器,填localhost):端口号8080/github-webhook(照抄),其他的照抄

3)下载插件 GitHub Integration Plugin ,安装完后,重启jenkins

4)配置Github 服务器

系统管理—>系统设置—>GitHub --> Add GitHub Sever

API URL 输入 https://api.github.com ,点击Add添加信息

服务器下载maven

下载地址 Maven – Download Apache Maven

下载后上传压缩包到服务器, tar -zvxf解压缩

配置环境变量 vi /etc/profile

export MAVEN_HOME=/home/lighthouse/apache-maven-3.8.8 (这里改成自己的路径)

export PATH=$MAVEN_HOME/bin:$PATH

刷新环境变量 source /etc/profile

查看版本 mvn -v

CentOS8安装Maven-CSDN博客

需要在jenkins上下载Maven Integration 插件

jenkins配置maven信息

jenkins new item (后端)

General配置

Source Code Management 配置

Credentials是jenkins的账号密码,配置见下图

Branch Specifier 要和github的branch对应

Build Triggers

Build whenever a SNAPSHOT dependency is built

  • 这个选项允许你的项目在它的任何依赖项(特别是 Maven 依赖)被构建时自动触发构建。这通常用于当一个项目依赖于另一个项目的快照版本时,确保在依赖更新后立即重新构建。

Trigger builds remotely (e.g., from scripts)

  • 这个选项允许你通过网络请求远程触发构建。这可以通过调用 Jenkins 的 API 或者使用特定的脚本来实现。

Build after other projects are built

  • 这个选项会在你的项目在其他指定的项目构建完成后触发。这通常用于依赖关系,比如你需要等待一个或多个项目构建完成后才能开始自己的构建。

Build periodically

  • 这个选项允许你设置一个周期性的时间表来触发构建。你可以指定一个 cron 表达式来定义构建的频率和时间。

GitHub hook trigger for GITScm polling

  • 当配置了这个选项后,Jenkins 可以使用 GitHub 的 webhook 功能,在源代码仓库(如 GitHub)有新的提交时自动触发构建。这通常用于实现持续集成。

Poll SCM

  • 这个选项会让 Jenkins 定期轮询(检查)源代码管理(SCM)系统,如 Git,以查看是否有新的更改。如果有新的提交,Jenkins 将自动开始一个新的构建。

Build Environment

<plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><configuration><excludes><exclude><groupId>org.projectlombok</groupId><artifactId>lombok</artifactId></exclude></excludes></configuration>
</plugin>

Pre Steps

可以构建环境变量和执行shell脚本,我在这里选择shell脚本打jar包

echo "------------pre steps ---------------"

mvn clean package

echo "-----------mvn clean package done ---------------"

/var/lib/jenkins/workspace/3/target/mywiki.jar

Build

因为我的打包命令写在了prestep里,这里就可以空着了。

Root POM

  • 指定构建的根 POM 文件路径。这通常是 Maven 项目的 pom.xml 文件,它定义了项目的构建过程和依赖。

Goals and options

  • 输入你想要执行的 Maven 目标(Goals)和选项。例如,clean install 是常见的 Maven 命令,用于清理之前的构建产物并安装新的构建到本地仓库。

Advanced

高级设置,通常用于添加额外的 Maven 参数或系统属性。

MAVEN_OPTS

  • 用于指定传递给 Maven 进程的 JVM 参数,如内存设置 -Xms512m -Xmx2g。

Incremental build - only build changed modules

  • 如果启用,Maven 将只构建那些有更改的模块,以加快构建速度。

Disable automatic artifact archiving

  • 禁用自动将构建产物存档到 Jenkins 的构建目录。

Disable automatic site documentation artifact archiving

  • 禁用自动存档生成的站点文档(如 Javadoc)。

Disable automatic fingerprinting of consumed and produced artifacts

  • 禁用对消耗和生成的构件进行自动指纹记录,这有助于识别和定位构件。

Enable triggering of downstream projects

  • 如果勾选,当当前项目的构建完成后,会自动触发下游项目的构建。

Build modules in parallel

  • 允许 Maven 并行构建模块,这可以加快构建速度。

Use private Maven repository

  • 指定使用私有 Maven 仓库而不是公共仓库。

Resolve Dependencies during Pom parsing

  • 在解析 POM 文件时解析依赖,这可以加快构建速度。

Run Headless

  • 允许 Maven 在无头模式下运行,即不需要图形用户界面。

Process Plugins during Pom parsing

  • 在解析 POM 文件时处理插件,这可以确保插件配置被正确应用。

Use custom workspace

  • 允许 Maven 使用自定义的工作空间目录。

Maven Validation Level

  • 设置 Maven 校验级别,如 WARNING、ERROR 等。

DEFAULT

  • 使用默认的 Maven 配置。

Settings file

  • 指定 Maven 设置文件的位置,通常是一个 settings.xml 文件,它包含了 Maven 的配置信息,如仓库位置、构建代理等。

Use default maven settings

  • 使用 Jenkins 服务器上的默认 Maven 设置。

Global Settings file

  • 使用全局 Maven 设置文件,这通常在 Jenkins 的系统配置中定义。


 

Post Steps

"Post Steps"(后续步骤)是构建完成后执行的一系列操作。这些步骤可以用于各种目的,如通知、清理、部署或其他自定义任务。以下几个选项控制了何时执行这些后续步骤:

Run only if build succeeds

  • 这个选项意味着只有当构建成功完成时,后续步骤才会被执行。如果构建失败或者产生异常,这些步骤将被跳过。这适用于那些只对成功构建有意义的操作,比如部署到生产环境。

Run only if build succeeds or is unstable

  • 使用这个选项,即使构建结果为 "Unstable"(例如,自动化测试中有些测试用例失败),后续步骤也会执行。"Unstable" 通常表示构建本身完成了,但是存在一些警告或测试失败的情况。这可以用来进行一些额外的检查或者通知,即使构建不是完全成功的。

Run regardless of build result

  • 无论构建成功、失败还是处于不稳定状态,选择这个选项后,后续步骤都会执行。这通常用于那些无论构建结果如何都需要进行的操作,比如发送构建结果通知、清理工作空间、记录日志信息等。

选择哪种选项取决于你的具体需求和 CI/CD 流程。例如,你可能不希望在构建失败时部署应用,但你可能总是需要发送邮件通知团队成员构建的状态,或者清理一些临时文件。

生成的jar名字是在pom文件中定义的

<build><finalName>mywiki</finalName>
</build>

Jar文件路径是 jenkins工作区+item名称+项目的jar包路径

在这里通过 java -jar 启动后端服务

#!/bin/bash
# 获取当前 job 名称
ITEM_NAME="${JOB_NAME}"# 拼接完整的 JAR 文件路径
JAR_PATH="/var/lib/jenkins/workspace/${ITEM_NAME}/target/mywiki.jar"# 检查 JAR 文件是否存在
if [ -f "$JAR_PATH" ]; thenecho "JAR file found at: $JAR_PATH"# 这里可以添加启动 JAR 文件的命令java -jar ${JAR_PATH}
elseecho "JAR file not found at: $JAR_PATH"# 可以在这里添加错误处理逻辑
fi

以下是前端部分


下载nodejs

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境,它允许你在服务器端运行 JavaScript 代码。Vue 项目中广泛使用了基于 Node.js 的工具和库。 Node.js 的安装会自带 npm(Node Package Manager),这是 JavaScript 的包管理器。

Node.js — Download Node.js®

下载的包为node-v20.13.0-linux-x64.tar.xz格式,

安装xz工具来解压缩 sudo dnf install xz

解压缩 tar xf node-v20.13.0-linux-x64.tar.xz

验证安装 node -v

jenkins配置nodejs

jenkins 安装NodeJS插件

配置

下载npm

npm 是 Node.js 的默认包管理器,用于管理项目中的依赖。Vue 项目中的大部分依赖都是通过 npm 来安装的。

下载 sudo dnf install npm

验证安装 npm -v

设置 npm 镜像 npm config set registry https://registry.npmmirror.com (2021 年淘宝发文称,npm 淘宝镜像已经从 registry.npm.taobao.org 切换到了registry.npmmirror.com。旧域名也于 2022 年 5 月 31 日停止服务)

查看镜像 npm config get registry

下载Vue CLI

Vue CLI 是 Vue 官方的命令行工具,它提供了快速搭建 Vue 项目和开发过程中的许多辅助功能。

下载 sudo npm install -g @vue/cli

打包Vue项目

npm run build

本地运行打包后的包:

sudo npm install -g serve

serve -s dist

服务器下载nginx

下载nginx
sudo dnf install epel-release
sudo dnf install nginx
启动 Nginx 服务,并设置开机自启
sudo systemctl start nginx
sudo systemctl enable nginx

检查是否成功启动 sudo systemctl status nginx

sudo cp -r /var/lib/jenkins/workspace/frontend_Item/web/dist/* /usr/share/nginx/html/my-vue-app/

配置 Nginx 运行 Vue 应用

  1. 创建 Vue 应用的目录: 假设你的 Vue 应用构建后的 dist 文件夹名为 my-vue-app,你需要在 Nginx 的网页根目录下创建一个相应的目录。
sudo mkdir -p /usr/share/nginx/html/my-vue-app
  1. 复制 Vue 应用的静态文件: 将 Vue 应用构建后的 dist 文件夹内容复制到 Nginx 的目录中。
sudo cp -r /path/to/your/vue/dist/* /usr/share/nginx/html/my-vue-app/

请将 /path/to/your/vue/dist 替换为你的 Vue 项目 dist 文件夹的实际路径。

  1. 配置 Nginx 虚拟主机: 创建一个新的 Nginx 配置文件,用于设置 Vue 应用的虚拟主机。
sudo vi /etc/nginx/conf.d/my-vue-app.conf

在文件中添加以下内容,然后保存退出:

server {listen 80;server_name my-vue-app;location / {root /usr/share/nginx/html/my-vue-app;try_files $uri $uri/ /index.html;}location /api/ {proxy_pass http://your-backend-api:port;}location /static/ {root /usr/share/nginx/html/my-vue-app;}error_page 404 /404.html;location = /404.html {internal;}error_page 500 502 503 504 /50x.html;location = /50x.html {internal;}
}

请将 my-vue-app 替换为你的实际应用名称,http://your-backend-api:port 替换为你的后端 API 服务器地址和端口。

  1. 重启 Nginx 以应用配置
sudo systemctl restart nginx
  1. 访问你的 Vue 应用: 在浏览器中输入 http://your_server_ip 或 http://your_server_domain,你应该能看到你的 Vue 应用正在运行。

jenkins new item(前端)

通用、源码配置、触发器同后端配置。

Build Environment

Pre Steps

在这里配置代码打包信息。

vue代码打包后会生成一个dist文件夹,因为在我自己jenkins服务器上配置打包,CPU会直接98%, 所以我是在本地进行打包,然后再传代码到git, 这里的配置就可以省略。

#!/bin/bash
# 获取当前 job 名称
ITEM_NAME="${JOB_NAME}"
echo "===========${ITEM_NAME}=========="# 拼接完整的 package.json路径
JSON_PATH="/var/lib/jenkins/workspace/${ITEM_NAME}/web/"
echo "===========${JSON_PATH}=========="
cd ${JSON_PATH}echo "===========start  clean cache =========="
npm cache clean --force
echo "===========start  npm install =========="
npm installecho "===========start  npm run build  dabao=========="
npm run build

Post Steps

把打包后的dist文件复制到nginx目录下,然后重启nginx

#!/bin/bashecho "===========copy file start=========="
cp -r /var/lib/jenkins/workspace/${ITEM_NAME}/web/dist/* /usr/share/nginx/html/my-vue-app/
echo "===========copy file done=========="echo "===========restart ngix start=========="
systemctl restart nginx

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/web/9718.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

论文研读 Disentangled Information Bottleneck

解耦信息瓶颈 摘要&#xff1a; 信息瓶颈方法是一种从源随机变量中提取与预测目标随机变量相关的信息的技术&#xff0c;通常通过优化平衡压缩和预测项的IB拉格朗日乘子f来实现&#xff0c;然而拉格朗日乘子很难优化&#xff0c;需要多次实验来调整拉格朗日乘子的值&#xff0c…

使用leafletjs实现地图洋流、风场气象6要素地图标注、等值面图

前期实现的功能由于数据失效无法显示效果&#xff0c;今天重新对接一个数据源进行展示&#xff0c;实现效果如下图&#xff1a; 访问地址&#xff1a;可视化三维 GIS 特效 - 沉浸式视觉体验呈现令人惊叹的三维 GIS 特效&#xff0c;提供沉浸式视觉体验。https://www.wheart.cn/…

QAnything 在mac M2 上纯python环境安装使用体验(避坑指南)

这是一篇mac m2本地纯python环境安装 qanything的文章。安装并不顺利&#xff0c;官方提供的模型无法在本地跑。 这篇文章记录了&#xff0c;使用xinference来部署本地模型&#xff0c;并利用openAi的通用接口的方式&#xff0c;可以正常使用。 记录了遇到的所有的问题&#xf…

*****水上飞机:继承,虚函数,虚继承

一题目 请设计以下航行器、飞机、船、水上飞机等 4 个类。 CRAFT 为航行器类&#xff0c;是公共基类&#xff0c;提供航行器的基本特性。包括&#xff1a; 一个保护数据成员&#xff1a;speed(速度)。 三个公有成员函数&#xff1a;构造函数(初始化速度)、析构函数和 Show 函数…

AOSP开发

Android 开发者 | Android Developers (google.cn) android开源代码&#xff1a; Android 开源项目 | Android Open Source Project (google.cn)

FreeRTOS任务调度器

目录 1、什么是任务调度器 2、FreeRTOS中的任务调度器 2.1 抢占式调度 2.2 时间片调度 2.3 协作式调度 3、任务调度案例分析 3.1 实验需求 3.2 CubeMX配置 3.3 代码实现 3.3.1 uart.c 重定向printf 3.3.2 打开freertos.c并添加代码 3.3.4 代码现象 1、什么是任务调度…

Spring:spring-boot-starter-parent与spring-boot-dependencies的区别

参考&#xff1a;spring-boot-starter-parent与spring-boot-dependencies的区别

[uniapp] 配置ts类型声明

我想引进图片,但是报错 声明一下就行 TypeScript 支持 | uni-app官网 创建tsconfig.json文件,复制官网的配置 然后在随便一个目录下写一个随便名字的.d.ts文件 例如这样 保存就行 因为ts是默认扫描全部的,所以要按照官网的写法 把不必要的排除掉就行,免得浪费性能

JS-导入导出

export和export default是ES6中导出模块中变量的语法 导入导出变量 //导出方法&#xff08;js文件中&#xff09; export const 变量名值//导入方法 对应导入的变量&#xff0c;一定要加花括号 import {变量名} from js文件路径 导入导出函数 //导出方法&#xff08;js文件中…

RST文档技巧汇总

RST文件技巧汇总 前言转换工具简洁语法注释空行标题与章节样式链接图片列表表格代码块文档内引用引用rst 前言 RST全称ReStructuredText&#xff0c;是一种使用简单标记语法编写文档的文本文件格式。RST文档是轻量级标记语言的一种&#xff0c;被设计为容易阅读和编写的纯文本…

TikTok自动评论、回复的脚本怎么制作?

在当今数字化的时代&#xff0c;社交媒体平台如TikTok已经成为人们日常生活的一部分&#xff0c;为了更有效地在TikTok上进行营销或互动&#xff0c;许多用户和企业开始寻找自动化工具&#xff0c;如自动评论和回复的脚本&#xff0c;以节省时间并提高效率。 本文将科普如何制…

[数据结构]——非递归排序总结——笔试爱考

具体代码实现在gitee&#xff1a;登录 - Gitee.com 目录 具体代码实现在gitee&#xff1a;登录 - Gitee.com 1.非递归实现的快速排序算法。 第一步 首先要创建一个栈 第二步紧接着进行入栈&#xff0c;出栈&#xff0c;弹出栈顶元素&#xff0c;获取栈顶元素&#xff0c;判…

Windows下安装Node.js、npm和electronic,并运行一个Hello, World!脚本程序

20240510 By wdhuag 目录 简介&#xff1a; 参考&#xff1a; 安装Node.js 安装npm 配置npm&#xff1a; 修改包存放目录和缓存目录 切换镜像源 使用 nrm 切换镜像源 安装Electron 运行一个Hello, World!脚本程序 安装Yarn JavaScript 指南 简介&#xff1a; Nod…

英文论文审稿

英文论文审稿1 英文论文审稿4英文论文审稿5审稿意见: Identification and early warning method of key disaster-causing factors of AE signals for rockburst based on principal component analysis method 作者从城市地质环境的量化评价出发,创造性地提出城市地质环境健…

MT8370_联发科MTK8370(Genio 510)芯片性能规格参数

MT8370芯片是一款利用超高效的6nm制程工艺打造的边缘AI平台&#xff0c;具有强大的性能和功能。这款芯片集成了六核CPU(2x2.2 GHz Arm Cortex-A78 & 4x2.0 GHz Arm Cortex-A55)、Arm Mali-G57 MC2 GPU、集成的APU(AI处理器)和DSP&#xff0c;以及一个HEVC编码加速引擎&…

数据库查询--条件查询

目录 1.关系运算条件的查询 2.逻辑运算符条件的查询 3.带关键字IN的查询 4.带BETWEEN AND关键字的查询 5.空值查询 6.带LIKE关键字的模糊查询 1.关系运算条件的查询 在SELECT语句中&#xff0c;最常见的是使用WHERE字句指定关系运算条件对数据进行过滤。 语法格式&#x…

【二叉树算法题记录】二叉树的所有路径,路径总和——回溯

目录 257. 二叉树的所有路径题目描述题目分析cpp代码 112. 路径总和题目描述题目分析cpp代码 257. 二叉树的所有路径 题目描述 给你一个二叉树的根节点root &#xff0c;按任意顺序&#xff0c;返回所有从根节点到叶子节点的路径。 题目分析 其实从根节点往下走&#xff0c…

设计模式——迭代器模式(Iterator)

迭代器模式&#xff08;Iterator Pattern&#xff09;是一种行为设计模式&#xff0c;它使得我们能够顺序地访问一个聚合对象中的各个元素&#xff0c;而又不需要暴露该对象的内部表示。迭代器模式为遍历不同的聚合结构提供了一个统一的接口&#xff0c;使得客户端代码可以独立…

【回溯算法】【Python实现】图的m着色问题

文章目录 [toc]问题描述图的 m m m可着色判定问题图的 m m m可着色优化问题四色猜想 回溯法时间复杂性Python实现 问题描述 图的 m m m可着色判定问题 给定无向连通图 G G G和 m m m种不同的颜色&#xff0c;用这些颜色为图 G G G的各顶点着色&#xff0c;每个顶点着一种颜色…

自然资源-地质勘查工作的流程梳理

自然资源-地质勘查工作的流程梳理 地质勘查从广义上可理解为地质工作&#xff0c;地质队员就好像是国家宝藏的“寻宝人”&#xff0c;通过地质勘查&#xff0c;为国家找矿&#xff0c;以保障国家能源资源安全和服务国计民生&#xff0c;发挥着地质工作在国民经济建设中的基础性…