本地项目部署到线上流程

2024-04-30 00:36

本文主要是介绍本地项目部署到线上流程,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

本地项目需要想要别人能正常访问,则需要通过部署在云服务器上,通过ip申请来访问,之前部署过一次没有记录,本次记录一下部署流程。

一、购买云服务器

云服务器有很多种,本次用的阿里云服务器,其他服务器大同小异,购买流程大致相同,根据自己所需,购买自己能用的配置。如果只是自己测试用的话,全部选择第一项,因为是最便宜的 。或者购买套餐,也是不错的选择。
本次演示的是购买一个阿里云服务器的99元/年套餐,2核2G40G,个人使用绰绰有余
在这里插入图片描述
选择配置:一般情况下地域选择离自己近的地区,操作系统看个人喜好,我选择的是CentOS
在这里插入图片描述
之后就是购买流程,直接略过。

二、安装和使用宝塔

2.1 查看公网ip

在云服务器ECS的概览上,可以找到上述购买的云服务器的公网ip,只要是联网状态,在cmd上也能正常ping得通
在这里插入图片描述
应该是套餐选择的原因,之前购买一个月的套餐,是没有附带公网ip的,所以需要购买弹性公网ip进行绑定,才能进行后续配置使用
在这里插入图片描述

2.2 xshell登录

2.2.1 打开xshell软件,配置主机名称

在这里插入图片描述

2.2.2 配置账号密码

在这里插入图片描述
由于购买的是套餐,没有经过密码配置的步骤,不清楚密码所以需要在实例中进行密码修改,自定义选择配置购买步骤应该有配置密码这一步。
在这里插入图片描述

2.2.3 连接远程服务器

双击连接,以下情况是连接成功状态
在这里插入图片描述

2.3 安装宝塔面板

进入宝塔官网,根据所安装的系统来选择
在这里插入图片描述
粘贴至xshell进行安装,此处不能ctrl+v来粘贴,用右键粘贴选项
在这里插入图片描述
等待安装,这里的安装面板时,选择y,然后继续等待安装
在这里插入图片描述
安装成功后,会显示访问的外网地址和登录所需要的账号密码(需要保存)
在这里插入图片描述

三、配置宝塔面板

3.1 配置端口

2.3步骤之后将宝塔面板部署在了10209端口上(根据实际端口进行配置),需要再云服务器上放开访问,否则是无法正常打开宝塔面板的

3.1.1 打开实例安全组

在这里插入图片描述

3.1.2 端口配置

配置目的端口10129,源的话设置0.0.0.0,表示任何地址都可以访问。
在这里插入图片描述
配置后续的mysql、前端8887服务和后端8889服务
在这里插入图片描述

3.2 登录宝塔面板

打开外网地址,输入账号密码
在这里插入图片描述
阅读之后才能进入面板
在这里插入图片描述
绑定手机号,没有账号进行注册即可
在这里插入图片描述
面板安全页面配置相关端口
在这里插入图片描述

3.3 安装所需服务

默认会推荐安装套件进行安装,一键安装相对简单一点,也可以在面板软件商店进行按需安装
在这里插入图片描述
所需安装:nginxmysqlpm2node版本管理,此处特别要注意版本问题,否则会出现各种奇奇怪怪的问题。
之后在首页调出面板
在这里插入图片描述

四、部署项目

4.1 部署数据库

4.1.1 创建数据库

输入数据库名和用户名,访问权限设置成所有人,也可以根据安全配置进行配置
在这里插入图片描述

4.1.2 导入sql文件

点击导入
在这里插入图片描述
从本地上传,选择自己的sql文件,导入后进行上传
在这里插入图片描述
之后进行导入
在这里插入图片描述
经过远程连接,结果正常
在这里插入图片描述

4.2 部署后端

后台安装node版本为v12.16.0
在这里插入图片描述
更换配置文件,连接到远程数据库中
在这里插入图片描述

4.2.1 上传目录

后端目录部署在文件\www\wwwroot
在这里插入图片描述
选择后端服务(express)
在这里插入图片描述
解压后端文件
在这里插入图片描述

4.2.2 运行服务

添加pm2上的项目,注意启动文件要选择app.js
在这里插入图片描述
启动成功
在这里插入图片描述

4.2.3 测试后端服务

使用postman进行接口测试,有返回就是成功了。
在这里插入图片描述

4.3 配置前端

4.3.1 上传项目

前端目录部署在文件\www\server,上传前端打包的vue项目
在这里插入图片描述

