如何快速搭建自己的阿里云服务器(宝塔)并且部署springboot+vue项目(全网最全)

news2024/11/19 15:10:49

📢欢迎点赞👍收藏⭐留言📝如有错误敬请指正!

文章目录

  • 📢欢迎点赞👍收藏⭐留言📝如有错误敬请指正!
  • 一、前言
  • 二、准备工作
    • 1、新手申请
    • 2、安全组设置
    • 3、修改实例
    • 4.这里可以 直接用阿里云远程连接下载宝塔
      • 点击实例 点击远程连接
      • 输入root密码后,点击确认,即可成功登陆到云服务器的命令行界面。(密码就是刚才重置实例的密码)
      • 安装宝塔的命令
      • 输入命令 回车。 下面会出现对话,要输入y 才能继续安装,接下来还会 提示输入y
      • 记住宝塔的网址 和账号密码 保存好
  • 2、登录宝塔Linux面板
    • 有可能你输入 网址打不开宝塔页面。不要慌。 可能是你的宝塔端口 和你刚才 在阿里云 安全组 开的端口不一样。
    • 解决方案 端口不对 。 也就是 安装好的宝塔端口 假如是2223 但是 云服务器安全组,端口 不是2223 , 修改或者添加 安全组端口为223 就可以
  • 3、查看宝塔主页
  • 4. 下面是部署springboot+vue项目
    • 部署springboot项目
    • 二、搭建前准备
    • 在宝塔 软件商店 安装好这些软件
    • 三、部署jar包
      • 打包过程
    • 后端打包
    • 前端打包
    • 这里我把我的jar分享出来
    • 部署后端项目
    • 点击 网站 java 项目添加 java 项目
      • 详细看图片
      • 这里可以选择 启动 停止服务
    • 标题然后点击设置 添加自己的ip
    • 开启外网映射
    • 关键一步 宝塔 安全里面 开启 java 的项目 端口
    • 添加这个 java 项目的端口
        • 然后在 阿里云 安全组件开启 自己项目端口
  • 下面部署前端项目
    • 点击 网站 php项目 添加站点 (这里不要困惑php项目可以 部署 vue 的)
      • 这里的域名先 随便写一个
    • 重新配置该网站目录
    • 重要一点 添加 自己的域名 和端口 并且把 已经有的域名删除
    • 接下来 和刚才后端一样 在宝塔安全里 开启 2020端口 还有阿里云服务器安全组件 也要开启 2020端口 (不知道咋弄的 看刚才后端咋开启的)
    • 添加域名证书 (不添加 项目也可以部署成功,添加的前提要有域名)
    • 四、安装数据库,导入表结构和数据
  • 6、修改nginx配置。(此处配置的是3000端口,您可以根据需要换为80或者别的端口,如果需要绑定域名,请将server_name后面的localhost改为域名即可)
      • 下面要写自己的ip 地址
      • nginx 和前后端 项目 都重启就可以。 访问前端项目用 ip+端口就就可以
      • 其他项目 跨域 自行百度
  • 到这里 就都完成
    • 我自己部署的是 华夏erp的项目 已经成功

一、前言

对于新手或者学生党来说,有时候就想租一个云服务器来玩玩或者练练手,duck不必花那么多钱去租个服务器。这些云服务厂商对学生和新手还是相当友好的。下面将教你如何快速搭建自己的阿里云服务器,完成云服务器的部署。

二、准备工作

1、新手申请

现在阿里云对于新用户来说,还是挺仗义的,新用户能有一个月的云服务器免费使用福利,学生还能申请到两个月的免费使用福利,而且如果你是学生的话,一年的云服务器租金也不是很贵。
在这里插入图片描述
在这里插入图片描述

2、安全组设置

(1)安全组->创建安全组
在这里插入图片描述

(2) 在安全组里添加一些授权端口,方便后续的服务访问,比如:Tomact服务器端口访问、MySql数据库的访问、宝塔控制后台的访问等等。宝塔的源ip地址,设置为自己的本地地址(百度ip即可获取到自己的本地地址),这样方便安全登录宝塔的管理后台,。其余的源可以设置为0.0.0.0,这样的设置比较方便快捷地让我们使用其它的服务。下列是一些常用的端口与服务:

