如何在同一个域/服务器上部署 AngularJS 应用程序和 Spring Restful API 服务?

问题描述

我是 Spring 和 AngularJS 的新手.我按照此处的步骤构建后端restful API，然后发送Json要求.因此，根据指南，当我运行mvn spring-boot:run"时，tomcat 服务器从 localhost:8080 开始.

I'm new to Spring and AngularJS. I followed the steps here to build the back end restful API, and it sends Json upon requests. So, according to the guide, When I run "mvn spring-boot:run" the tomcat server starts at localhost:8080.

然后我使用 Yeoman angular generator 来构建我的 angular 应用程序.当我在我的 angular 应用程序中运行grunt serve"时，前端应用程序运行在 localhost:9000.

Then I used Yeoman angular generator to build my angular app. And when I run "grunt serve" inside my angular app, the front end app runs at localhost:9000.

我应该怎么做才能让我的 Angular 应用程序与我的 Springboot tomcat 服务器一起在同一个域上提供服务，比如 localhost:8080 ?

What should I do so that my angular app can be served together with my Springboot tomcat server on the same domain, say, localhost:8080 ?

有我可以遵循的示例项目吗?我找到了以下项目，但仍然无法使其工作，因为我对 tomcat 没有太多背景.

Is there a sample project that I can follow? I found the following projects, but still cannot make it work as I don't have much background on tomcat.

1. https://github.com/robharrop/spring-angularjs
2. https://github.com/GermanoGiudici/angularjs-maven-tomcat-seed
3. https://github.com/xvitcoder/spring-mvc-angularjs

推荐答案

您需要:

• 构建的文件(grunt build 然后基本上是 dist/目录中的所有内容)
• 原始文件(您的 index.html 和所有 JS 原样)

• the built files (grunt build then basically everything in the dist/ directory)
• the raw files (your index.html and all JS as-is)

并将它们复制到以下文件夹之一(我推荐/public/):http://spring.io/blog/2013/12/19/serving-static-web-content-with-spring-boot

and copy them into one of the following folders (I recommend /public/): http://spring.io/blog/2013/12/19/serving-static-web-content-with-spring-boot

Spring Boot 将自动添加位于以下任一目录中的静态 Web 资源:

/META-INF/resources/

/META-INF/resources/

/资源/

/静态/

/公共/

这意味着 Spring Boot 不仅提供了一种构建 Java 或 Groovy 应用程序的简单方法，您还可以使用它轻松部署客户端 JavaScript 代码并在真实的 Web 服务器环境中对其进行测试！

This means that not only does Spring Boot offer a simple approach to building Java or Groovy apps, you can also use it to easily deploy client-side JavaScript code and test it within a real web server environment!

这对开发来说将是一件痛苦的事情，因为每次对前端进行更改时都必须重新复制文件.对于生产，您的目标应该是使用 spring 应用程序部署构建文件的版本化副本.

This is going to be a pain for development however since you will have to re-copy the files every time you make a change for the front end. For production your goal should be to deploy a versioned copy of the built files with your spring app.

对于开发，您可能需要考虑让 grunt 提供 Angular 内容并同时运行 Tomcat 和您的 grunt 服务器(它是节点吗?)并在前端和后端之间启用跨源请求.或者，您可以将整个 angular 目录复制到上述目录之一中，但这是一种短期方法.

For development you might want to consider letting grunt serve the Angular content and running both Tomcat and your grunt server (is it node?) and enabling cross origin requests between your front end and back end. OR you could just copy the whole angular directory into one of the above directories but that is a short term approach.

这篇关于如何在同一个域/服务器上部署 AngularJS 应用程序和 Spring Restful API 服务?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！