宝塔部署前后端分离项目手册

文章目录

  • 安装宝塔
  • 安装环境
  • 开始部署
    • 1. 前端Vue项目
      • 1.先本地启动前端项目(记住端口号)
      • 2.打包前端项目
      • 3.上传前端项目
      • 4.创建PHP站点
      • 5.安全里开放端口号
      • 6.测试前端
    • 2. 后端boot项目
      • 1. 先在本地跑起来
      • 2.修改数据库的配置信息
      • 3. 项目打包
      • 4. nohup启动项目
      • 4.1 宝塔里平替4的操作:
      • 5. 查看日志
      • 6. 测试后端
    • 3.配置nginx
    • 4.联调
    • 5. 顺便一说

安装宝塔

登录官网直接在线安装就可以 或者参考宝塔官网介绍
https://www.bt.cn/new/download.html

安装完成,记得保存宝塔信息(用户名和密码,密码后期也可以改)

安装环境

登录宝塔,在软件商店里,看需求安装软件.比如:jdk/tomcat/redis/nginx
必要的有FTP、MySQL、PHP、phpMyAdmin、java项目一键部署等,其中,PHP用来启动前端项目,phpMyAdmin用来开启一个新的网页管理MySQL数据库。java项目一键部署用来安装tomcat的同时也会自动安装jdk
在这里插入图片描述

开始部署

前后端项目部署过程中,可能会遇到各种bug.有问题也可以给我留言

1. 前端Vue项目

1.先本地启动前端项目(记住端口号)

在这里插入图片描述
在这里,我的端口号是9528 ,注意这个细节,后面在上传前端文件之后需要用到。

2.打包前端项目

在正式将文件上传到服务器之前,我们先在本地启动一下前端项目,查看一下前端项目在本地启动时所占用的端口,
使用命令npm run build,之后当前目录中会产生dist文件夹。
在这里插入图片描述

3.上传前端项目

项目打包好之后, 我们要将刚才打包好的dist文件夹,利用宝塔的文件菜单上传到指定文件夹位置。

在这里插入图片描述

4.创建PHP站点

我们需要借助PHP添加一个站点,还记得刚刚那个端口号吗?在建站的时候需要填入项目在本地启动时的那个端口号,具体注意事项如下图所示:

在这里插入图片描述
在这里插入图片描述

在这里插入图片描述

在这里插入图片描述

5.安全里开放端口号

云厂商:
在这里插入图片描述
宝塔:
在这里插入图片描述

6.测试前端

当一切准备就绪之后,我们再输入相关的地址,就能够访问刚刚部署的前端应用了
在这里插入图片描述

2. 后端boot项目

先把数据库配置好,把sql导入.

1. 先在本地跑起来

本地没问题,再说往服务器扔.在正式打包后端项目之前,我们同样将项目启动一下,查看项目运行时所占用的端口号。在这里,我的后端项目启动时所占用的端口号为8080。

2.修改数据库的配置信息

主要把你本地的数据库信息改成服务器的数据库信息。。。数据库名/端口号/连接数据库的用户名/密码

3. 项目打包

在idea里执行,maven-》install,找到jar包
后端项目打包成功之后,target目录(在启动类所在的项目里)下会自动生成一个jar文件。同样,我们把打包后的这个jar文件上传至服务器, 这里我上传到的服务器路径与dist文件夹的上一级目录(这个看个人选择)。
在这里插入图片描述

4. nohup启动项目

接下来,我们需要点击后端文件目录下的终端,运行以下命令(该命令保证了spring程序能够在后台运行,不至于我们将控制台关闭之后程序就停止运行了):
在这里插入图片描述

4.1 宝塔里平替4的操作:

4或者4.1 二选一两种方式都可以
在宝塔里添加 【Java项目】 站点
在这里插入图片描述
在这里插入图片描述

添加完项目后,服务会自动启动。在这时,我们需要检查后台项目日志,确保启动成功。
在这里插入图片描述
在这里插入图片描述

5. 查看日志

当我们运行完上面的命令,刷新当前目录,就可以看到多出来的nohup.out文件,双击该文件可以查看spring的运行状态。
在这里插入图片描述

6. 测试后端

