完整的部署前后端项目到服务器

您所在的位置:网站首页 怎么把前端和后端连接起来 完整的部署前后端项目到服务器

完整的部署前后端项目到服务器

2024-07-10 16:52| 来源: 网络整理| 查看: 265

完整发布项目到服务器(包括实现通过域名访问) 一.Docker的使用二.项目的打包三.服务器方面的配置

一.Docker的使用

如果说你不想用Docker请直接跳到第二步,了解Docker或者说希望以后开发环境和团队统一的话请看下去。 1.Docker是什么? 请跳到我上一期的链接: docker配置前端和数据库. 这里请安装好Docker,然后关于Docker的windows教程我推荐链接: windows 10环境下docker的使用.

二.项目的打包

好了,现在我们先把Docker忘了,我这里说一下前端Vue的打包和后端Java Springboots的打包方法。 这里请看链接: 将vue+springboots+mysql+docker上传到服务器. 中有对前后端项目打包的详细介绍

三.服务器方面的配置

这里的话我用的是阿里云的ECS服务器(学生价10元左右),然后域名我买的是腾讯云的域名(学生价1元一年)(别问我为什么一下阿里云一下腾讯云,问就是哪里便宜买哪里)。 然后推荐阿里云的电脑用Centos操作系统(这是Linux系统),买好以后远程登陆,远程连接 在这里插入图片描述 在这里插入图片描述 在这里插入图片描述 然后注意了: 用Docker的朋友们请在服务器里下载好Docker。

注意下好Docker后怎么把你的项目传到服务器呢,这里推荐一个软件(朋友介绍的感觉很好用)就是这个Xftp6,使用也很方便很简单,使用教程网上搜吧几分钟就学会了,给个链接参考:链接: 阿里云服务器 Xftp6 链接及上传文件. 在这里插入图片描述 然后就把项目传过去,注意这里举个例子,前端Vue传build好的dist文件夹就行,后端用package好的jar就行,具体操作请看链接: 将vue+springboots+mysql+docker上传到服务器. 这里是用的Docker,不用Docker的话,请参考。。。。这里我找不到资源了,因为我是拿Docker运行的。

补充: 对了,这里加一点,你有了服务器,你有服务器Ip地址,假如是49.112.234.269 然后你Vue项目运行端口是8080,你就在浏览器输入49.112.234.269:8081就可以进你的项目了,但是你是不是觉得不大对劲,人家网页浏览器都是输入www.baidu.com,www.4399.com这些都是域名就你的是Ip地址加端口未免太难看了。 这里请去腾讯云买一个域名,然后进行DNS的域名绑定与解析(最好搞一个SSL证书),注册域名过程中你会将你服务器的Ip和域名绑定起来。 假如你的域名叫www.lanlansir.com你就可以在浏览器输入www.lanlansir.com:8080来进入你的前端项目,当然了,你需要在设置前端nginx的时候把域名绑定好,然后你有后端的话,访问后端的axios请求就要相应的把localhost改为你的域名,比如:

this.$axios.post('http://www.lanlansir.com:8085/detail/getclass',{select}) .then(res=>{ if(res==null){ this.$router.push('/'); }

这里用了SSL的话是https而不是http,请注意。 然后后端的话记得同意http://www.lanlansir.com:8080的跨域请求,而不是只同意localhost的请求。 好了这里大致流程介绍完毕了,有什么细节问题请在下方评论提出。

然后如果前端用的技术还有WebRTC(支持网页浏览器进行实时语音对话或视频对话的API)的话(这是我的项目需要在线实时视频通话所以踩了这个坑),还得在服务器建一个打孔服务,这里我在下一期进行说明。



【本文地址】


今日新闻


推荐新闻


CopyRight 2018-2019 办公设备维修网 版权所有 豫ICP备15022753号-3