如何部署上线项目

❤️ Author: 老九
☕️ 个人博客:老九的CSDN博客
🙏 个人名言:不可控之事 乐观面对
😍 系列专栏:

文章目录

  • 多环境
    • 多环境分类
    • 前端多环境实战
      • 请求地址
      • 启动方式
      • 项目配置
    • 后端多环境实战
  • 项目部署
    • 原始部署
      • 前端
      • 后端
    • 宝塔Linux
    • Docker部署
      • 后端
      • 前端
    • Docker部署平台
    • 绑定域名

多环境

  • 多环境:指同一套项目代码在不同的阶段需要根据实际情况来部署到不同的机器上,并且要调整配置
  • 为什么需要多环境:1.每个环境互不影响2.区分不同的阶段 开发、测试、生产环境3.对项目进行优化:本地日志级别,精简依赖节省项目体积,项目的环境/参数可以调整比如JVM参数

多环境分类

  1. 本地环境(自己的电脑)
  2. 开发环境(远程开发)大家连同一台机器,为了大家开发
  3. 测试环境(测试)
  4. 预发布环境:和正式环境一致,正式数据库
  5. 正式环境
  6. 沙箱环境(实验环境):为了做实验

前端多环境实战

请求地址

开发环境:localhost:8000
线上环境:ming-pu.top (域名)

startFront(env){
	if(env === 'prod'){
	//生产环境
	}else{
	//保持本地开发逻辑
	}
}

在这里插入图片描述
如果用了umi框架,build时会自动传入NODE_ENV == production 参数,通过process.env.NODE_ENV就可以判断这个项目是本地启动还是生产环境启动
在这里插入图片描述

启动方式

开发环境:npm run start(本地启动,监听端口,自动更细)
线上环境:npm run build(项目构建打包),可以使用serve工具启动(npm i -g serve),npm run build之后会出现一个dist文件,通过dist文件打开终端,用serve命令启动之后,process.env.NODE_ENV就是production了

项目配置

不同的项目(框架)都有不同的配置文件,umi的配置文件是config;可以在配置文件后添加对应的环境名称后缀来区分开发环境和生产环境
开发环境:config.dev.js
生产环境:config.prod.js
公共配置:config.ts

后端多环境实战

springboot项目,通过application.yml添加不同的后缀来区分配置文件;application.yml里面的配置是公共的配置,application-prod.yml里面就可以删除公共的配置,修改线上数据库的配置
在这里插入图片描述
在自带的maven中进行打jar包

然后在target中,通过终端进行jar包运行,记得传入环境变量
在这里插入图片描述
结束
主要是改依赖的环境地址:1.数据库地址2.缓存地址3.消息队列地址4.项目端口号5.tomcat服务器配置

项目部署

参考文章:https://www.bilibili.com/read/cv16179200/
需要Linux服务器(建议用centOS 8以上)

原始部署

前端

需要web服务器:nginx
安装nginx服务器:1.用系统自带的软件包管理器快速安装,比如centos的yum2.自己到官网上安装
在服务器上下载nginx的步骤:使用curl -o 文件名 文件下载地址在这里插入图片描述

  1. 通过 tar -zxvf nginx-1.21.6.tar.gz进行解压
  2. cd nginx-1.21.6进入目录
  3. 使用./configure 命令进行依赖环境检查
  4. 通过检查发现需要安装openssl这个库,才能使用https,命令是 yum install openssl openssl-devel -y
  5. 下面这个命令是使用openssl这个库./configure --with-http_ssl_module --with-http_v2_module --with-stream
  6. 使用make命令,进行nginx的编译(make命令的作用就是将这个nginx用c语言写的代码,编译成二进制可以执行的文件)
  7. 使用make install进行安装这个可执行文件
  8. 使用 ls /usr/local/nginx/sbin/nginx,如果它是绿色的,就说明是可执行的文件
  9. 我们需要把nginx配置到环境变量中,使用命令vim /etc/profile进入环境变量;之后使用shift+g跳到最后一行,点击i在最后一行插入一条命令 export PATH=$PATH:/usr/local/nginx/sbin 然后按esc,再输入:wq进行退出
  10. 配置完环境变量之后,执行source /etc/profile 重新激活环境变量,然后就可以在任何的文件夹下执行nginx命令执行 nginx了
  11. 通过netstat -ntlp查看启动情况
  12. 然后前端项目build打包,然后把打的项目包dist压缩后,直接拖拽到services目录下(如果上传多了,使用rm -rf xxx删除文件)
  13. 通过unzip dist.zip -d user-center-front 进行解压
    在这里插入图片描述
  14. 之后需要修改nginx的配置文件(注意,要修改的是/usr/local/nginx/conf这个目录下面的nginx.conf文件才好用),配置进入页面的目录,esc+wq修改完之后,执行nginx -s reload进行重新加载
    下面这个user root;原来是一个注释默认是user nobody,在第一行,把它改成user root即可;
    在这里插入图片描述
    在这里插入图片描述