Tomcat:8080

宝塔控制面板:8888

MySql:3306

HTTP:80

SSH:22
在这里插入图片描述

(3)创建成功,查看安全组
在这里插入图片描述

3、修改实例

(1)点击实例------>管理,进入实例修改界面
(2) 我们可以修改实例名称、密码等。(注意这里要重置实例密码,方便下面登陆)

4.这里可以 直接用阿里云远程连接下载宝塔

点击实例 点击远程连接

在这里插入图片描述

输入root密码后,点击确认,即可成功登陆到云服务器的命令行界面。(密码就是刚才重置实例的密码)

接着,我们把对应系统版本的宝塔面板安装命令,输入到这个命令行,然后敲回车键执行。

安装宝塔的命令

yum install -y wget && wget -O install.sh http://download.bt.cn/install/install_6.0.sh && sh install.sh ed8484bec

输入命令 回车。 下面会出现对话,要输入y 才能继续安装,接下来还会 提示输入y

在这里插入图片描述
下载完成之后,可以得到两个地址,这两个地址就是宝塔管理面板的后台地址,一个是外网面板地址,一个是内网面板地址。还有宝塔用户名和密码。

记住宝塔的网址 和账号密码 保存好

在这里插入图片描述

2、登录宝塔Linux面板

在这里插入图片描述

有可能你输入 网址打不开宝塔页面。不要慌。 可能是你的宝塔端口 和你刚才 在阿里云 安全组 开的端口不一样。

解决方案 端口不对 。 也就是 安装好的宝塔端口 假如是2223 但是 云服务器安全组,端口 不是2223 , 修改或者添加 安全组端口为223 就可以

在这里插入图片描述

3、查看宝塔主页

(1)可以看见里面有很多分工明确的功能
在这里插入图片描述

4. 下面是部署springboot+vue项目

部署springboot项目

二、搭建前准备

一台服务器(小编以阿里云为准,备案没有通过,可以使用公网ip进行访问)
一个域名
宝塔可视化界面
springboot的jar包
vue的dist包

在宝塔 软件商店 安装好这些软件

在这里插入图片描述

三、部署jar包

打包过程

基于 Spring Boot + Vue 的前后端分离项目的部署方式主要有如下两种:
1前后端一起部署:将 Vue 项目打包后的dist文件放到 Spring Boot 项目的资源目录下,然后在服务器上部署 Spring Boot 项目即可,终究还是后端项目,并不是真正的分离部署。
2前后端单独部署:将 Spring Boot 项目打包后部署到服务器,再将 Vue 项目打包部署至服务器,最后配置 Nginx 解决请求跨域时的端口转发问题。
第一种方式较容易,也无需进行服务器跨域的相关配置,都使用的是Tomcat服务器进行部署。适合小型项目,如果部署的项目比较大,会造成Tomcat服务器的压力,响应速度也变慢。
第二种方式稍微复杂些,需要在 Nginx 下配置跨域时的端口转发。本文将介绍后者(使用宝塔可视化式部署)。在该方式下,后端 Spring Boot 使用内嵌的 Tomcat 运行,前端 Vue 则需要借助 Nginx 运行(需完成跨域时的请求端口转发)。所以部署前需要在服务器上安装 Nginx 环境。

之前在B站跟着博主写了一个前后端分离的项目,前端工程使用Vue-cli脚手架,后端工程使用SpringBoot,前端和后端分别为8087和8088端口,需跨域配置。自己踩了很多坑,研究了几天才部署成功。现将经验分享。
————————————————

后端打包

后端项目打包之前,需要将某些配置改为服务器的配置。
将允许跨域设置为服务器IP+端口
在这里插入图片描述
将数据库配置为服务器IP地址,并且设置后端项目上下文如/api
在这里插入图片描述
通过Maven的package打包为jar包
在这里插入图片描述

前端打包

