如何覆盖 Backbone.sync 以便在最后添加 apikey 和用户名? [英] How to override Backbone.sync so it adds the apikey and username at the end?

问题描述

我正在使用主干美味，但我最难的是让它正常工作.在 Tastypie 中，我将 ApiKeyAuthentication 用于我的资源，因此每个 ajax 请求，我都需要将 apikey 和用户名附加到请求的末尾，或者发送添加用户名和 api 密钥的其他标头.

I am using backbone-tastypie, but I am having the toughest time getting it to work properly. In Tastypie, I am using ApiKeyAuthentication for my resources, so every ajax request, I need to append the apikey and username to the end of a request or send additional headers that add on the username and api key.

我正在尝试使用具有以下代码的主干删除视图及其模型:

I am trying to remove a view and its model using backbone with the following code:

// 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 请求:

After the function executes, the browser tries to do a GET request on the following URL:

:8000/api/v1/update/2/

末尾不包含 api_key 或用户名，并且在 url 末尾有一个斜杠.我认为它正在尝试使用 Backbone.oldSync 来执行 GET 请求.我如何才能使同步在末尾包含用户名/api 密钥并删除尾部斜杠?

It does not include the api_key or username at the end, and it has a trailing slash at the end of the url. I think it is trying to use Backbone.oldSync to do the GET request. How would I make it so the sync does include the username/api key at the end and removes the trailing slash?

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

In all of the other requests, I have made it so the api key and username is appended to the end of the http request by adding the following code to backbone-tastypie:

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,
    });
}

推荐答案

让我们探索可能性

使用标题

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

Backbone.sync still just uses jQuery ajax so you can override ajaxSend and use headers to send information along.

$(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参数添加到这些方法中:

If you need to send the information in just one or two locations, remember that the destroy, fetch, update and save methods are just shortcuts to the ajax caller. So you can add all jQuery ajax parameters to these methods as such:

// 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 方法

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

Depending on your needs, this might be the better implementation (note that this is no production code, you may need to modify this to fit your needs and test this before using it)

(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);

这篇关于如何覆盖 Backbone.sync 以便在最后添加 apikey 和用户名?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！