后端

需要安装java,maven(打包)
这段是安装javayum install -y java-1.8.0-openjdk*
通过 curl -o apache-maven-3.9.6-bin.tar.gz https://dlcdn.apache.org/maven/maven-3/3.9.6/binaries/apache-maven-3.9.6-bin.tar.gz去安装maven
在这里插入图片描述

  1. 通过 tar -zxvf apache-maven-3.8.5-bin.tar.gz进行解压
  2. 进入bin目录之后,就会看到mvn的可执行文件,这个就是可以构建项目了
  3. 为了方便,配置一下环境变量,首先通过pwd获取当前的路径,然后使用命令vim /etc/profile进入环境变量;之后使用shift+g跳到最后一行,点击i在最后一行插入一条命令 export PATH=$PATH:/root/services/apache-maven-3.9.6/bin, 然后按esc,再输入:wq进行退出
  4. 配置完环境变量之后,执行source /etc/profile 重新激活环境变量
  5. 安装git yum install -y git
  6. git clone xxxx,把文件下载下来,然后cd xxx进入clone的文件夹
  7. 执行mvn package -DskipTests,通过这个命令,把已有的项目打包成可执行的jar包,通过-DskipTests跳过测试
  8. 之后会出现一个jar包,之后执行chmod a+x user-center-backend-0.0.1-SNAPSHOT.jar,将这个jar添加可执行权限
  9. 之后执行nohup java -jar ./user-center-backend-0.0.1-SNAPSHOT.jar --spring.profiles.active=prod &,之后按回车,然后再输入jobs就能看到执行的命令了在这里插入图片描述

宝塔Linux

这是一个Linux 可视化的运维面板

  1. 首先安装一个宝塔Linux,也可以买一个腾讯云的轻量应用服务器,直接就可以提供默认的系统镜像(宝塔Linux直接就提供了)
  2. 进入之后,点开面板设置,首先修改一下面板的用户名和密码
  3. 然后进入到软件商店,搜索nginx,选择快速安装在这里插入图片描述
  4. 安装java,搜索tomcat,最好安装9.0.0.M18 Stable在这里插入图片描述
  5. 下载完之后,点击终端,执行命令,测试java和nginx是否下载完毕
  6. 之后我们点开网站,然后添加站点
    在这里插入图片描述
  7. 之后填写内容,第一个是域名ming-pu.top,下面这些都不用修改,然后直接提交,之后就创建好站点了
    在这里插入图片描述
  8. 之后点击根目录,把文件都删掉
    在这里插入图片描述
    在这里插入图片描述
  9. 之后把前端打包好的文件dist全部拖进去,前端就部署好了;如果你要自己改nginx的配置,操作有个设置,然后点击配置文件,就是nginx的修改配置文件了
    在这里插入图片描述
  10. 配置java项目在这里插入图片描述加一个–server.address=0.0.0.0,将tomcat默认是ipv6,改成ipv4
    在这里插入图片描述
    如果不行的话,就在代码的配置文件中修改
    在这里插入图片描述
    记得在宝塔的白名单中,开放8080端口
    在这里插入图片描述