请求加上前缀
还记得我们在SpringBoot中加了/api的应用上下文吗?现在将前端所有向后端URL请求中加上/api的前缀。
在这里插入图片描述
配置转发代理

如图分别配置如下
在这里插入图片描述
在前端终端输入 npm run build
将打包生成的dist文件下的static静态文件,和index.html先保存下

这里我把我的jar分享出来

安装包需要前端npm打包、后端maven打包,或者可以直接从如下链接下载:

https://share.weiyun.com/NDJNLhry 密码:vd3aig

部署后端项目

将jar 上传到这里
在这里插入图片描述

点击 网站 java 项目添加 java 项目

在这里插入图片描述

详细看图片

在这里插入图片描述

这里可以选择 启动 停止服务

在这里插入图片描述

标题然后点击设置 添加自己的ip

在这里插入图片描述

开启外网映射

在这里插入图片描述

关键一步 宝塔 安全里面 开启 java 的项目 端口

添加这个 java 项目的端口

在这里插入图片描述

然后在 阿里云 安全组件开启 自己项目端口

在这里插入图片描述

下面部署前端项目

2、创建网站
1、添加站点
新建一个站点,编写域名,域名可以添加端口号,如:www.test.com:9999,则访问的时候要戴上端口号访问,如果有域名证书,用80即可 (没有域名也可以)

点击 网站 php项目 添加站点 (这里不要困惑php项目可以 部署 vue 的)

在这里插入图片描述

这里的域名先 随便写一个

在这里插入图片描述
2、上传文件 vue 打包的 dist
该网站的目录如下。
在这里插入图片描述
点击进入查看文件,然后将vue打包后的dist文件传输到该目录下。
在这里插入图片描述
在这里插入图片描述

重新配置该网站目录

进入该网站的设置页面。
在这里插入图片描述
选择刚才的dist文件,保存就可以了。
在这里插入图片描述
在这里插入图片描述

重要一点 添加 自己的域名 和端口 并且把 已经有的域名删除

在这里插入图片描述

接下来 和刚才后端一样 在宝塔安全里 开启 2020端口 还有阿里云服务器安全组件 也要开启 2020端口 (不知道咋弄的 看刚才后端咋开启的)

在这里插入图片描述

在这里插入图片描述

添加域名证书 (不添加 项目也可以部署成功,添加的前提要有域名)

通过阿里云获取的免费ssl证书输入正确的key和pem就可以部署成功了。
在这里插入图片描述

四、安装数据库,导入表结构和数据

1、需要安装 mysql5.7版本 (注意请不要安装8.0版本,不支持)
在这里插入图片描述
2、mysql5.7 安装完成之后,开始创建数据库,数据库的名称为 jsh_erp,注意中间是下划线
在这里插入图片描述
3、从本地导入 jsh_erp.sql 文件,该文件在后端程序的 docs 文件夹下。
在这里插入图片描述
上传之后点击导入按钮。
在这里插入图片描述
导入成功之后点击列表里面的“工具”按钮可以弹出表结构,验证是否导入成功。加粗样式
在这里插入图片描述
三、安装 JDK1.8 环境
1、由于宝塔面板不能直接安装 jdk1.8,需要安装 tomcat8,安装之后会自动安装 jdk1.8 环境。
在这里插入图片描述
安装时请注意版本要选择 tomcat8。
在这里插入图片描述
Tomcat8安装完成之后,会产生两个java进程,为了不使其影响ERP后端服务的运行,建议在宝塔的“终端”菜单页面执行如下命令来停止该服务:killall java
四、安装 Redis
在软件商店搜索redis,点击安装,等待自动安装完毕
在这里插入图片描述
五、安装 Nginx
1、在软件商店搜索nginx,点击安装,等待自动安装完毕。
**加粗样式
**

6、修改nginx配置。(此处配置的是3000端口,您可以根据需要换为80或者别的端口,如果需要绑定域名,请将server_name后面的localhost改为域名即可)

给nginx配置文件增加如下内容,改完之后重启nginx。注意: gzip 配置可以提高系统访问速度。

