我的服务器有手动授权。我需要将我的服务器的用户名/密码放入我的骨干请求,以便它通过。我怎么能这样做?有任何想法吗?谢谢
Backbone中的模型使用fetch
,save
和destroy
方法检索,更新和销毁数据。这些方法将实际请求部分委托给Backbone.sync。在引擎盖下,所有Backbone.sync
正在做的是使用jQuery创建一个ajax请求。为了合并您的Basic 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请求中。
希望这可以帮助!
$.ajaxSetup({
xhrFields: {
withCredentials: true
},
async: true
});
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');
在Backbone.js中添加请求标头的最简单方法是将它们作为参数传递给fetch方法,例如
MyCollection.fetch( { headers: {'Authorization' :'Basic USERNAME:PASSWORD'} } );
一个选项可能是使用jQuery ajaxSetup,所有Backbone请求最终将使用底层的jQuery ajax。这种方法的好处是你只需要将它添加到一个地方。
$.ajaxSetup({
headers: { 'Authorization' :'Basic USERNAME:PASSWORD' }
});
编辑2018年1月2日对于复杂的Web应用程序,这可能不是最好的方法,请参阅下面的评论。在此留下答案以供参考。
您可以覆盖Backbone同步方法。
#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 )
Backbone.$.ajaxSetup({
headers: {'Authorization' :'Basic USERNAME:PASSWORD'}
});
此代码将标头设置为Backbone ajax,因此它们将与每个Backbone.sync一起发送。每次同步调用时,您都可以在不使用xhr.setRequestHeader
的情况下发送标头。
所以你不需要每次都做以下事情:
MyCollection.fetch({ headers: {'Authorization' :'Basic USERNAME:PASSWORD'} } );
你可以这样做
MyCollection.fetch();
也许这是一种黑客攻击,但它对我的系统来说非常有效。
我对此类方法的处理方法是覆盖sync方法,以便在执行请求之前添加标头。在这个例子中你可以看到我正在创建一个Backbone.AuthenticatedModel
,它从Backbone.Model
扩展而来。
这将影响所有方法(GET,POST,DELETE等)
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',
});
Object.save(
{'used': true}
{headers: {'Access-Token': 'access_token'}}
)
创建一个自定义同步方法,拦截对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
});
尝试使用它。我们也可以使用
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');
}
});