添加上骨干请求头(add request header on backbone)

我的服务器有一个手动授权。 我需要把我的服务器的用户名/密码到我的骨干请求序为它去。 请问有什么可以做呢？ 有任何想法吗？ 谢谢

Answer 1:

在骨干模型检索，更新和销毁使用方法的数据fetch ， save和destroy 。 这些方法委托实际请求部Backbone.sync。 引擎盖下，所有Backbone.sync正在做的是创建使用jQuery的Ajax请求。 为了将你的基本HTTP验证你有两个选择。

fetch ， save和destroy都接受一个额外的参数[options] 。 这些[options]是简单的jQuery的请求选项的字典，得到纳入jQuery的AJAX调用即发。 这意味着你可以很容易地定义其追加认证的简单方法：

sendAuthentication = function (xhr) {
  var user = "myusername";// your actual username
  var pass = "mypassword";// your actual password
  var token = user.concat(":", pass);
  xhr.setRequestHeader('Authorization', ("Basic ".concat(btoa(token))));
}

并将其包含在每个fetch ， save和destroy打电话给你做。 像这样：

 fetch({
  beforeSend: sendAuthentication 
 });

这可能会造成相当多的重复。 另一种选择可能是重写Backbone.sync方法，复制原始代码，只是包括beforeSend选项到每一个jQuery的Ajax请求即发。

希望这可以帮助！

Answer 2:

添加请求头中的Backbone.js的最简单的方法是只将它们传递到所述提取方法的参数，例如

MyCollection.fetch( { headers: {'Authorization' :'Basic USERNAME:PASSWORD'} } );

Answer 3:

一种选择可能是使用jQuery的ajaxSetup，所有骨干请求将最终使用底层jQuery的阿贾克斯。 这种方法的好处是，你只需要添加它一个地方。

$.ajaxSetup({
    headers: { 'Authorization' :'Basic USERNAME:PASSWORD' }
});

编辑2018年1月2日对于复杂的Web应用程序，这可能不是最好的方法，请参见下面的评论。 离开这里的答案引用的缘故。

Answer 4:

你可以重写骨干同步方法。

#coffeescript
_sync = Backbone.sync
Backbone.sync = (method, model, options) ->
    options.beforeSend = (xhr) ->
        xhr.setRequestHeader('X-Auth-Token_or_other_header' , your_hash_key)
        #make sure your server accepts X-Auth-Token_or_other_header!!
    #calling the original sync function so we only overriding what we need
    _sync.call( this, method, model, options )       

Answer 5:

Backbone.$.ajaxSetup({
    headers: {'Authorization' :'Basic USERNAME:PASSWORD'}
});

此代码设置头到主干阿贾克斯，所以他们都会在每一个Backbone.sync发送。 您将能够发送头，不使用xhr.setRequestHeader与每一个同步调用。

所以，你不需要做每次执行以下操作：

MyCollection.fetch({ headers: {'Authorization' :'Basic USERNAME:PASSWORD'} } );

你可以做

MyCollection.fetch();

也许这是一种黑客攻击，但它完全适用于我的系统。

Answer 6:

我对这样的做法是覆盖同步方法，以做请求之前添加标题。 在这个例子中，你可以看到，我创建一个Backbone.AuthenticatedModel ，从延伸Backbone.Model 。

这将影响所有的方法（GET，POST，删除等）

Backbone.AuthenticatedModel = Backbone.Model.extend({
    sync: function(method, collection, options){
        options = options || {};
        options.beforeSend = function (xhr) {
            var user = "myusername";// your actual username
            var pass = "mypassword";// your actual password
            var token = user.concat(":", pass);
            xhr.setRequestHeader('Authorization', ("Basic ".concat(btoa(token))));
        };
        return Backbone.Model.prototype.sync.apply(this, arguments);
    }

});

然后，你必须简单延伸，同时你需要有认证的型号， Backbone.AuthenticatedModel您已经创建了：

var Process = Backbone.AuthenticatedModel.extend({
    url: '/api/process',

});

Answer 7:

Object.save(
  {'used': true}
  {headers: {'Access-Token': 'access_token'}}
)

Answer 8:

创建拦截来电Backbone.sync，配件您授权的报头，并通过其他的一切传递一个自定义的同步方法：

    REPORTING_API_KEY = 'secretKeyHere';
    CustomSync = function(method, model, options) {
        options.headers = {
            'Authorization' : 'Bearer ' + REPORTING_API_KEY
        };
        return Backbone.sync(method, model, options);
    };

然后覆盖你的模型与一个同步：

    MyModel = Backbone.Model.extend({
        urlRoot: '/api/',
        sync: CustomSync
    });

Answer 9:

尝试使用它。 我们可以使用

beforeSend: function(xhr) {
    xhr.setRequestHeader('X-CSRFToken', csrf_token);
},

要么

headers: {
    "X-CSRFToken": csrf_token
},

不过，我想电子书籍的第一个选项（beforeSend）。

这是在我的情况下工作的代码片段。

var csrf_token = this.getCSRFToken();
self.collection.fetch(
{
    beforeSend: function(xhr) {
        xhr.setRequestHeader('X-CSRFToken', csrf_token);
    },
    // headers: {
    //     "X-CSRFToken": csrf_token
    // },
    data: {
        "mark_as": "read"
    },
    type: 'POST',
    success: function () {
        if (clickLink) {
            window.location.href = clickLink;
        } else {
            self.unreadNotificationsClicked(e);
            // fetch the latest notification count
            self.counter_icon_view.refresh();
        }
    },
    error: function(){
        alert('erorr');
    }
});

Answer 10:

1. 在客户端，任何服务器通信之前，补充一点：

    $.ajaxSetup({ xhrFields: { withCredentials: true }, async: true }); 

2. 在服务器端添加这些报头（PHP）：

    header('Access-Control-Allow-Origin: http://your-client-app-domain'); header("Access-Control-Allow-Methods: PUT, GET, POST, DELETE, OPTIONS"); header("Access-Control-Allow-Headers: Content-Type, Authorization, X-Requested-With"); header('Access-Control-Allow-Credentials: true'); 

文章来源: add request header on backbone