下面要写自己的ip 地址

 server {
        listen 3000;
        server_name  这里写自己的ip地址;
        gzip on;
        gzip_min_length 100;
        gzip_types text/plain text/css application/xml application/javascript;
        gzip_vary on;
        location / {
            root   /home/jshERP/jshERP-web;
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }
location /jshERP-boot/ {
	proxy_pass http://localhost:9999/jshERP-boot/;
	proxy_set_header Host $host:$server_port;
        }
 }

nginx 和前后端 项目 都重启就可以。 访问前端项目用 ip+端口就就可以

其他项目 跨域 自行百度

到这里 就都完成

我自己部署的是 华夏erp的项目 已经成功

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

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

相关文章

【图像处理OpenCV(C++版)】——4.2 对比度增强之线性变换

前言: 😊😊😊欢迎来到本博客😊😊😊 🌟🌟🌟 本专栏主要结合OpenCV和C来实现一些基本的图像处理算法并详细解释各参数含义,适用于平时学习、工作快…

【数据结构】5.7 哈夫曼树及其应用

文章目录前言5.7.1 哈夫曼树的基本概念哈夫曼树的特点5.7.2 哈夫曼树的构造算法哈夫曼树的构造过程哈夫曼算法的实现算法思路算法实现5.7.3 哈夫曼编码哈夫曼编码思想前缀编码哈夫曼编码哈夫曼编码的性质哈夫曼编码的算法实现文件的编码和解码前言 编程:将学生的百…

【精品】k8s(Kubernetes)由基础到实战学法指南

轻松快速学会k8s四招 图1 k8s四招 学完本篇,您会获得什么惊喜? 从初学k8s,到帮助别人学会的过程中,发现朋友们和我,并非不努力,而是没有掌握更好的方法。有方法可让我们学的更快更轻松,这篇文章,以一个networkpolicy的题目,来逐步讲解,帮助大家建立一种,自己可以根…

深入了解延迟队列 DelayQueue

1. 前言 前面我们了解了基于数组,链表实现的阻塞队列,以及优先级队列。今天我们来了解下基于优先级队列的延迟队列,而且今天的内容很核心哦。 大家快搬好小板凳做好,听我慢慢分析 2. 简单实例 Task 类 public class Task implem…

数据结构(字符串)

字符串简称串,由零个或多个字符组成的有限序列,一般记为s=“a0 a1a2…an-1”,(n≥0)。其中s称作串名,用双引号括起来的字符序列是串的值。字符ai(0≤i≤n-1)可以是字母、数字或其它字…

开发第三天(Day 03)

首先对ipl.nas进行修改: ; haribote-ipl ; TAB4ORG 0x7c00 ; 这个程序被读入哪里; 以下是标准FAT12格式软盘的描述JMP entryDB 0x90DB "HARIBOTE" ; 可以自由地写引导扇区的名字 (8字节)DW 512 ; 1扇区…

【动态内存管理】-关于动态内存你只知道四个函数是不够的,这里还有题目教你怎么正确使用函数,还不进来看看??

🎇作者:小树苗渴望变成参天大树 💦作者宣言:认真写好每一篇博客 💢 作者gitee:link 如 果 你 喜 欢 作 者 的 文 章 ,就 给 作 者 点 点 关 注 吧! 🎊动态内存管理&…

adrp 命令为何能获取符号的地址

