springboot+vue项目部署服务器(看了就会,不会拉黑我)

发布时间:2022-06-27 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了springboot+vue项目部署服务器(看了就会,不会拉黑我)脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

sPRingboot后端部署

1.前提条件

​ 可执行的springboot码文件,Linux服务器,写好的vue前端项目

2.执行步骤

​ a. 打开springboot项目中的配置文件application.yaml

springboot+vue项目部署服务器(看了就会,不会拉黑我)

​ b.配置服务器端口号

​ c.将springboot后端项目打包

springboot+vue项目部署服务器(看了就会,不会拉黑我)

d.在springboot文件中找到刚才对应的jar包

springboot+vue项目部署服务器(看了就会,不会拉黑我)

e.使用xshell上传到本地服务器(在想要存放对应文件目录中使用rz或者直接拖动文件复制到Linux的当前文件夹下)

  • 后端传输完毕

VUE的前端部署

一.在Vue项目的根目录下,使用命令实现对VUE项目的打包

npm run build

二.在VUE项目中生成dist打包文件

三.将dist文件中的资源移至linux系统中的nginx文件夹下的htML文件夹下(此步骤先将nginx的配置之后再进行实践)

springboot+vue项目部署服务器(看了就会,不会拉黑我)

Nginx的配置

下载nginx的压缩文件

nginx的下载地址F1a;nginx: download

springboot+vue项目部署服务器(看了就会,不会拉黑我)

与上述传入jar包的方式相同传入Linux

nginx的安装

whereis nginx

如果没有出现结果表示在此服务器中没有安装nginx,可以继续安装nginx 解压文件

tar -zxvf nginx的压缩包名

进入解压之后的nginx文件夹配置文件

./configure

使用Make命令完成安装

make

nginx的配置

springboot+vue项目部署服务器(看了就会,不会拉黑我)

将80端口作为nginx的代理端口号,当访问服务器的地址时,默认访问80端口的前端页面,当点击登录按钮时,向后端请求数据,来进行对登录数据校验工作,为什么将location/下面的前端路径默认html不需要修改吗?不改变默认访问路径路径来访问前端呢?

注意:在部署VUE系统的时候已经将打包的dist文件夹中的内容加入nginx中的html的路径中,默认已经访问到前端页面,所以在这里的前端路径不需要修改

springboot+vue项目部署服务器(看了就会,不会拉黑我)

当前已经部署完毕,已经可以直接访问

无法请求后端的两种情况

后端拒绝连接

springboot+vue项目部署服务器(看了就会,不会拉黑我)

1.端口号没有开放

a.火墙的允许端口号未开放

将nginx代理的端口号,注册到防火墙

firewall-cmd --query-port=8080/tcp //查询端口是否开放
firewall-cmd --PErmanent --add-port=80/tcp //开放80端口
firewall-cmd --permanent --remove-port=8080/tcp //移出端口
firewall-cmd --reload //重启防火墙

b.阿里或者腾讯云需要创建安全组 云上创建属于80端口的安全组

springboot+vue项目部署服务器(看了就会,不会拉黑我)

2.前端代码发送请求给后端的地址千万注意不能写成localhost

如果将地址写为localhost+端口号可以实现后端在本地运行,而前端在服务器上运行的简单的前后端分离

springboot+vue项目部署服务器(看了就会,不会拉黑我)

址千万注意不能写成localhost

如果将地址写为localhost+端口号可以实现后端在本地运行,而前端在服务器上运行的简单的前后端分离

脚本宝典总结

以上是脚本宝典为你收集整理的springboot+vue项目部署服务器(看了就会,不会拉黑我)全部内容,希望文章能够帮你解决springboot+vue项目部署服务器(看了就会,不会拉黑我)所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。