2013-04-15 26 views
4

我正在开发一个网站,可以分解为几个主页。除了共享会话数据(即会话ID和登录用户名)外,这些页面可以被认为是相互隔离的。在一个站点上有多个AngularJS应用程序?

最初,我将使用ng-view(即将页面转换为AngularJS视图)将该网站构建为SPA。但是,我认为我的网站没有以这种方式实施的好处。这将需要额外的时间和精力来支持SEO(Making AJAX Applications Crawlable)。

采用一种不提供任何好处,甚至创造额外工作量的方法似乎并不太聪明。所以我想,为什么我不把我网站的主要页面制作成单独的AngularJS应用程序。该网站需要被搜索引擎索引的部分仅仅是这些应用程序中的一些初始屏幕,所以我不需要为SEO做额外的工作。 (注意:Django服务器使用搜索引擎抓取的数据来呈现初始屏幕,因此它们非空白。)

对于每个应用程序,它可能有也可能没有它自己的一组部分,取决于它的要求。

例子:

mydomain.com/item_page/1234 (load "item" app) 
mydomain.com/dashboard (load "dashboard" app) 
mydomain.com/account (load "account" app and default to "tab_1" view) 
mydomain.com/account#tab_1 (load "tab_1" view of "account" app) 
mydomain.com/account#tab_2 (load "tab_2" view of "account" app) 
mydomain.com/post_item (load "post" app) 

这完全是我的胡思乱想,我还没有看到,是由多个AngularJS应用程序的任何AngularJS例子。我想知道:

  1. 一个网站方法的多AngularJS应用程序是否可行?我应该注意哪些警告?这种方法在野外有没有任何示例网站?
  2. 如果可行,我如何在应用程序之间共享会话数据?

注意这篇文章是关于一个网站的多个AngularJS应用程序,而不是同一页面上的多个AngularJS应用程序。

回答

3

只要您保持下载的JS脚本的大小足够小,并确保良好的缓存,这种方法没有任何问题。这样的应用程序的例子之一可以是GitHub(他们不使用角度,但方法是相同的)。当你进入GitHub上的Issues页面时,它会加载一个html页面,常见的Github JS库和页面特定的JS代码。页面内的导航和操作由该单个页面特定的脚本处理。如果您转到其他部分(如代码),则会加载一个新页面,其中包含新页面特定的JS代码。另一个例子是Amazon AWS控制台,他们甚至为不同的页面使用不同的框架。 (GitHub和Amazon都不使用Angular,但这种方法适用于任何基于JS的框架,即使对于GWT也是如此)。

至于在页面之间共享某些会话数据,您可以使用内联脚本或隐藏元素直接在页面中嵌入此信息。例如。当你的服务器正在生成页面时,它也应该在页面中生成一些会话信息。另一种方法是下载会话数据一次,并将它们存储在本地存储/会话存储中。

相关问题