2013-10-08 3 views
0

code Google OAuth2 est basé sur https://developers.google.com/api-client-library/javascript/features/authenticationGoogle OAuth2 + Backbone + Require.js = Problèmes avec "cette" fixation

LoginView a quelques fonctions, chaque fonction appelle une autre fonction.

Au moment où il obtient la fonction checkAuth, les rendements this.handleAuthResultnon défini parce checkAuth a été appelé à l'intérieur du setTimeout par handleClientLoad.

Comment traiter avec this problème de contexte? Et puis-je faire la même chose pour mes variables - scope, clientId, apiKey au lieu de les faire global?

define(['underscore','jquery','backbone','text!templates/login.html','async!https://apis.google.com/js/client.js!onload'], function(_, $, Backbone, loginTpl) { 
    var LoginView = Backbone.View.extend({ 
    template: _.template(loginTpl), 

    initialize: function() { 
     clientId = ''; 
     apiKey = ''; 
     scopes = 'https://www.googleapis.com/auth/plus.me'; 

     this.handleClientLoad(); 
    }, 

    render: function() { 
     this.$el.html(this.template()); 
     return this; 
    }, 

    handleClientLoad: function() { 
     gapi.client.setApiKey(apiKey); 
     window.setTimeout(this.checkAuth, 1); 
    }, 

    checkAuth: function() { 
     gapi.auth.authorize({ client_id: clientId, scope: scopes, immediate: true }, this.handleAuthResult); 
    }, 

    handleAuthResult: function(authResult) { 
     var authorizeButton = this.$el.find('#authorize-button'); 

     if (authResult && !authResult.error) { 
     console.log('Authorized!'); 
     this.makeApiCall(); 
     } else { 
     authorizeButton.onclick = this.handleAuthClick; 
     } 
    }, 

    handleAuthClick: function(event) { 
     gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, this.handleAuthResult); 
     return false; 
    }, 

    makeApiCall: function() { 
     gapi.client.load('plus', 'v1', function() { 
     var request = gapi.client.plus.people.get({ 
      'userId': 'me' 
     }); 
     request.execute(function(resp) { 
      var authorizeButton = this.$el.find('#authorize-button'); 
      localStorage.isAuthenticated = true; 
      Backbone.history.navigate('', true); 
     }); 
     }); 
    } 
    }); 

    return LoginView; 
}); 
+0

Cette question peut être en dehors de votre question. Comment avez-vous résolu l'authentification et la sécurité avec cette bibliothèque? Est-ce qu'il renvoie un jeton? Merci –

Répondre

3

Le setTimeout dans handleClientLoad est la question:

window.setTimeout(this.checkAuth, 1); 

Lorsque 'window.setTimeout' est exécuté après 1ms et qu'il ne soit plus exécuté dans le cadre LoginView.

Vous pouvez utiliser '_.bind' pour lier l'exécution à ce sujet.

window.setTimeout(_.bind(this.checkAuth, this), 1); 

Vous pouvez également lire l'affichage 'this'.

Espérons que cette aide!

+0

cette aide en partie, mais comment puis-je faire face à 'ce el' $ dans' var = authorizeButton ce el.find $ ('# bouton Authorize').. '? ** UPDATE **: Résolu en utilisant '_.bindAll (this, 'handleAuthResult', 'makeApiCall');'. –

Questions connexes