28 votes

Comment utiliser l'authentification par jeton avec Rails, Devise et Backbone.js ?

J'essaie de créer une application mobile avec PhoneGap, jQuery Mobile et Backbone.js côté client - avec une API JSON Rails 3 côté serveur.

Je sais comment récupérer le jeton du serveur après avoir été authentifié, mais je ne sais pas comment ajouter la clé/valeur "token_auth" à toutes les requêtes AJAX que Backbone.js fera à mon serveur.

Voici mon flux en ce moment :

  1. L'utilisateur remplit certains champs du formulaire et clique sur "Connexion".
  2. Backbone crée un nouvel objet Player avec les informations d'email et de mot de passe.
  3. Je lance un Player.authenticate qui définit le jeton comme AUTHENTICATION_TOKEN.
  4. Toutes les demandes suivantes doivent ajouter "auth_token=" + AUTHENTICATION_TOKEN

J'ai regardé http://documentcloud.github.com/backbone/#Sync pour peut-être remplacer les appels AJAX - mais cela semble assez extrême pour cette tâche simple.

Quelqu'un a-t-il de l'expérience dans l'utilisation de Devise token_authentication et Backbone.js ?

26voto

dira Points 3498

La clé est de l'introduire dans le Backbone.sync méthode.

Jetez un coup d'œil à cette mise en œuvre : https://github.com/codebrew/backbone-rails/blob/master/vendor/assets/javascripts/backbone_rails_sync.js

Vous pouvez l'ajouter vous-même de cette façon :

Backbone.old_sync = Backbone.sync
Backbone.sync = function(method, model, options) {
    var new_options =  _.extend({
        beforeSend: function(xhr) {
            var token = $('meta[name="csrf-token"]').attr('content');
            if (token) xhr.setRequestHeader('X-CSRF-Token', token);
        }
    }, options)
    return Backbone.old_sync(method, model, new_options);
};

Regardez ce violon : http://jsfiddle.net/dira/ZcY3D/14/

14voto

abstraktor Points 521

Pourquoi ne pas l'ajouter à toutes vos requêtes jquery ajax. Il ajoutera le auth_token à tous vos appels ajax via jQuery. Cela pourrait être utile lorsque vous travaillez directement avec jQuery ajax (ou des librairies qui le font). Mais cela pourrait aussi être un problème de sécurité (lorsque vous avez des appels ajax vers d'autres sites...).

// this is untested
$.ajaxSetup({ beforeSend : function(xhr, settings){ 

  // just because the auth_token is a private information
  if(!settings.crossDomain) {

    // parse data object
    var dataobj = JSON.parse(xhr.data);

    // add authentication token to the data object
    dataobj.auth_token = AUTHENTICATION_TOKEN;

    // save the dataobject into the jqXHR object
    xhr.data = JSON.stringify(dataobj); 

  }
}});

Une autre approche peut consister à écrire ce jeton dans l'en-tête et à le traiter du côté du serveur :

// thats not beautiful
$.ajaxSetup({ headers : { "auth_token" : AUTHENTICATION_TOKEN } });

1voto

Leahcim Points 5965

Créez une fonction comme celle-ci qui l'enverra chaque fois qu'une requête ajax sera envoyée au serveur.

$(function(){
    $(document).ajaxSend(function(e, xhr, options) {
        var token = $("meta[name='csrf-token']").attr("content");
        xhr.setRequestHeader("X-CSRF-Token", token);
    });
})

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X