疑问所在 在linux 启动时,在如下位置会将bootloader 传入的x0 - x3 参数保存到boot_args[] 变量中。代码如下: /* …

神经网络基础部件-损失函数详解

一,损失函数概述 大多数深度学习算法都会涉及某种形式的优化,所谓优化指的是改变 xxx 以最小化或最大化某个函数 f(x)f(x)f(x) 的任务,我们通常以最小化 f(x)f(x)f(x) 指代大多数最优化问题。 在机器学习中,损失函数是代价函数的…

Spring Security 多过滤链的使用

一、背景 在我们实际的开发过程中,有些时候可能存在这么一些情况,某些api 比如: /api/** 这些是给App端使用的,数据的返回都是以JSON的格式返回,且这些API的认证方式都是使用的TOKEN进行认证。而除了 /api/** 这些API…

Qt扫盲-QTextEdit理论总结

QTextEdit理论总结一、概述二、用途一:富文本阅读器1. 用法2. 快捷键绑定三、用途二:编辑器1. 用法2. 拖拽3. 快捷键绑定四、常用功能五、信号一、概述 QTextEdit是一个先进的所见即所得的 富文本 查看器/编辑器,支持使用 html 风格的标签或…

【QT】.pro 文件

🌿作者:阿润菜菜 📖专栏:QT开发 .pro 文件是什么 .pro就是工程文件(project),它是qmake自动生成的用于生产makefile的配置文件。类似于VS中的.sln 和vsproj文件 默认情况下,每个 Qt 项目都包含一个后缀名为…

Huffman编码实现文件的压缩和解压缩

一个项目,不过处理起来也比较麻烦,配套可以和文件传输放一起 前提知识: 哈夫曼树和哈夫曼编码的概念和构建 1:n个数构成的哈夫曼树一共有2*n-1个结点>8 -> 15 2:数字越大的数离根节点越近,越小的数离…

无线耳机跑步会不会掉、最适合跑步用的耳机排名

现在,喜欢运动的人越来越多了。大家都有体会,多数运动是相对枯燥的,在运动时听听音乐,那是多么惬意的事情啊。为此,体验过多款耳机,但令我很满意的甚少。相信不少喜欢运动的朋友都有着跟我一样的烦恼吧&…

【Java基础知识3】Java注释:单行、多行、文档注释(如何通过 javadoc 命令生成代码文档、如何在IEDA配置自动为所有的类都添加创建者和创建日期)

本文已收录专栏 🌲《Java进阶之路》🌲 目录 本文已收录专栏 🌲《Java进阶之路》🌲 🍐01、单行注释 🍐02、多行注释 🍐03、文档注释 🍐04、文档注释的注意事项 🍐05、注释…

ceres学习笔记(二)

继续关于ceres官方doc里教程的学习,对于powells function的学习。 一、powells function 鲍威尔法,严格来说是鲍威尔共轭方向法,是迈克尔J.D.鲍威尔提出的一种求解函数局部最小值的算法。该函数不能是可微分的,并且不会导出衍生函…

spring用注解读取与获取对象

前言 上一篇博客简单的介绍了spring的功能与使用&#xff0c;可以看到我们创建一个对象&#xff0c;就需要在xml中存储一个bean对象&#xff0c;这种操作非常的繁琐&#xff0c;因此spring发明了使用注解来快捷存储bean对象 配置工作 我们在xml文件中写下面的代码片段 <…

基于风光储能和需求响应的微电网日前经济调度(Python代码实现)【0】

目录 0 引言 1 计及风光储能和需求响应的微电网日前经济调度模型 1.1风光储能需求响应都不参与的模型 1.2风光参与的模型 1.3风光和储能参与模型 1.4 风光和需求响应参与模型 1.5 风光储能和需求响应都参与模型 2 需求侧响应评价 2.1 负载率 2.2 可再生能源消纳率 …

Win10PE_V2.0Nvme网络版.iso 支持Nvme硬盘免费下载无需积分

Win10PE_V2.0Nvme网络版.iso 支持Nvme硬盘免费下载无需积分 V1.0版本发布 2022年1月19日 内置常用PE工具&#xff0c;7-Zip、EasyImageX_x64、XorBoot Uefi修复、NT6修复、Ghost、CGI、Google浏览器、PENetwork、RegWorkshop、迅雷迷你版、、BOOTICEx64、windows安装器、XP安…

路径计数2

路径计数2 题目描述 一个NNN \times NNN的网格&#xff0c;你一开始在(1,1)(1,1)(1,1)&#xff0c;即左上角。每次只能移动到下方相邻的格子或者右方相邻的格子&#xff0c;问到达(N,N)(N,N)(N,N)&#xff0c;即右下角有多少种方法。 但是这个问题太简单了&#xff0c;所以现…