我们在网址上输入对应的服务器IP和端口 ,此时就可以看到后台给我们响应回来的数据啦。
在这里插入图片描述

3.配置nginx

在这里插入图片描述在这里插入图片描述

4.联调

前台
在这里插入图片描述
后台:(如果用的4.1才有)
在这里插入图片描述

启动完后端服务之后 ,我们重新访问前端,看是否能查到后台返回相关的数据。 到这里,我们的应用算是部署成功啦。
在这里插入图片描述

5. 顺便一说

在部署的过程中,难免磕磕绊绊,比如在正式运行后端项目时我们需要先在Linux系统中安装JDK,并且在部署的时候还需要注意跨域问题(Controller层加@CrossOrigin)。
JDK怎么更好地安装呢?在没有安装JDK之前,我们可以尝试直接运行下面这一条命令,这时控制面板肯定会报错。与此同时,命令下方会有几行提示信息(即提示我们如何安装JDK并配置环境变量).
在启动后端项目时,如果你想看日志看有没有报错之类的信息,可以先用java命令启动后端服务来看日志,如果前端访问都没报错,再杀掉进程,重新使用nohup(可以忽略挂起信号)启动.

java -jar xxx.jar 
netstat -anp | grep :8080
kill -9 PID
nohup java -jar xxx.jar &

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

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

相关文章

聊天软件鼻祖 ICQ 将于 6 月 26 日关闭;40 光年外发现一颗潜在宜居的类地行星丨 RTE 开发者日报 Vol.212

开发者朋友们大家好: 这里是 「RTE 开发者日报」 ,每天和大家一起看新闻、聊八卦。我们的社区编辑团队会整理分享 RTE(Real-Time Engagement) 领域内「有话题的新闻」、「有态度的观点」、「有意思的数据」、「有思考的文章」、「…

Vue3项目练习详细步骤(第一部分:项目构建,登录注册页面)

项目环境准备 工程创建 安装依赖 项目调整 注册功能 页面结构 接口文档 数据绑定和校验 数据接口调用 解决跨域问题 登录功能 接口文档 数据绑定和校验 数据接口调用 项目演示 项目的后端接口参考:https://blog.csdn.net/dafsq/category_12646722.html…

flutter使用dbus插件时,在终端无法使用“dart-dbus”命令

不用flutter的人,可能都不会找到这儿,遇到这个问题,所以这里默认flutter已经装过了,且对flutter如何使用插件也有所了解了。 由于我在项目中用到了dbus插件,用法如图所示,我需要使用这条命令来生成一个sou…

基于小波熵阈值的心电信号R波检测算法(MATLAB)

心脏兴奋电活动过程可由心电信号(ECG)来反映,心电信号也是医学上对心血管疾病诊断的重要科学依据。心电信号具有一定的随机性且一般情况下十分微弱,在信号采集、放大及变换过程中,心电信号容易受到人体呼吸及检测仪器等因素影响,从…

开发依赖与运行依赖

1. 概念 开发依赖:devDependencies 运行依赖:dependencies 2. 理解 (1)devDependencies 在线上状态不需要使用的依赖,就是开发依赖。为什么 npm 要把它单独分拆出来呢?最终目的是为了减少 node_modul…

golang、php,laravel框架对接stripe海外支付接口的总结和流程(通俗易懂)

目录 stripe是什么? 环境 配置后台 首先让管理员把你设置成为开发者 然后进入后台 然后你要创建产品,开单周期要写每天,我这里理解成每天都会有人买的 获取产品id 获取密钥,后续代码需要用到 支付代码 唤起支付页面 测…

摸鱼大数据——Hive表操作——基本操作

Hive表操作 Hive乱码解决 1、乱码现象 create database test1 comment "乱码测试"; use test1; CREATE TABLE orders ( orderId bigint COMMENT 订单id, orderNo string COMMENT 订单编号, shopId bigint COMMENT 门店id ); 2、处理步骤 注意&#…

Orange Pi AIpro——国产AI新星

初见香橙派AiPro 首先非常高兴能体验我们国产香橙派Aipro,在收到产品的时候还是被这精美的做工和强大的配置所折服。也为国内有这么多优秀的企业不断在进步和攀登而自豪。 比起我之前玩派的时候,同样的价格,现在给的实在是太多了&#xff…

