Ajax队列骨干js答案

【问题标题】：Ajax queue Backbone jsAjax队列骨干js
【发布时间】：2012-04-03 19:53:20
【问题描述】：

我在 Rails 3.2.2 上运行 Backbone js 0.9.2，我有一个添加成本行的页面。成本有 3 个文本字段：标题、描述和价格。

我正在节省模糊的每一项成本。

model.save() 以非常短的间隔被多次调用。紧接着发出一个create(post) 请求，然后发出一个update(put) 请求。我遇到的问题是 PUT 请求有时会在 POST 之前到达服务器，结果是该模型被创建并持久化了两次（重复）。

节省模糊是请求的行为，所以我需要一种方法来排队请求。我读过一些关于 Spine js 的东西，他们通过某种队列来解决它。我也看过this，但似乎无法弄清楚。

感觉这应该是一个常见问题，使用“单页应用程序”但找不到任何相关信息。

【问题讨论】：

标签： ruby-on-rails ajax backbone.js ruby-on-rails-3.2

【解决方案1】：

您可以覆盖 save 方法并使用 deferred object 创建一个队列。例如，

var MDef = Backbone.Model.extend({
    url: "/echo/json/?delay=3",

    initialize: function() {
        this.queue = $.Deferred();
        this.queue.resolve();
    },

    save: function(attrs,options) {
        var m = this; 
        console.log("set "+JSON.stringify(attrs));

        // this.queue = this.queue.pipe with jquery<1.8
        this.queue = this.queue.then(function() {
            console.log("request "+JSON.stringify(attrs));
            return Backbone.Model.prototype.save.call(m, attrs, options);
        });            
    }
});

var m = new MDef();
m.save({title: "a title"});
m.save({description: "a description"});
m.save({price: "a price"});

还有一个小提琴：http://jsfiddle.net/nikoshr/8nEUm/

【讨论】：

【解决方案2】：

来自underscore.js的用户debounce。

创建并返回传递函数的一个新的去抖动版本，该版本将推迟其执行，直到自上次调用以来等待毫秒过去后。

这样它只会在最后一个blur 事件之后触发一次。

【讨论】：

这不是万无一失的解决方案，它可以解决大多数情况，但仍有可能丢失数据。
@TimBrunsmo, @abraham debounce 是对的。数据将如何丢失？如果您想强制定期保存，可以将其替换为 _.throttle。
@ggozad 如果某个字段被聚焦并且用户选择离开页面，例如单击“下一步”按钮，则模糊事件有可能永远不会发出请求。如果有队列，你可以检查队列是否完成，然后让用户通过。
@TimBrunsmo throttle 和 debounce 都会有你想要的效果。他们实际上确实将函数排队以供以后执行。
@TimBrunsmo 除非你是一家金融机构，否则你真的不需要更多多余的东西。一两秒的去抖动几乎不会在执行前关闭。