Docker部署

Docker是容器,可以将项目依赖的环境(比如java,nginx)和项目的代码一起打包成镜像,所有同学都能下载镜像,镜像更容易分发和移植。
在启动项目时,不需要敲一大堆命令,而是直接下载镜像,启动镜像就可以了。
docker可以理解为软件安装包。

后端

  1. 在宝塔中安装docker,通过docker -v命令,判断是否安装成功docker
  2. 之后要在前后端的项目分别指定一个Dockerfile,用于指定构建Docker镜像的方法,Dockerfile一般情况下不需要完全从0自己写,建议去github,gitee 等托管平台参考同类项目(比如springboot)
    在这里插入图片描述
    首先,第一个FROM就是我们这个Docker镜像,依赖于哪个基础镜像
    WORKDIR : 指定工作目录
    COPY:就是把需要复制的东西从本机都复制到工作目录,基本都是把配置文件和代码包复制到了工作目录中
    RUN :执行打包的命令
    CMD/ENTRYPOINT(可以附加额外的参数):运行镜像的时候,默认执行的命令
  3. 我们要先把项目的所有的代码上传到服务器上,然后通过docker命令,根据dockerfile制作一个镜像
    在这里插入图片描述
  4. 通过命令[sudo] docker build -t user-center-backend:v0.0.1 .,注意最后面有个点,如果没有权限的话(提示Permission denied),前面加个sudo就可以

前端

在这里插入图片描述
前端比较特殊,除了加一个Dockerfile,还要加一个nginx.conf的配置
try-files就是为了避免404的问题,如果访问不到页面,就降级到index.html
在这里插入图片描述
改完代码之后,在服务器把前端的项目也克隆下来,然后执行docker命令[sudo] docker build -t user-center-frontend:v0.0.1 .,等待构建(其实前端和后端构建docker都差不多)
在这里插入图片描述
如果构建完了,我们可以通过[sudo] docker images命令去看到我们构建的镜像
最后通过[sudo] docker run xxxx命令,启动镜像
docker run -p 80:80 -v /data/app:/usr/share/nginx/html/ -d user-center-frontend:v0.0.1这段命令,运用了虚拟化的技术,-v进行了目录映射,将本机资源和容器内部的资源进行关联,-p还进行了端口影射,将本机的端口和容器应用的端口进行关联 ,-d是镜像的名称
通过命令docker ps -a查看已经在运行的容器ID,然后使用容器ID进入容器
如果你想进入容器,命令是docker exec -i -t xxx容器的id /bin/bash ,通过exit命令退出容器
如果你想杀掉容器,命令是docker kill xxx容器的id,就可以杀掉容器了
如果想查看docker执行的日志,通过docker logs xxx容器的ID,就可以查看docker执行的输出日志了
如果你想要查看所有的镜像名称,通过docker images命令,即可查看
如果你想要删除镜像,通过docker rmi -f xxx镜像的名称,就可以杀掉镜像了

Docker部署平台

  1. 云服务商的容器平台(腾讯云,阿里云)
  2. 面向某个领域的容器平台(前端/后端 微信云托管)
    但是这些都是要花钱的,慎用!

容器平台的好处:1.不用输入命令操作,更方便省事2.不用在控制台操作,更傻瓜式,更简单3.大厂提供,比自己运维更省心4.额外的能力,比如监控,告警,其他(存储,负载均衡,自动扩容,流水线自动构建)

绑定域名

前端项目访问: 用户输入网址 => 域名解析服务器(把网址解析为ip地址/ 交给其他的域名解析服务,例如cdn,实现负载均衡) => nginx接受请求,找到对应文件,返回文件给前端 => 前端加载文件到浏览器(js,css)=> 渲染页面

————————————————————————
♥♥♥码字不易,大家的支持就是我坚持下去的动力♥♥♥
版权声明:本文为CSDN博主「亚太地区百大最帅面孔第101名」的原创文章

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

