当前位置: 首页 > news >正文

linux nginx vue_【Devops】Linux服务器上搭建持续集成环境及实战体验

本文内容比较多,先上一个目录,对文本内容有个总体的认识,可以择选需要的部分直接阅读。

目录清单:

1、nginx安装

2、jenkins安装

3、gitlab安装

4、从0搭建vue前端框架

5、从0搭建springboot后端框架

6、搭建ftp服务器

7、手动部署vue项目

8、手动部署springboot项目

9、  jenkins安装后的配置

10、jenkins自动部署vue项目

11、 jenkins自动部署springboot项目

12、服务器重启后带来的问题

13、安装mysql数据库

14、线上从vue-->springboot-->mysql 全流程走通

本文讲解的环境是,Ubuntu 18.04 server 64bit

01

nginx安装

参考https://www.runoob.com/linux/nginx-install-setup.html上Nginx安装配置

由于我个人用的是系统Ubuntu,而参考资料中用的是CentOs

第一步有区别,资料中用的yum安装,而Ubuntu14.0不支持yum下载安装机制

所以我这里是如下操作的:

      安装编译工具及库文件:

sudo apt-get install openssl

sudo apt-get install libssl-dev

sudo apt-get install zlib1g-dev

openssl version查看版本号 1.1.1 

执行./configure --prefix=/usr/local/webserver/nginx --with-http_stub_status_module --with-http_ssl_module --with-pcre=/usr/local/src/pcre-8.35

5f131ef778bfdaf87ab0ea29754b8363.png

当接下来执行make时,会出现错误,经调查网上是nginx与openssl的版本兼容问题导致的。这里nginx版本是1.6.2.下面重新参考资料把nginx取版本1.14.0

最终参考这个https://www.jianshu.com/p/8d3e1689b884进行安装Nginx

<1>安装gcc和g++

apt-get install build-essential

apt-get install libtool

<2>安装pcre依赖库

apt-get install libpcre3 libpcre3-dev

<3>安装zlib依赖库

apt-get install zlib1g-dev

<4>安装openssl依赖库

apt-get install openssl

// 未安装该库会报 SSL modules  require the OpenSSL library

apt-get install libssl-dev 

<5>安装nginx

cd /usr/local/src/

wget http://nginx.org/download/nginx-1.14.0.tar.gz

tar zxvf nginx-1.14.0.tar.gz

cd nginx-1.14.0

./configure --prefix=/usr/local/nginx --with-http_stub_status_module --with-http_ssl_module

make(会报错,找到对应的Makefile文件,将gcc参数中的-Werror去掉)

make install

<6>启动nginx

/usr/local/nginx/sbin/nginx

<7>访问站点

http://122.119.204.125/(这里ip地址是服务器的公网ip)

nginx的主页

<8>正常看到nginx主页,Nginx安装成功!

02

jenkins安装

<1>检查是否已安装java

java -version

如果没有安装,则执行下面命令安装:

sudo apt-get install openjdk-8-jre

//openjdk-8-jre 仅包含JRE,如果需要开发java程序,需要下载openjdk-8-jdk

sudo apt-get install openjdk-8-jdk

配置环境变量,在/etc/profile中添加

#set jdk environment

export JAVA_HOME=/usr/lib/jvm/java-8-openjdk-amd64

export JRE_HOME=$JAVA_HOME/jre

export CLASSPATH=$JAVA_HOME/lib:$JRE_HOME/lib:$CLASSPATH

export PATH=$JAVA_HOME/bin:$JRE_HOME/bin:$PATH

<2>安装Jenkins

wget -q -O - https://pkg.jenkins.io/debian/jenkins-ci.org.key | sudo apt-key add -

sudo sh -c 'echo deb http://pkg.jenkins.io/debian-stable binary/ >          /etc/apt/sources.list.d/jenkins.list'

sudo apt-get update

sudo apt-get install jenkins

<3>在/usr/share/jenkins 下运行 jenkins.war

java -jar jenkins.war

