RESTful php Web服务和BackboneJS

Question

有一个基于php的RESTful Web服务。 当前，它仅服务于移动应用程序。 我需要使用相同的API来构建Web应用程序。 我认为它将是基于BackboneJS的单页应用程序。 后端由Zend Framework 2驱动。

我以前曾与BackboneJS一起工作，但是我是创建SPA的完整入门者。 与我有关的第一件事是，当请求一个新的“页面”时，如何通过单个请求将所有模型和集合同步到Web服务。 例如，我的应用程序中的第一页将是登录页面。 很明显，此时所有必需的数据都将随页面一起加载。 但是，一旦用户登录，我就需要将他“重定向”到仪表板，该仪表板是一个完全不同的页面，具有不同的布局和内容。 我想到的一个解决方案是使用引导页面所需的API URL列表向Web服务提出特殊请求。 该服务将解析请求并为每个api内部调用所需的控制器并准备响应。 我不确定该如何处理模板。 用单个请求提取所有必需模板的最佳方法是什么？

我将感谢您对此主题的任何帮助和建议。

Answer 1

我发现使用骨干路由器来设置通过url splat传递的页面路由，如下所示：

routes: {
    '*page' : 'page'
}

page: function (page) {
    customEvent.trigger('router:changed:page', page);
}

这样，您就可以触发一个事件来说明页面已更改，并将其钩住其他视图以进行渲染和初始化。 然后，您可以创建一个页面模块来初始化正确的视图，如下所示：

define(['backbone'], function (Backbone) {
    var PageModule = Backbone.View.extend({
        el: $('#main'), // main container

        initialize: function () {
            this.listenTo(customEvent, 'router:changed:page', this.render);
        },

        render: function (page) {
            this.$el.empty(); // empty the view each time

            switch(page) {
                case 'dashboard':
                    // load dashboard view
                    break;
                case 'other':
                    // load other view
                    break;
            }

            return this;
        }
    });
});

然后，每个视图将加载它可能需要的所有模板以及子视图。

define(['backbone', 'insertTemplate', 'collection'], function (Backbone, InsertTemplate, Collection) {

      var DashboardView = Backbone.View.extend({
          // do your view magic in here but as you can see you have access to a template and collection but you could add as many items as required.
      });

      return DashboardView;
});

页面模块成为一种工厂方法。

我建议您看一下Marionette或Layout Manager之类的框架，因为它可以为您提供很多帮助。

这是一个粗略的例子，有望使您思考。 还有其他几种方法，但这只是一个开始。