部署依赖于其余API的单页面应用程序有哪些技巧?

时间:2013-08-23 20:13:14

标签: java rest angularjs xss single-page-application

我正在构建一个单页面应用程序(使用AngularJS),该应用程序从REST API调用渲染数据到遗留系统。这个遗留系统非常庞大,用Java编写并且需要几分钟才能部署,因此我们认为开发与遗留系统完全分离的单页应用程序会更高效。

一旦我们尝试与遗留系统的REST API进行通信,就会出现问题。虽然这两个应用程序都本地部署到同一主机,但它们部署在不同的应用服务器上,因此我需要在通信时使用不同的端口。但由于SPA正在与不同端口上的REST API进行通信,因此浏览器阻止了我的请求以防止Cross Site Scripting攻击。

我们发现这个构建工具名称lineman(利用grunt)可以轻松代理http请求。这让我们了解了跨站点脚本限制,但这只适用于开发模式。

现在我们已经有了一个概念验证工作,我们想知道如何在没有代理的情况下将这些应用程序部署在一起。我很难找到关于如何做到这一点的建议,因为Angular并不认为你首先有一个后端,并且大多数在前端使用Angular的人都没有在后端使用Java(如果这甚至很重要)

我们遇到的问题是,应用程序的上下文路径会根据它们是否以prod模式部署到开发模式而发生变化,因此我们必须考虑采用巧妙的方法来避免两种模式都存在损坏的链接。我想知道是否/我在这里采取了错误的步骤。我应该避免在与后端不同的服务器上开发SPA吗?

2 个答案:

答案 0 :(得分:1)

我们遇到了同样的问题。 URL情况是您将拥有到您的Java REST API的不同URL路径,因为您处于不同的环境中。

为了使这些路径级联到角度应用程序,我们必须先将Web应用程序(生成Angular的应用程序)中的基本路径外部化,以使用在部署期间设置的值,具体取决于部署到的位置。我们的应用服务器中有值链接到配置文件中的XML值,然后我们在应用程序中引用这些值。

然后我们创建一个从Angular应用程序到webapp的调用,它生成它(不是java REST API),它将返回对环境正确的URL。

在角度应用程序中,我们可以使用正确的基本路径设置resuorce(URL的其余部分应该从环境到环境保持不变)。

如果您可以通过外部化环境设置使第一部分正常工作,其余部分并不困难。

答案 1 :(得分:1)

我会将apache放在前面并使用mod_proxy作为应用程序的反向代理。

假设您的REST API位于http:// localhost:9000。如果angular应用程序只是静态资产,您可以直接在apache下部署它。如果不是,你也可以反向代理它。 对于REST api yoivsetup,对于localhost:9000说/ api的反向代理。因此,任何命中http://some.host.name/api的apache的请求现在都将转发到遗留系统。现在修复角度应用程序,你就完成了。 对于本地开发,您可以使用node-http-proxy,这很容易以类似的方式设置