Javascript 如何保存Backbone.js模型数据？

我更喜欢前端开发，最近开始在我的应用程序中探索Backbone.js。我想将模型数据持久化到服务器

请您解释一下保存模型数据的各种方法（使用json格式）。我在服务器端使用Java。我还主要看到REST被用来保存数据。因为我更喜欢前端开发，所以我不知道REST和其他类似的东西

---

如果有人能用一些简单的例子向我解释这个过程，那就太好了。

基本上，模型有一个叫做属性的属性，它是某个模型可能具有的各种值。主干网使用JSON对象作为一种简单的方法，使用各种接受JSON对象的方法填充这些值。例如：

Donuts = Backbone.Model.extend({
    defaults: {
        flavor: 'Boston Cream',  // Some string
        price: '0.50'  // Dollars
    }
});

要填充模型，有几种方法。例如，您可以通过传入JSON或使用名为set（）的方法来设置模型实例，该方法接受属性的JSON对象

myDonut = new Donut({'flavor':'lemon', 'price':'0.75'});
mySecondHelping = new Donut();
mySecondHelping.set({'flavor':'plain', 'price':'0.25'});

console.log(myDonut.toJSON());
// {'flavor':'lemon', 'price':'0.75'}
console.log(mySecondHelping.toJSON());
// {'flavor':'plain', 'price':'0.25'}

因此，这就引出了保存模型并将其持久化到服务器的问题。关于“什么是休息/休息？”有一大堆的细节，在这里很难用一个简短的导语来解释所有这些。特别是在REST和主干存储方面，需要考虑的是HTTP请求的语义以及您对数据所做的操作

您可能已经习惯了两种HTTP请求。获取并发布。在RESTful环境中，这些动词对于主干假设的特定用途具有特殊含义。当您希望从服务器获取某个资源（例如，我上次保存的甜甜圈型号、博客条目、计算机规范）并且该资源存在时，您可以执行get请求。相反，当您想要创建新资源时，您可以使用POST

在进入主干网之前，我甚至从未接触过以下两种HTTP请求方法。放入并删除。这两个动词对主干也有特定的意义。当您想要更新资源时（例如，将柠檬甜甜圈的味道更改为柠檬甜甜圈等），您可以使用PUT请求。当您希望同时从服务器中删除该模型时，可以使用删除请求

这些基础知识非常重要，因为对于RESTful应用程序，您可能会有一个URI指定，它将根据您使用的请求动词类型执行相应的任务。例如：

// The URI pattern
http://localhost:8888/donut/:id

// My URI call
http://localhost:8888/donut/17

如果我访问该URI，它将得到ID为17的甜甜圈模型。id取决于如何在服务器端保存。这可能只是数据库表中甜甜圈资源的ID

如果我用新数据对URI进行PUT，我将更新它，并在上面保存。如果我删除这个URI，它就会从我的系统中清除它

对于POST，由于您尚未创建资源，因此它将没有已建立的资源ID。可能我想要创建资源的URI目标如下：

http://localhost:8888/donut

URI中没有ID片段。所有这些URI设计都取决于您以及您对资源的看法。但是关于RESTful设计，我的理解是，您希望将HTTP请求的动作动词和资源保持为名词，从而使URI易于阅读和人性化

你还和我在一起吗？：-）

所以，让我们回到思考主干。脊梁骨很好，因为它为你做了很多工作。为了节省我们的甜甜圈和第二份帮助，我们只需执行以下操作：

myDonut.save();
mySecondHelping.save();

主干是智能的。如果您刚刚创建了一个甜甜圈资源，它将没有来自服务器的ID。它有一个叫做cID的东西，这是主干网内部使用的东西，但由于它没有正式ID，它知道它应该创建一个新资源，并发送一个POST请求。如果您从服务器获取模型，如果一切正常，它可能会有一个ID。在这种情况下，当您保存（）时，主干假定您要更新服务器，它将发送PUT。要获取特定的资源，可以使用主干方法.fetch（）并发送get请求。在模型上调用.destroy（）时，它将发送删除消息

在前面的示例中，我从未明确告诉主干网URI的位置。让我们在下一个例子中这样做

thirdHelping = Backbone.Model.extend({
    url: 'donut'
});
thirdHelping.set({id:15});  // Set the id attribute of model to 15
thirdHelping.fetch();  // Backbone assumes this model exists on server as ID 15

主干将在

http://localhost:8888/donut/15

只需将/donut-stem添加到站点根目录中即可

如果你还和我在一起，很好。我想。除非你感到困惑。但不管怎样，我们还是要继续跋涉。第二部分是服务器端。我们已经讨论了HTTP的不同动词以及这些动词背后的语义。您、主干网和服务器必须共享的含义

服务器需要了解GET、POST、PUT和DELETE请求之间的区别。正如您在上面的示例中所看到的，GET、PUT和DELETE都可以指向相同的URI

http://localhost:8888/donut/07

除非您的服务器能够区分这些HTTP请求，否则它将非常困惑如何处理这些资源

这是您开始考虑RESTful服务器端代码的时候。有些人喜欢Ruby，有些人喜欢.net，我喜欢PHP。我特别喜欢SLIM PHP微框架。slimphp是一个微框架，它有一个非常优雅和简单的工具集来处理RESTful活动。您可以像上面的示例一样定义路由（URI），这取决于调用是GET、POST、PUT还是DELETE，它将执行正确的代码。还有其他类似于修身的方法，比如休息、补品。我相信像Cake和CodeIgniter这样更大的框架也会做类似的事情，尽管我喜欢minimal。我说过我喜欢苗条吗？；-）

这就是服务器上的摘录代码可能的外观（即，特别是关于路由的。）

这里需要注意的是，主干需要一个JSON对象。始终让服务器将内容类型指定为“application/json”，并尽可能将其编码为json格式。然后，当主干接收到JSON对象时，它知道如何填充请求它的模型

使用slimphp，路由可以运行

$app->get('/donut/:id', function($id) use ($app) {
    // get donut model with id of $id from database.
    $donut = ...

    // Looks something like this maybe:
    // $donut = array('id'=>7, 'flavor'=>'chocolate', 'price'=>'1.00')

    $response = $app->response();
    $response['Content-Type'] = 'application/json';
    $response->body(json_encode($donut));
});

$app->post('/donut', function() use ($app) {
    // Code to create new donut
    // Returns a full donut resource with ID
});
$app->put('/donut/:id', function($id) use ($app) {
    // Code to update donut with id, $id
    $response = $app->response();
    $response->status(200);  // OK!
    // But you can send back other status like 400 which can trigger an error callback.
});
$app->delete('/donut/:id', function($id) use ($app) {
    // Code to delete donut with id, $id
    // Bye bye resource
});

Cake = Backbone.Model.extend({
    defaults: {
        type: 'plain',
        nuts: false
    },
    url: 'cake'
});

myCake = new Cake();
myCake.toJSON()  // Shows us that it is a plain cake without nuts

myCake.save({type:'coconut', nuts:true}, {
    wait:true,
    success:function(model, response) {
        console.log('Successfully saved!');
    },
    error: function(model, error) {
        console.log(model.toJSON());
        console.log('error.responseText');
    }
});

// ASSUME my server is set up to respond with a status(403)
// ASSUME my server responds with string payload saying 'we don't like nuts'