4.3.2 配置nginx

server上配置监听端口,前端端口为8887,如果不清楚nginx配置的可以转另一篇文件链接
当访问8887/api/时,会匹配到服务器8889/api/下
在这里插入图片描述

注意1:如果出现pm2找不到命令或者node找不到命令,需要检查是否安装好了环境,到pm2管理器上的模块管理上找,都有版本则是没问题的,需要先安装node,再安装pm2,不然可能会出现这种情况(别问我怎么知道!!!)

在这里插入图片描述

注意2:前端项目由于刚开始是使用vite.config.js代理配置,在服务器上的nginx重新配置

在这里插入图片描述

这篇关于本地项目部署到线上流程的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/947555

相关文章

springboot项目中整合高德地图的实践

《springboot项目中整合高德地图的实践》:本文主要介绍springboot项目中整合高德地图的实践,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教... 目录一:高德开放平台的使用二:创建数据库(我是用的是mysql)三:Springboot所需的依赖(根据你的需求再

SpringBoot整合Flowable实现工作流的详细流程

《SpringBoot整合Flowable实现工作流的详细流程》Flowable是一个使用Java编写的轻量级业务流程引擎,Flowable流程引擎可用于部署BPMN2.0流程定义,创建这些流程定义的... 目录1、流程引擎介绍2、创建项目3、画流程图4、开发接口4.1 Java 类梳理4.2 查看流程图4

一文详解如何在idea中快速搭建一个Spring Boot项目

《一文详解如何在idea中快速搭建一个SpringBoot项目》IntelliJIDEA作为Java开发者的‌首选IDE‌,深度集成SpringBoot支持,可一键生成项目骨架、智能配置依赖,这篇文... 目录前言1、创建项目名称2、勾选需要的依赖3、在setting中检查maven4、编写数据源5、开启热

SpringBoot项目配置logback-spring.xml屏蔽特定路径的日志

《SpringBoot项目配置logback-spring.xml屏蔽特定路径的日志》在SpringBoot项目中,使用logback-spring.xml配置屏蔽特定路径的日志有两种常用方式,文中的... 目录方案一:基础配置(直接关闭目标路径日志)方案二:结合 Spring Profile 按环境屏蔽关

Java使用HttpClient实现图片下载与本地保存功能

《Java使用HttpClient实现图片下载与本地保存功能》在当今数字化时代,网络资源的获取与处理已成为软件开发中的常见需求,其中,图片作为网络上最常见的资源之一,其下载与保存功能在许多应用场景中都... 目录引言一、Apache HttpClient简介二、技术栈与环境准备三、实现图片下载与保存功能1.

java Long 与long之间的转换流程

《javaLong与long之间的转换流程》Long类提供了一些方法,用于在long和其他数据类型(如String)之间进行转换,本文将详细介绍如何在Java中实现Long和long之间的转换,感... 目录概述流程步骤1:将long转换为Long对象步骤2:将Longhttp://www.cppcns.c

MySQL版本问题导致项目无法启动问题的解决方案

《MySQL版本问题导致项目无法启动问题的解决方案》本文记录了一次因MySQL版本不一致导致项目启动失败的经历,详细解析了连接错误的原因,并提供了两种解决方案:调整连接字符串禁用SSL或统一MySQL... 目录本地项目启动报错报错原因:解决方案第一个:第二种:容器启动mysql的坑两种修改时区的方法:本地

springboot项目中使用JOSN解析库的方法

《springboot项目中使用JOSN解析库的方法》JSON,全程是JavaScriptObjectNotation,是一种轻量级的数据交换格式,本文给大家介绍springboot项目中使用JOSN... 目录一、jsON解析简介二、Spring Boot项目中使用JSON解析1、pom.XML文件引入依

使用vscode搭建pywebview集成vue项目实践

《使用vscode搭建pywebview集成vue项目实践》:本文主要介绍使用vscode搭建pywebview集成vue项目实践,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地... 目录环境准备项目源码下载项目说明调试与生成可执行文件核心代码说明总结本节我们使用pythonpywebv

Maven项目中集成数据库文档生成工具的操作步骤

《Maven项目中集成数据库文档生成工具的操作步骤》在Maven项目中,可以通过集成数据库文档生成工具来自动生成数据库文档,本文为大家整理了使用screw-maven-plugin(推荐)的完... 目录1. 添加插件配置到 pom.XML2. 配置数据库信息3. 执行生成命令4. 高级配置选项5. 注意事