微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

Angular2和Spring Boot如何服务前端?

如何解决Angular2和Spring Boot如何服务前端?

在我的组织中,我们有很多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;
                }
            }
        }
    }
}

解决方法

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

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

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

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

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

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

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

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

谢谢。

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 [email protected] 举报,一经查实,本站将立刻删除。