如何覆盖Backbone.sync,以便在最后添加apikey和用户名？

Question

我正在使用骨干 - tastypie,但我正在努力让它正常工作.在Tastypie中,我使用ApiKeyAuthentication作为我的资源,因此每个ajax请求,我需要将apikey和用户名附加到请求的末尾,或者发送添加用户名和api密钥的其他标头.

我试图使用骨干删除视图及其模型,代码如下:

// Remove the goal update view from the DOM
removeItem: function() {
  this.model.destroy({wait: true, success: function() {
    console.log("success");
  }, error: function() {
    console.log("error");
  }});
},

函数执行后,浏览器尝试对以下URL执行GET请求:

:8000/api/v1/update/2/

它最后不包括api_key或用户名,并且在URL的末尾有一个尾部斜杠.我认为它正在尝试使用Backbone.oldSync来执行GET请求.我如何制作它以便同步在最后包含用户名/ api键并删除尾部斜杠？

在所有其他请求中,我已经通过将以下代码添加到backbone-tastypie来将api密钥和用户名附加到http请求的末尾:

if ( !resp && ( xhr.status === 201 || xhr.status === 202 || xhr.status === 204 ) ) { // 201 CREATED, 202 ACCEPTED or 204 NO CONTENT; response null or empty.
  var location = xhr.getResponseHeader( 'Location' ) || model.id;
  return $.ajax( {
       url: location + "?" + "username=" + window.app.settings.credentials.username + "&api_key=" + window.app.settings.credentials.api_key,
       success: dfd.resolve,
       error: dfd.reject,
    });
}

Answer 1

让我们探索一下可能性

使用标题

Backbone.sync仍然只使用jQuery ajax,因此您可以覆盖ajaxSend并使用标头来发送信息.

$(document).ajaxSend(function(e, xhr, options) 
{
    xhr.setRequestHeader("username", window.app.settings.credentials.username);
    xhr.setRequestHeader("api_key", window.app.settings.credentials.api_key);
});

使用Ajax选项

如果您需要发送的只是一个或两个位置的信息,记住destroy,fetch,update和save方法只是快捷方式AJAX调用者.所以你可以将所有jQuery ajax参数添加到这些方法中:

// Remove the goal update view from the DOM
removeItem: function ()
{
    this.model.destroy({
        wait: true,
        success: function () 
        {
            console.log("success");
        },
        error: function ()
        {
            console.log("error");
        },
        data: 
        {
            username: window.app.settings.credentials.username,
            api_key: window.app.settings.credentials.api_key
        }
    });
}

覆盖jQuery的ajax方法

根据您的需要,这可能是更好的实现(请注意,这不是生产代码,您可能需要修改它以满足您的需求并在使用之前对其进行测试)

(function ($) {
    var _ajax = $.ajax;
    $.extend(
    {
        ajax: function (options)
        {
            var data = options.data || {}; 
            data = _.defaults(data, {
                username: window.app.settings.credentials.username,
                api_key: window.app.settings.credentials.api_key
            });
            options.data = data;
            return _ajax.call(this, options);
        }
    });
})(jQuery);