一尘不染

Angular2和Spring Boot。如何服务前端?

spring-boot

我有Spring Boot后端和Angular2前端。我想分别开发它们并部署到Heroku

它们不应具有任何公共依赖性,并且应位于单独的git-repos中。

据我了解,主要有两种实现方式:

  1. 运行npm build并将dist文件resource夹复制到Spring应用程序的文件夹中,以便最后将其作为静态内容处理

  2. 运行专门为Angular应用服务的服务器,它将与Spring应用进行通信(CORS问题出现在这里?),因此总共有两台服务器

我认为第一种方法有点“肮脏”,因为我认为将文件夹从一个项目复制到另一个项目并不好。

而第二种方式是矫枉过正,因为我有两个服务器(TomcatNode.js,例如)。为什么我要与服务器Angular应用程序,如果我可以简单地把Angular里面Spring

还有其他更合理的方法可以做上述事情吗?

谢谢。


阅读 272

收藏
2020-05-30

共1个答案

一尘不染

在我的组织中,我们有很多Spring Boot和Angular应用程序。当不需要两个服务器时,Spring Boot可以从任何受支持的URL(例如“
http:”或“ file:”)提供静态内容。只需在启动时将此参数传递给您的应用即可:

--spring.resources.static-locations=<url>

通过包含以下Web MVC配置,Spring Boot还可以支持Angular单页应用程序路由。这样可以确保即使用户刷新浏览器中的页面,Spring
Boot仍将为其他角度路由提供index.html的内容。

public class SinglePageAppWebMvcConfigurer extends WebMvcConfigurerAdapter
{
    @Autowired
    private ResourceProperties resourceProperties;

    private String apiPath = "/api";

    public SinglePageAppWebMvcConfigurer()
    {
    }

    public SinglePageAppWebMvcConfigurer(String apiPath)
    {
        this.apiPath = apiPath;
    }

    protected String getApiPath()
    {
        return apiPath;
    }

    @Override
    public void addResourceHandlers(ResourceHandlerRegistry registry)
    {
        registry.addResourceHandler("/**")
            .addResourceLocations(resourceProperties.getStaticLocations())
            .setCachePeriod(resourceProperties.getCachePeriod()).resourceChain(true)
            .addResolver(new SinglePageAppResourceResolver());
    }

    private class SinglePageAppResourceResolver extends PathResourceResolver
    {
        @Override
        protected Resource getResource(String resourcePath, Resource location) throws IOException
        {
            Resource resource = location.createRelative(resourcePath);
            if (resource.exists() && resource.isReadable()) {
                return resource;
            } else if (getApiPath() != null && ("/" + resourcePath).startsWith(getApiPath())) {
                return null;
            } else {
                LoggerFactory.getLogger(getClass()).info("Routing /" + resourcePath + " to /index.html");
                resource = location.createRelative("index.html");
                if (resource.exists() && resource.isReadable()) {
                    return resource;
                } else {
                    return null;
                }
            }
        }
    }
}
2020-05-30