nohup java -jar jenkins.war —httpPort=3389 & (这个可以后端启动)

<5>访问Jenkins(这里要在此服务器的入方向规则中加入3389端口)

http://122.119.204.125:3389/ 

防火墙可能会禁止直接访问3389端口,可以使用如下命令:

firewall-cmd --zone=public --add-port=3389/tcp --permanent

firewall-cmd —reload

  <6>正常看到jenkins主页,Jenkins安装成功!

firewall-cmd添加端口访问操作:

1.查看开放端口

firewall-cmd --zone=public --list-ports

2.添加端口

#永久添加80端口,协议为tcp

firewall-cmd --add-port=80/tcp --permanent

#重新加载

firewall-cmd --reload

3.移除端口

#删除tcp下的80端口

firewall-cmd --zone=public --remove-port=80/tcp --permanent

03

gitlab安装

参考

https://www.jianshu.com/p/74a3a181dc36

https://www.cnblogs.com/yangfan-123/p/11592905.html

https://www.linuxidc.com/Linux/2018-01/150319.htm

<1>sudo apt-get update

sudo apt-get install -y curl openssh-server ca-certificates

sudo apt-get install -y postfix

使用左右键和回车键选择确定、取消,弹出列表选项的时候,选择 Internet Site

<2>信任 GitLab 的 GPG 公钥

curl https://packages.gitlab.com/gpg.key 2> /dev/null | sudo apt-key add - &>/dev/null

<3>使用镜像配置

vi /etc/apt/sources.list.d/gitlab-ce.list  #添加以下内容

deb https://mirrors.tuna.tsinghua.edu.cn/gitlab-ce/ubuntu bionic main

<4>安装 gitlab-ce

sudo apt-get update

sudo apt-get install gitlab-ce

vi /etc/gitlab/gitlab.rb

修改如下:external_url 'http://122.119.204.125:7800/‘

Unicorn[‘port’] = 8800(这行好像可以不用)

<5>启动各项服务

sudo gitlab-ctl reconfigure

<6>检查GitLab是否安装好并且已经正确运行

sudo gitlab-ctl status

<7>添加防火墙规则

firewall-cmd --zone=public --add-port=7800/tcp --permanent

firewall-cmd —reload

<8>浏览web页面并设置密码

http://122.119.204.125:7800/

这时候可能会发生502,分析原因可能是因为内存只有1G,而gitlab要求2G导致的;解决方案是创建交换内存,

sudo ddif=/dev/zero of=/swapfile bs=1024count=2048k

sudo mkswap/swapfile

sudo swapon/swapfile

sudo vim/etc/fstab

/swapfile none swap defaults 0 0

<9>用设置的密码和用户名root登录gitlab主页,然后新建group和其下面的project

  <10>使用另外一台机器,这里用我自己电脑,克隆新建的project到本地

git clone  http://122.119.204.125:7800/testgroup/test.git(这了使用http方式的clone)

第一次会提示输入用户名和密码,输入用户名和密码即可

  <11> 补充,如何使用ssh方式的git clone?

我这里是mac电脑,之前创建过ssh keys,所以直接在~/.ssh文件夹下找到公钥文件,然后把文件中内容复制粘贴到gitlab中的User Settins>SSH Keys的Key编辑框中保存即可

在本地电脑用git clone git@122.119.204.125:testgroup/test.git无需密码直接克隆仓库到本地电脑

gitLab常用命令

sudo gitlab-ctl start # 启动所有 gitlab 组件;

sudo gitlab-ctl stop # 停止所有 gitlab 组件;

sudo gitlab-ctl restart # 重启所有 gitlab 组件;

sudo gitlab-ctl status # 查看服务状态;

sudo gitlab-ctl reconfigure # 启动服务;

sudo vim /etc/gitlab/gitlab.rb # 修改默认的配置文件;

gitlab-rake gitlab:check SANITIZE=true --trace # 检查gitlab;

sudo gitlab-ctl tail # 查看日志;

04

从0搭建vue前端框架

