Vue+SpringBoot怎么部署到tomcat服务器
环境: Vue-cli项目、SpringBoot、windows版tomcat8.5 首先这是一个前后端分离的项目。 前端项目已经部署到tomcat的ROOT目录下，后端项目也以ROOT命名。 tomcat可以正常启动 前端页面可以访问到
但是问题来了？
前端无法请求到后台的数据 
怎样部署Vue+SpringBoot的前后端分离项目到tomcat上，目录结构和相关配置是什么？ 遇到了同样的问题，在CSDN看到了，希望阿里云团队能够给出正确、标准的答案~请查看
版权声明：本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。
在部署Vue和Spring Boot的前后端分离项目到Tomcat上时，需要确保前端应用能够正确访问后端API，并且两者都应适配于Tomcat环境。以下是一种推荐的部署方式及配置步骤：
1. 前端Vue项目的打包与部署
打包
- 在Vue项目中，使用
npm run build或yarn build命令来生成生产环境的静态文件。 - 这会创建一个名为
dist的目录，里面包含了所有编译后的静态资源。
部署
- 将Vue项目的
dist目录下的所有内容复制到Tomcat的webapps/ROOT目录下。这样，Vue应用将成为Tomcat的默认Web应用。
2. Spring Boot项目的部署
由于Tomcat是Java Web容器，直接部署Spring Boot应用到Tomcat并不符合Spring Boot内嵌容器的设计理念。但如果你坚持要这样做，可以采取以下步骤：
修改Spring Boot项目
- 去除内嵌容器：在
pom.xml中排除Spring Boot的内嵌Tomcat依赖（如果有的话），并添加War打包插件。
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
<!-- 移除内嵌Tomcat -->
<exclusions>
<exclusion>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-tomcat</artifactId>
</exclusion>
</exclusions>
</dependency>
<packaging>war</packaging>
<build>
<plugins>
<plugin>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-maven-plugin</artifactId>
</plugin>
<!-- 添加War插件 -->
<plugin>
<groupId>org.apache.maven.plugins</groupId>
<artifactId>maven-war-plugin</artifactId>
<version>3.3.2</version>
</plugin>
</plugins>
</build>
打包
- 使用
mvn clean package命令构建项目，这将生成一个.war文件。
部署到Tomcat
- 将生成的
.war文件重命名为ROOT.war，然后放置到Tomcat的webapps目录下。 - Tomcat会自动解压该War文件，并将其作为默认应用部署。
注意事项
- 跨域问题：由于前后端分离，前端请求后端API可能会遇到跨域问题，需要在Spring Boot后端配置CORS支持。
- API路径调整：确保Vue应用中的API请求URL指向正确的后端服务地址。如果是同一域名下，可能需要调整为相对路径或者使用反向代理。
- 端口冲突：确认前端Vue应用和后端Spring Boot应用没有端口冲突，尤其是在开发环境下。
结论
虽然上述方法可行，但通常建议直接使用Spring Boot的内嵌容器进行部署，或者采用更现代的部署方案，如Docker容器化部署，这能更好地利用Spring Boot的特性，简化部署流程并提高灵活性。对于生产环境，考虑使用Nginx等反向代理服务器来处理静态资源和API路由，以实现更高效、安全的部署架构。