深入理解计算机系统 家庭作业 2.84

这题没有这个要求所以可以用 ? > : < 这种运算 以下代码用的是位级运算.因为我误解了题意 呜呜呜 想看用判断的代码请自行百度 ((((ux<<9>>9)<<((ux<<1>>24)-127)) - ((uy<<9>>9)<<((uy<<1>>24)-127)))>…

当代软件专业大学生与青年在新质生产力背景下的发展探究

在新质生产力的浪潮中,信息技术以前所未有的速度革新,为软件专业的大学生和青年带来了丰富的机遇,同时也伴随着一系列的挑战。他们如何把握时代的脉搏,实现个人的发展,成为了值得深入探讨的话题。 一、新质生产力背景下的机遇 随着新质生产力的不断发展,信息技术在各个领…

一篇文章带你掌握二叉树(附带二叉树基本操作完整代码演示,和两种思路)

【本长内容】 1. 掌握树的基本概念 2. 掌握二叉树概念及特性 3. 掌握二叉树的基本操作 4. 完成二叉树相关的面试题练习 1. 树形结构 1.1 概念 树是一种非线性的数据结构&#xff0c;它是由n&#xff08;n>0&#xff09;个有限结点组成一个具有层次关系的集合。把它叫做树是…

考研数据结构——中缀转后缀(用栈实现)

算法目的&#xff1a;给计算机一个中缀表达式&#xff0c;输出一个后缀表达式。 考点&#xff1a;考察进行到某一步时&#xff0c;栈内的情况是怎么样的&#xff0c;选择题。 学习目标&#xff1a;能用笔算的方式模拟整个过程&#xff0c;不需要会写代码。 过程&#xff1a;…

分类预测 | Matlab实现GWO-LSSVM灰狼算法优化最小二乘支持向量机数据分类预测

分类预测 | Matlab实现GWO-LSSVM灰狼算法优化最小二乘支持向量机数据分类预测 目录 分类预测 | Matlab实现GWO-LSSVM灰狼算法优化最小二乘支持向量机数据分类预测分类效果基本介绍程序设计参考资料 分类效果 基本介绍 1.Matlab实现GWO-LSSVM灰狼算法优化最小二乘支持向量机数据…

每日面经分享(Git经典题目,Git入门)

1. GitHub是什么 a. Git是一个分布式版本控制系统&#xff0c;作用是跟踪、管理和协调软件开发项目中的代码更改。 b. 提供了一种有效的方式来管理代码的版本历史&#xff0c;以及多人协作开发的能力。 2. Git的作用有哪些 a. 版本控制&#xff1a;Git可以记录每次代码更改的…

Anaconda换源和常用命令

设置Anaconda国内镜像加速下载 使用conda install python包非常便捷&#xff0c;但由于官方服务器位于国外&#xff0c;下载速度较慢。为了提升下载速度&#xff0c;国内清华大学提供了Anaconda的仓库镜像。 要将Anaconda设置为使用国内镜像&#xff0c;特别是清华镜像源&…

[java]网络编程

网络编程概述 计算机网络&#xff1a; 把分布在不同地理区域的具有独立功能的计算机,通过通信设备与线路连接起来&#xff0c;由功能完善的软件实现资源共享和信息传递的系统。 Java是 Internet 上的语言&#xff0c;它从语言级上提供了对网络应用程序的支持&#xff0c;程序…

软考之零碎片段记录(六)+复习巩固

A. 上新 一、关系模式 1. 决定属性 AB->C,函数依赖左侧出现为决定属性 AB->C,函数依赖右侧出现为非决定属性 候选键在决定属性中挑选&#xff0c;AB->C, CD->B中&#xff0c;A,D为侯选建 二、授权SQL 将权限授予用户&#xff08;grant <权限> on&#xf…

插入排序解读

在众多的排序算法中&#xff0c;插入排序以其直观易懂和在某些特定场景下的高效性而备受青睐。今天&#xff0c;我们就来深入探索一下插入排序的原理、实现方式以及它的优缺点。 一、算法原理 插入排序相当于打牌中抓牌插入的方式。插入排序的工作方式是通过构建有序序列&…

[计算机网络] 当输入网址到网页

HTTP 首先&#xff0c;对URL进行解析&#xff0c;URL包含了Web服务器和对应的文件&#xff08;文件路径&#xff09; URL是请求服务器中的文件资源 通过Web服务器和对应文件来生产HTTP包&#xff08;超文本传输协议&#xff09; DNS 根据域名查询对应的IP地址 域名的层级 根…

前端验证码

一、基础验证码 gVerify.js&#xff1a; !(function (window, document) {function GVerify(options) { //创建一个图形验证码对象&#xff0c;接收options对象为参数this.options { //默认options参数值id: "", //容器IdcanvasId: "verifyCanvas", //ca…

JavaScript常用知识面试题day01

大家好我是没钱的君子下流坯&#xff0c;用自己的话解释自己的知识 前端行业下坡路&#xff0c;甚至可说前端已死&#xff0c;我还想在前段行业在干下去&#xff0c;所以从新开始储备自己的知识。 从CSS——>Javascript——>VUE2——>Vuex、VueRouter、webpack——>…

【项目实战】——商品管理的制作完整代码

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;开发者-曼亿点 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 曼亿点 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a…

阿里云邮件服务器多少钱?邮件服务器租用费用

阿里云邮件服务器租用费用&#xff0c;2核2G3M带宽99元一年、2核4G4M服务器199元一年&#xff0c;不只是云服务器ECS&#xff0c;还可以选择轻量应用服务器。 0、在阿里云CLUB中心领取 aliyun.club 当前最新的优惠券和服务器报价单 1、阿里云服务器ECS经济型e实例&#xff0c;2…

Splunk Attack Range:一款针对Splunk安全的模拟测试环境创建工具

关于Splunk Attack Range Splunk Attack Range是一款针对Splunk安全的模拟测试环境创建工具&#xff0c;该工具完全开源&#xff0c;目前由Splunk威胁研究团队负责维护。 该工具能够帮助广大研究人员构建模拟攻击测试所用的本地或云端环境&#xff0c;并将数据转发至Splunk实例…

基于SpringBoot+微信小程序的农产品销售平台

一、项目背景介绍&#xff1a; 随着人们收入的不断增加、生活水平的普遍提高,对生活质量的要求也日益凸显。而作为关乎每个人的生命、健康安全的食品卫生、质量无疑更被人们所重视。所以,… 2. 其他国家的绿色有机食品所占其国家食品市场比重比较大,如德国在99年便已达到40%,美…

差异创意搜索算法(DCS)-2024年SCI一区新算法-公式原理详解与性能测评 Matlab代码免费获取

声明&#xff1a;文章是从本人公众号中复制而来&#xff0c;因此&#xff0c;想最新最快了解各类智能优化算法及其改进的朋友&#xff0c;可关注我的公众号&#xff1a;强盛机器学习&#xff0c;不定期会有很多免费代码分享~ 目录 原理简介 一、种群初始化 二、差异化知识…

ThinkPHP代码审计(1) 不安全的SQL注入PHP反序列化链子phar利用简单的CMS审计实例

ThinkPHP代码审计(1) 不安全的SQL注入&PHP反序列化链子phar利用&简单的CMS审计实例 文章目录 ThinkPHP代码审计(1) 不安全的SQL注入&PHP反序列化链子phar利用&简单的CMS审计实例一.Thinkphp5不安全的SQL写法二.Thinkphp3 SQL注入三.Thinkphp链5.1.x结合phar实现…

可变参数模板

可变参数模板的概念 可变参数模板是C11新增的最强大的特性之一&#xff0c;它对参数高度泛化&#xff0c;能够让我们创建可以接受可变参数的函数模板和类模板。 在C98/03中&#xff0c;类模板和函数模板中只能包含固定数量的模板参数&#xff0c;可变模板参数无疑是一个巨大的…