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之類的框架，因為它可以為您提供很多幫助。

這是一個粗略的例子，有望使您思考。 還有其他幾種方法，但這只是一個開始。