5

In my REST server, it's requiring the access_token to be present in every request. i.e. in POSTing data, access_token needs to be submitted together with the attributes.

How do I configure backbone.js to add access_token to every GET, PUT, POST and DELETE request?

Thanks.

Mikko
  • 602
  • 4
  • 18

2 Answers2

4

Okay, I think I found a way how to do it in jQuery.

$.ajaxSetup (
   {
      data: { access_token: 'my_access_token' }
   }
);
Mikko
  • 602
  • 4
  • 18
1

Backbone uses jQuery/Zepto for AJAX requests, so you can use the functionality available in those libraries.

To add custom headers to all XHR calls made by jQuery, you can use the jQuery.ajaxSend event, which is triggered before every ajax request, and modify the jqXHR it receives as an argument.

Edit based on OP's comments:

Probably the simplest way to modify the sent data is to override the Backbone.sync function. You could wrap the native implementation, and add the required property there:

var nativeSync = Backbone.sync;
Backbone.sync = function (method, model, options) {
  //for POST/PUT requests, add access token to the request
  if(model && (method === 'create' || method === 'update')) {

    var data = _.extend(model.toJSON(), {
      access_token: 'token'
    });

    options.data = JSON.stringify(data);
  }
  //call the native Backbone.sync implementation
  nativeSync(method, model, options);
};
jevakallio
  • 35,324
  • 3
  • 105
  • 112
  • Hello fencliff. What if I want the access_token to be in the data payload itself and not on the headers, how do I achieve it? Do I $.ajaxSend(function(e, jqxhr, settings) { settings.data.access_token = 'mytoken' }) it? – Mikko Dec 07 '12 at 12:56
  • That can be done as well -- but are you sure you want the access_token added to GET and DELETE requests as well? It's not typical to provide a request body using those verbs, and most web servers ignore the body anyway. – jevakallio Dec 07 '12 at 13:14
  • Actually I'm using the https://github.com/philsturgeon/codeigniter-restserver REST server, and as I checked the source code they're relying on the request body. – Mikko Dec 07 '12 at 13:19
  • I don't think it's possible to send a body with GET request using jQuery. See: http://stackoverflow.com/questions/10298899/how-to-send-data-in-request-body-with-a-get-when-using-jquery-ajax – jevakallio Dec 07 '12 at 13:22
  • Actually, the $.ajaxSend did not work for me but $.ajaxSetup worked. Those passed in the data attribute of the request for GET requests was appended to the URL as GET parameters. – Mikko Dec 07 '12 at 13:24
  • Yes, jQuery does that for you. So it seems your server doesn't rely on request body for GET requests after all. By the way, looking at the answer you posted, I doubt that will work with POST/PUT request. Unless I'm mistaken, the data-property you specify in the ajaxSetup method will be overwritten with the actual request body, not extended. – jevakallio Dec 07 '12 at 13:29
  • Yep, sorry for that - request body shouldn't have been the term. For POST and PUT, it works since it merges the data in ajaxSetup and data in the ajax call. – Mikko Dec 07 '12 at 13:31
  • Very weird. I just tested this with Backbone 0.9.1 and jQuery 1.7.2. For me the body does not merge, probably because Backbone calls `JSON.stringify` on the data before the $.ajax call. `$.ajaxSetup({data: {foo:"bar"}});` `$.ajax({url:"/dummy", type:"POST", contentType:"application/json", data:{baz: 'qux'}});` Gives me request body with only {baz:'qux'}. Glad it works anyway! – jevakallio Dec 07 '12 at 13:45
  • I only tested it with jQuery, now I tested it with Backbone.js and it doesn't merge now. :( – Mikko Dec 07 '12 at 13:50
  • I edited my answer. It's missing error checking etc, but it should work. – jevakallio Dec 07 '12 at 14:22