部署springboot+vue项目文档(若依ruoyi项目部署步骤)
摘自:https://blog.csdn.net/Dreamboy_w/article/details/104389797
部署springboot+vue项目文档(若依ruoyi项目部署步骤)
一:部署linux + nginx
二:部署windows + tomcat(无nginx)
三:解决调用第三方api如百度地图api所存在的跨域问题
最近部署若依项目,一直部署失败,多亏有好人将这篇文章相赠,特地分享出来供大家学习参考,希望大家共同进步。
一:部署linux + nginx
部署后台代码
1.1 由于本人采用的是idea工具开发,所以在terminal中mvn clean package生成对应的jar包,此jar包可去对应文件所在目录的target查找。
1.2 将jar复制到linux之中。
部署前端代码
2.1 使用npm run build:prod --report将前端项目打包,将会在前端目录下生成一个dist文件夹。
2.2 同样将dist复制到linux之中。
linux服务器中需要装载redis以及nginx,redis是存放缓存数据,nginx是用于代理前后端服务。
3.1 安装redis并启动。
3.2 安装nginx并修改相关配置。
找到nginx所在目录,并修改conf/nginx.conf文件,修改如下图:
代码如下:
worker_processes 1;
events {
worker_connections 1024;
}
http {
include mime.types;
default_type application/octet-stream;
sendfile on;
keepalive_timeout 65;
server {
listen 80; # 监听的端口
server_name 自己的服务器地址; # 域名或ip
location / { # 访问路径配置
root /usr/local/ruoyi/dist/;# 根目录
try_files $uri $uri/ /index.html;
index index.html index.htm; # 默认首页
}
location /prod-api/ {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:8080/;
}
}
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
启动jar包,并启动nginx,在windows浏览器中直接输入ip即可访问。
4.1 jar后台启动,后台启动的话可以进行其他操作,否则将无法进行其他操作。
nohup java -jar jarName >msg.log 2>&1 &
msg.log文件是在输入上一行启动命令的当前目录下
有的小伙伴可能第一次打包放上去没问题,但是后期修改了一些文件或者菜单等,再部署上去可能会遇到菜单打不开之类的问题
不要慌,只要修改vue.config.js文件里面的配置就好,如下图,去掉/之前的.即可
二:部署windows + tomcat(无nginx)
修改pom文件,改jar为war:
打包成war包之后直接复制到windows中的tomcat的webapps目录下,并修改名称为prod-api,类似部署在linux中需要修改nginx.conf的配置。
将vue项目打包并把dist文件复制到tomcat的webapps目录下。
修改tomcat目录下的conf文件夹下的service.xml:
4.1 启动端口为后台的启动端口
4.2 在host节点下添加对应的访问路径配置代码
<Context path="/" docBase="dist的绝对路径(也可以写相对于webapps的路径)" reloadable="true" crossContext="true"></Context>
1
如果不添加此处代码,登录是可以的,但是登陆之后是空白页,因为在本地的运行的项目是类似ip:端口/router地址的,如果不修改,将会导致前面所说的问题。(不知道说的对不对,个人猜想)
启动tomcat,输入ip:端口即可。
以上操作之后刷新页面的话会存在404错误,所以需要在dist目录的文件夹下新建WEB-INF文件夹,并在里面添加web.xml文件:
web.xml文件代码如下:
<?xml version="1.0" encoding="UTF-8"?>
<web-app xmlns="http://xmlns.jcp.org/xml/ns/javaee"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee
http://xmlns.jcp.org/xml/ns/javaee/web-app_3_1.xsd"
version="3.1" metadata-complete="true">
<display-name>Router for Tomcat</display-name>
<error-page>
<error-code>404</error-code>
<location>/index.html</location>
</error-page>
</web-app>
1
2
3
4
5
6
7
8
9
10
11
12
三:解决调用第三方api如百度地图api所存在的跨域问题
————————————————
版权声明:本文为CSDN博主「Dreamboy_w」的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/Dreamboy_w/article/details/104389797
部署springboot+vue项目文档(若依ruoyi项目部署步骤)的更多相关文章
- 使用 Hexo 创建项目文档网站
当我们发布一个开源项目的时候,最重要的事情之一就是要创建项目文档.对使用项目的用户来说,文档是非常有必要的,通常我们可以使用下面这些方式来创建文档: GitHub Wiki:在 Github 上我们可 ...
- Maven生成项目文档
Maven项目可以通过maven-site-plugin插件生成项目文档,无论什么项目都可以生成. 执行命令: mvn site 生成完成的输出目录在${basedir}/target/site文件夹 ...
- 使用Docker部署Spring-Boot+Vue博客系统
在今年年初的时候,完成了自己的个Fame博客系统的实现,当时也做了一篇博文Spring-boot+Vue = Fame 写blog的一次小结作为记录和介绍.从完成实现到现在,也断断续续的根据实际的使用 ...
- springboot+swagger接口文档企业实践(下)
目录 1.引言 2. swagger接口过滤 2.1 按包过滤(package) 2.2 按类注解过滤 2.3 按方法注解过滤 2.4 按分组过滤 2.4.1 定义注解ApiVersion 2.4.2 ...
- vuepress+gitee 构建在线项目文档
目录 快速入门 在现有vue项目中安装本地开发依赖vuepress 在现有vue项目根目录下创建docs目录 创建并配置文档首页内容 运行,查看效果 可能会出现vue和vue-server-rende ...
- Atitit. 项目文档目录大纲 总集合 v2
Atitit. 项目文档目录大纲 总集合 v2 -----Atitti.原有项目源码的架构,框架,配置与环境说明 v3 q511 -----Atitit.开发环境 与 工具 以及技术框架 以及 注意 ...
- MkDocs项目文档生成器
简介 安装 我的配置 Chocolatey 简介 - Windows的包管理器 官方网址 安装 注意事项 Python 简介 安装 Pip 简介-Python的包管理器 升级 MkDocs的安装 使用 ...
- 通过VuePress管理项目文档(二)
通过vue组件实现跟:Element相似的效果.需要在VuePress网站中将自己的项目中的Vue组件运行结果展示在页面中. 至于如何将组件在VuePress网站中展示请参考:https://segm ...
- 通过VuePress管理项目文档(一)
VuePress 相关链接 完整的Vue组件代码以及完整的文档,仅适用于个人参考学习: 文档预览地址:预览链接 使用VuePress编辑文档的代码访问:组件文档 完整代码:组件代码 Vue组件开发 这 ...
- Atitit 项目文档规范化与必备文档与推荐文档列表
Atitit 项目文档规范化与必备文档与推荐文档列表 ===========比较重要的必备文档========== 项目组名单通讯录( 包括项目组,客户沟通人等 需求文档 原型ui文档 开发计划表 项 ...
随机推荐
- K8S 性能优化 - K8S APIServer 调优
前言 K8S 性能优化系列文章,本文为第二篇:Kubernetes API Server 性能优化参数最佳实践. 系列文章: <K8S 性能优化 - OS sysctl 调优> 参数一览 ...
- 基于 Scriptable 从零开始美化iOS桌面(集合篇)
Scriptable 脚本合集 iOS桌面组件神器(Scriptable)原创脚本,精美作品收集.分享! 如果喜欢,欢迎点个 ️ Star ️ 给予小支持,感谢您的使用!喜欢这个项目?有好的脚本?请考 ...
- 树模型--ID3算法
基于信息增益(Information Gain)的ID3算法 ID3算法的核心是在数据集上应用信息增益准则来进行特征选择,以此递归的构建决策树,以信息熵和信息增益为衡量标准,从而实现对数据的归纳分类. ...
- Docker 内安装 SSH 服务
有时候我们想把 Docker 环境提供给别人,但是又不想提供宿主机,那么可以在 Docker 容器内运行 SSH 服务,使容器保持运行并提供给对方使用即可,下面我们以 CentOS 7.6 的 Doc ...
- 力扣603(MySQL)-连续空余座位(简单)
题目: 几个朋友来到电影院的售票处,准备预约连续空余座位. 你能利用表 cinema ,帮他们写一个查询语句,获取所有空余座位,并将它们按照 seat_id 排序后返回吗? 对于如上样例,你的查询语句 ...
- EasyNLP集成K-BERT算法,借助知识图谱实现更优Finetune
导读 知识图谱(Knowledge Graph)的概念⾸次出现2012年,由Google提出,它作为⼀种⼤规模语义⽹络, 准确地描述了实体以及实体之间的关系.知识图谱最早应⽤于搜索引擎,⽤于准备返回⽤ ...
- 客户端单元测试实践——C++篇
简介: 我们团队在手淘中主要负责BehaviX模块,代码主要是一些逻辑功能,很少涉及到UI,为了减少双端不一致问题.提高性能,我们采用了将核心代码C++化的策略.由于团队项目偏底层,测试同学难以完全覆 ...
- CDP 平台简介
简介: EDC 建立在 Cloudera Data Platform(CDP) 之上,该产品结合了 Cloudera Enterprise Data Hub 和 Hortonworks Data P ...
- [Cryptocurrency] okex 获取行情的三种方式, ticker、depth、kline
获取行情可以使用 ticker.depth.kline 这三种方式. ticker 得到的是最新一条的成交价行情数据记录. depth 得到的是指定条数的包含 成交价格 和 成交数量 的记录. kli ...
- 在 Visual Studio 中规范化文件编辑
1 配置文件存放 生成了对应的 .editorconfig 文件,存放在仓储的根目录.即对整个仓储所有的用 VS 作为 IDE 编辑的项目生效. 同时支持子目录有自己的 .editorconfig 文 ...