将AngularJS与JSP页面集成

Question

目前我们正在将应用程序从JSP迁移到AngularJS。组织决定逐个模块完成迁移。我们遇到的挑战之一是如何从JSP传递用户数据到AngularJS（例如index.html）。

我们希望如果调用了AngularJS模块，系统会重新路由到由AngularJS管理的index.html。

我的问题是，我们可以采取哪些可能的方式将用户数据（例如用户名）从JSP传输到index.html。

可能的场景：

1. 用户登录系统
2. 用户进入Angular管理模块
3. 系统将用户重定向到index.html（AngularJS）
4. index.html将具有用户凭据（例如用户名和密码）
5. AngularJS将在index.html中管理用户的操作，并使用用户凭据请求RESTful服务。

TIA

- epsac

---

你有机会检查我的答案了吗？ - kachhalimbu

Answer 1

理想情况下，我不建议将username和password注入到index.html中供angularjs控制器/服务使用。如果用户在加载angular管理页面时已经通过身份验证，则可以注入授权令牌或设置一个cookie，浏览器会自动发送它（假设jsp应用程序和angular应用程序在同一域上）。

现在谈论注入数据供angularjs使用，我可以想到两种方法（我推荐第二种方法，因为它不会污染全局范围）。

1. Inject it as a global and access via $window. For eg. have your server side .jsp render a script tag with a global var like

   <script type="type/javascript">
      var pass = 'whatevervalue';
   </script>
   

在你的控制器中使用$window访问它。

    angular.module('yourapp').controller('YourCtrl', $window){
        console.log($window.pass);
    }

2. 您可以使用 angular-preloaded 将变量注入到 type="text/preloaded" 的脚本标签中，然后通过 $preloaded 服务使其在控制器中可用。

让您的 jsp 输出类似于以下内容

<script type="text/preloaded">
{
  "data": "point"
}
</script>

并在您的控制器中像下面这样获取它

angular.module('app', ['gs.preloaded'])
.controller('SomeCtrl', function ($preloaded) {
    // do something with $preloaded.
    $preloaded; // => { data: "point", another: { point: "of data" } }
});

记得在控制器脚本之前放置预加载脚本，这样才能正常工作。来自文档。

注意：您的脚本标签必须在任何使用$preloaded的内容之前运行，因此建议将它们放在文档的头部。

- kachhalimbu