这里用vue-cli3.0+脚手架搭建

  <1>先检查是否已经按照了脚手架

vue -V

如果版本不是3.0+,则需要安装,npm install vue@cli  -g

再验证vue  -V

  <2> vue create  工程名

根据提示选择即可

  <3> 最简单的vue前端框架就搭建好了

05

从0搭建springboot后端框架

这里选择通过web页面使用Spring Initializr搭建

<1> 首先按照下方web页面填写好后点击GENERATE按钮

a38b0f7fb948e16af10b55efa3aa9abd.png

<2>从第一步中生成的zip包解压后,以已存在的maven工程导入到eclipse中即可

<3> 自己创建一个Controller即可验证接口调用

<4> 最简单的springboot后端工程就搭建好了 

06

搭建ftp服务器

<1> sudo apt install vsftpd 安装vsftpd

<2> netstat -antup | grep ftp 查看ftp服务端口

<3>这里浏览器无法打开,但是用FileZilla工具以不安全连接方式可以连接

b9809063f597331e4719e0c80654f9fc.png

e208a92d4e73001496e7d7c994c9a982.png

07

手动部署vue项目

<1> 在本地执行npm run build,生产dist

<2> 讲dist文件夹上传到服务器

<3> 把dist文件夹放入到nginx 的web加载指向的根目录下

<4> 把nginx的conf文件中location对应的root指向修改下,目录后面追加dist文件夹

<5> 此时会出现403问题,查看dist文件夹和内部文件夹及文件的访问权限,执行如下命令:

      chmod -R 755  dist 

a98f8377703fbf3ebaa828062f6279dd.png

08

手动部署springboot项目

 <1>eclipse打开springboot项目

<2>Maven install执行后会在target文件夹下有生成的jar包(jar或war可以在配置文件中配置)

<3>把jar上传至服务器

<4> nohup jar  -jar   *.jar  --server-port=8080 &  (后台启动springboot程序) 

09

jenkins安装后的配置

进入系统管理——>全局工具配置—>JDK和Maven(可以自行安装然后配置JAVA_HOME和MAVEN_HOME,或者勾选自动安装直接用jenkins安装)

10

jenkins自动部署vue项目

<1> 新建任务  选择自由风格

<2> 构建中执行shell脚本 (这里需要写shell脚本执行构建vue工程)

 2a20cb8a38860c3b16458d392f809c83.png

<3> 构建vue工程需要用到npm命令,所以要安装nodejs和npm

<4> 在构建中执行shell 

11

 jenkins自动部署springboot项目

 <1> 新建任务  选择Maven工程

 <2> 构建中执行shell脚本 (这里需要写shell脚本执行构建springboot工程)

       这里写脚本有几步:

第一步,获取到此springboot程序的运行进程号pid   

第二步,强制杀掉此进程  

第三步,启动刚构建完的.jar 服务 

619cb349e4a473e22b3a8afecd967bf1.png

<3> 在构建中执行shell

12

服务器重启后带来的问题

(1) 导致http://122.119.204.125/无法访问

(2) 导致http://122.119.204.125:3389/无法访问

(3) 导致jenkins服务跑到了8080端口上,访问http://122.119.204.125:8080/ 进入jenkins安装之后的初始化配置向导页面 

258d57a4eeb8d665a0fc3ebbee2701c2.png

(4) 导致后端java服务本来是8080端口,结果被jenkins占用无法访问

原因: 因为nginx服务没有设置随系统自启动

         jenkins服务随系统自启动后给的是默认端口8080; 之前用命令启动配置的3389端口没有放入到jenkins配置文件中。

        java服务对应的工程代码配置中端口号改成8080,即可以8080端口自启动java服务。 

13

安装mysql数据库

参考 https://blog.csdn.net/weixx3/article/details/80782479安装即可

14

线上从vue-->springboot-->mysql 全流程走通

浏览器中输入http://122.119.204.125/

点击'调用后端接口从数据库中获取信息展示'按钮,在network会看到请求执行成功并且获取到的信息展示在页面中。