前端JS必用工具【js-tool-big-box】学习,获取全球重点城市时间

我们去住一些旅馆的时候,或者一些国际性网站,经常可以看见他们的钟表会展示一些国家地区的时间,这个就是很常用的功能。但如果不常接触这个功能的开发网站呢,大家就看自己电脑右下角的时间展示,就是自己当前的具体时间…

新手一次过软考高级(系统规划与管理师)秘笈,请收藏!

2024上软考已经圆满结束,距离下半年的考试也只剩下半年不到的时间。需要备考下半年软考高级的小伙伴们可以抓紧开始准备了,毕竟高级科目的难度可是不低的。 今天给大家整理了——系统规划与管理师的备考资料 ,都是核心重点,有PDF&…

艾体宝洞察 | Redis Enterprise对比ElastiCache

选择缓存数据库时,如何在Amazon ElastiCache和Redis Enterprise之间做出选择,应当考虑哪些标准? ElastiCache 通常可以满足基本的缓存需求,因此是一种适合初始阶段的解决方案。但随着使用量的增加,ElastiCache很快会变…

OrangePi AIpro上手初体验:

OrangePi AIpro上手初体验: 1.基本外观及功能接口简介2.点亮OrangePi AIpro开发板3.OrangePi AIpro功能体验3.1.目标检测3.2.OCR文字识别3.3.图像的曝光增强3.4.系统的整体性能(运行ROS) 4.OrangePi AIpro体验总结4.1.硬件及软件生态:4.2.使用体验及性能…

数据结构(三)循环链表

文章目录 一、循环链表(一)概念(二)示意图(三)操作1. 创建循环链表(1)函数声明(2)注意点(3)代码实现 2. 插入(头插&#x…

【LeetCode刷题】滑动窗口解决问题:水果成篮、找到字符串中所有字母异位词

【LeetCode刷题】Day 9 题目1:904. 水果成篮思路分析:思路1:暴力枚举哈希表思路2:窗口滑动哈希表 题目2:438. 找到字符串中所有字母异位词思路分析:思路1:暴力枚举哈希表思路2:滑动窗…

极简编程:一行JS代码获取全球各城市当前时间!

之前在一些国际化网站看到过,他们展示了当前北京、纽约和伦敦的时钟,在一次住店的时候,我也看到了类似的3个时钟,甚至更多,有的会展示东京时间。 让我觉得获取一些全球重点城市的当前时间,会是一个很常用的…

【NumPy】关于numpy.add()函数,看这一篇文章就够了

🧑 博主简介:阿里巴巴嵌入式技术专家,深耕嵌入式人工智能领域,具备多年的嵌入式硬件产品研发管理经验。 📒 博客介绍:分享嵌入式开发领域的相关知识、经验、思考和感悟,欢迎关注。提供嵌入式方向…

5.4 Go 匿名函数与闭包

💝💝💝欢迎莅临我的博客,很高兴能够在这里和您见面!希望您在这里可以感受到一份轻松愉快的氛围,不仅可以获得有趣的内容和知识,也可以畅所欲言、分享您的想法和见解。 推荐:「stormsha的主页」…

网站笔记:huggingface——can you run it?

Can You Run It? LLM version - a Hugging Face Space by Vokturz 1 配置设置部分 Model Name就是需要测量的模型名称 GPU Vendor ——GPU供应商 Filter by RAM (按RAM过滤) 筛选出所有内存容量在选择范围之间的GPU GPU 下拉菜单选择具体的GPU型号 LoRa % trainable param…

靠AI创意,变现20w!

文章首发于公众号:X小鹿AI副业 大家好,我是程序员X小鹿,前互联网大厂程序员,自由职业2年,也一名 AIGC 爱好者,持续分享更多前沿的「AI 工具」和「AI副业玩法」,欢迎一起交流~ 之前X小鹿一直在各…

记录一次安装k8s初始化失败

实例化 kubeadm init --configkubeadm.yaml --ignore-preflight-errorsSystemVerification报错 [init] Using Kubernetes version: v1.25.0 [preflight] Running pre-flight checks error execution phase preflight: [preflight] Some fatal errors occurred:[ERROR CRI]: co…