Backbone：從服務器獲取JSON文件，使用擴展名「.json」或不使用它，使用url或urlRoot

Question

我正在做一些練習來熟悉Backbone。我正在嘗試使用Model的urlRoot屬性從我的服務器獲取JSON文件。

我得到錯誤（404）是說，它無法找到該文件，當我鍵入urlRoot: "./js/json/todo"但如果我鍵入它這樣urlRoot: "./js/json/todo.json"然後找到它，但console.log(todoItem.get('description'))說undefined。

現在，在我見過的許多Backbone應用程序中，大多數時候擴展.json未被應用，即，這可以使用urlRool: "/todos"而不是urlRoot: "/todos.json"。但是當我沒有擴展名的時候，我會遇到錯誤。

• 有人可以向我解釋如何正確使用url和urlRoot屬性？
• 此外，不使用.json或使用它的問題是什麼？
• 最後，我的JSON文件格式如下，適合Backbone？

骨幹：

(function(window, $, Backbone) { 
    var TodoItem = Backbone.Model.extend({ urlRoot: './js/json/todos' }); 

    var todoItem = new TodoItem({id: 1}); 

    todoItem.fetch(); 

    console.log(todoItem.get('description')); // This is undefined in the console 

}(window, jQuery, Backbone)); 

JSON：

{ 
    "todos": [ 
    { 
     "description": "Pick Up Milk", 
     "status": "incomplete" 
    }, 

    { 
     "description": "Do shopping at Market", 
     "status": "incomplete" 
    }] 
} 

Answer 1

你看它不.json因爲後端有人使用從URL返回的JSON沒有.json。當我有一個靜態JSON文件時，我只需將.json添加到它。

這是關於服務器設置或任何你有處理網址。

而就你的格式而言，你不需要包裝{}。它可以只是：

$.ajax("./js/json/todo.json").done(function(data) { 
    // I'm only using extend to add in the id. You could just use data[0] 
    var todoItem = new ToDoItem(_.extend(data[0], { id: 1 })); 
} 

取是不是真的要工作，因爲你的JSON文件是一個集合：

[{ 
    "description": "Pick Up Milk", 
    "status": "incomplete" 
}, 

{ 
    "description": "Do shopping at Market", 
    "status": "incomplete" 
}] 

因此，使用靜態JSON文件時，我得到的是一個更小手工。您可以創建：

var ToDoCollection = Backbone.Collection.extend({ 
    model: ToDoItem, 
    url: "./js/json/todo.json" 
}); 
var toDos = new ToDoCollection(); 
toDos.fetch(); 

而且應該爲您提供JSON文件中每個條目的模型集合。

Answer 2

只要端點存在，是否使用.json並不重要。所以，如果你命名你的文件todo.json你必須有.json。測試這種方法的一種方法是，您應該能夠將文件的URL剪切並粘貼到瀏覽器中並使其正確顯示。

由於JSON文件的格式，我相信你會得到undefined。對象頂層不存在description。主幹需要一個Models的數組，而不是包含Models數組的對象。例如：

[{ 
    "description": "Pick Up Milk", 
    "status": "incomplete" 
}, 
{ 
    "description": "Do shopping at Market", 
    "status": "incomplete" 
}] 

url適用於數據採集，urlRoot適用於個別型號。這可以讓你做的是創建一個語義命名模式。通過設置url到/todos和urlRoot到/todo

GET /todos - Get all todos 
GET /todo/:id - Get one todo 

我可以這樣做：例如，訪問的API我可以使用下面的架構。骨幹會自動追加ID。記住urlRoot是可選的，只要url被定義。