61a077c86527d83030bc735a5925ae3a.png

相关文章:

  • 广州python工程师工资怎么样_没有编程基础,该如何成为月薪2万的Python工程师?...
  • c判断字符串是不是数字_C语言字符串与整数之间的转换,小白必会知识
  • 箭头函数转化为普通函数_理解 JavaScript 箭头函数
  • python抖音涨粉代码_python制作抖音代码舞
  • python中pow_pow在python中指的是什么意思
  • 80端口被占用 nt kernel iis_IIS维护分享
  • 对多用户分时系统最重要_新建网站如何做网络推广?最有效方法是什么?
  • c++ 如何将输入的内容输出到文本文件 要建立文本文件嘛_利用FSO对象读取文本文件的信息...
  • 简单实现x的n次方pta_TF2.0实现DeepFM并部署
  • 基于python的图像处理的毕业论文_基于Python的人脸识别系统研究.docx
  • python图形编程复选按钮和单选按钮详细说明_python GUI库图形界面开发之PyQt5复选框控件QCheckBox详细使用方法与实例...
  • 用python做一张图片_用Python实现将一张图片分成9宫格的示例
  • @data注解_SpringBoot 使用WebSocket打造在线聊天室(基于注解)
  • python做运动控制_【仿真】基于mPython掌控地月运动系统
  • 悟空问答python反爬_悟_刘德华_高音质在线试听_悟歌词|歌曲下载_酷狗音乐
  • (十五)java多线程之并发集合ArrayBlockingQueue
  • Docker入门(二) - Dockerfile
  • github指令
  • React Native移动开发实战-3-实现页面间的数据传递
  • vue.js框架原理浅析
  • Vue2.x学习三:事件处理生命周期钩子
  • 分类模型——Logistics Regression
  • 给第三方使用接口的 URL 签名实现
  • 前端之Sass/Scss实战笔记
  • 入门到放弃node系列之Hello Word篇
  • 通过npm或yarn自动生成vue组件
  • ​ 轻量应用服务器:亚马逊云科技打造全球领先的云计算解决方案
  • ​LeetCode解法汇总2808. 使循环数组所有元素相等的最少秒数
  • #HarmonyOS:Web组件的使用
  • %@ page import=%的用法
  • (06)金属布线——为半导体注入生命的连接
  • (11)工业界推荐系统-小红书推荐场景及内部实践【粗排三塔模型】
  • (day 12)JavaScript学习笔记(数组3)
  • (delphi11最新学习资料) Object Pascal 学习笔记---第8章第2节(共同的基类)
  • (delphi11最新学习资料) Object Pascal 学习笔记---第8章第5节(封闭类和Final方法)
  • (Matalb分类预测)GA-BP遗传算法优化BP神经网络的多维分类预测
  • (二)学习JVM —— 垃圾回收机制
  • (三)Honghu Cloud云架构一定时调度平台
  • (学习日记)2024.03.12:UCOSIII第十四节:时基列表
  • (一)硬件制作--从零开始自制linux掌上电脑(F1C200S) <嵌入式项目>
  • . Flume面试题
  • .naturalWidth 和naturalHeight属性,
  • .NET CORE Aws S3 使用
  • .NET Core工程编译事件$(TargetDir)变量为空引发的思考
  • .NET DataGridView数据绑定说明
  • .NET 服务 ServiceController
  • .NET 实现 NTFS 文件系统的硬链接 mklink /J(Junction)
  • .NET 中使用 TaskCompletionSource 作为线程同步互斥或异步操作的事件
  • .NET 自定义中间件 判断是否存在 AllowAnonymousAttribute 特性 来判断是否需要身份验证
  • .NET/C# 利用 Walterlv.WeakEvents 高性能地定义和使用弱事件
  • .Net小白的大学四年,内含面经
  • .NET与java的MVC模式(2):struts2核心工作流程与原理
  • @Transactional 竟也能解决分布式事务?
  • [ Algorithm ] N次方算法 N Square 动态规划解决
  • [Android] Upload package to device fails #2720