1

我试图在其后端使用 Django 创建一个主干应用程序。我正在关注一个主干教程。我使用了以下代码:

代码

<!doctype html>
<html lang = "en">
    <meta charset = "utf-8">
    <title>IstreetApp</title>
    <link rel="stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/2.3.1/css/bootstrap.min.css">
</head>
<body>
    <div class="container">
        <h1>Book Manager</h1>
        <hr />
        <div class="page"></div>
    </div>

    <script type = "text/template" id = "booklist.template">

    </script>

    <script src = "https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
    <script src = "https://cdnjs.cloudflare.com/ajax/libs/underscore.js/1.4.4/underscore-min.js"></script>
    <script src = "https://cdnjs.cloudflare.com/ajax/libs/backbone.js/0.9.10/backbone-min.js"></script>
    <script>

        $.ajaxPrefilter( function( options, originalOptions, jqXHR ) {
            options.url = 'http://backbonejs-beginner.herokuapp.com' + options.url;
        });

        var Books = Backbone.Collection.extend({
            url: '/books'
        });

        var BookList = Backbone.View.extend({
            el: '.page',
            render: function () {
                var that = this;
                var books = new Books();
                books.fetch({
                    success: function(books) {
                        var template = _.template($('#booklist.template').html(), {books: books.models});
                        that.$el.html(template);
                    }
                })
            }
        });

        var Router = Backbone.Router.extend({
            routes: {
                '': 'home'
            }
        })

        var bookList = new BookList();

        var router = new Router();
        router.on('route:home', function () {
            bookList.render();
        });

        Backbone.history.start();
    </script>

</body>
</html>

由于未定义集合,因此不会执行成功代码。我想收集数据应该通过 Django 来自服务器,但我不确定如何以及以什么形式。请帮忙。我对骨干网和 Django 非常陌生。

4

2 回答 2

2

当您对集合调用 fetch 时,它会发出 AJAX 请求以:

 http://backbonejs-beginner.herokuapp.com/books

但是,那里没有设置 API。需要发生以下两件事之一:

1)您需要修改代码以指向不同的 URL,该 URL 确实具有现有的 API(也许您使用的任何教程都有这样的 API)

2)您需要自己在 yoursever.com 上创建这样的 API(然后让您的 Backbone 代码指向该 API 的 URL)

如果没有服务器支持,Backbone 中的诸如此类的操作save根本fetch无法运行。

附带说明一下,Django 是一个网站框架。虽然您可以使用它来创建服务器端API,但这并不是 Django 真正关注的重点。正因为如此,有几个优秀的第三方库可用于在 Django 中执行 RESTful API(即 Backbone 喜欢的那种);我个人推荐 Django REST Framework(我使用它并且效果很好)或 TastyPie(从未使用过,但它非常受欢迎)。

于 2013-03-16T19:15:25.600 回答
0

使用骨干集合时,您需要从您的 api url ( http://backbonejs-beginner.herokuapp.com/books ) 示例中返回一个 json 对象数组

{[{"name":"bookname", "publisher": "penguin"}, {"name":"bookname", "publisher":"penguin"}]}

您还需要一个模型用于您的收藏。一个模型看起来像这个例子:

var Book = Backbone.Model.extend({
defaults: {
"name":  "",
"publisher": ""
}
});

集合的工作方式是解析 json 数组并将数组中的每个对象转换为您指定的模型(此时是一本书,其中包含名称和出版商的值)。

当您在模型上创建 .fetch() 时,您正在发出 GET 请求,因此请确保您的http://backbonejs-beginner.herokuapp.com/books网址已准备好接收 GET 请求并使用 json 数据进行响应我在顶部指定的格式。

于 2015-07-13T17:09:27.243 回答