Meteor.js loginWithGoogle does nothing

Question

I am working on my first Meteor app that uses OAuth for login. Prior to this, all of my projects have used only the accounts-password portions.

I have a simple login for with a button to login via Google:

<template name="login">
  <form id="login" role="form">
    <div class="form-group">
      <label for="username">Username:</label>
      <input type="text" id="username" name="username" class="form-control" placeholder="Username" />
    </div>
    <div class="form-group">
      <label for="password">Password:</label>
      <input type="password" id="password" name="password" class="form-control" placeholder="Password" />
    </div>
    <button id="signin" class="btn btn-primary">Sign in</button>
    <hr />
    Or:<br />
    <button id="loginWithFacebook">Login with Facebook</button>
    <button id="loginWithGoogle">Login with Google</button>
    <button id="loginWithTwitter">Login with Twitter</button>
  </form>
</template>

I then have a event handler to capture the button click and call the loginWithGoogle:

...
  "click #loginWithGoogle": function(e, t){
    Meteor.loginWithGoogle({
      requestPermissions: [],
      loginStyle: "popup"
    }, function(err) {
      if (err) {
        // TODO Need to do something here with the error...
        console.log('Error: ', err);
      } else {
        Router.go('home');
      }
    });
  }
...

On the server I setup OAuth for Google like thus:

ServiceConfiguration.configurations.remove({
  service: "google"
});
ServiceConfiguration.configurations.insert({
  service: "google",
  clientId: "000000000000000",
  loginStyle: "popup",
  secret: "000000000"
});

Accounts.onCreateUser(function (options, user) {
  console.log('Creating user: ' + user.username);
  return user;
});

And in my route I have this:

if (Meteor.isClient) {
    // Initialize the loading template before hand
    Router.onBeforeAction('loading');

    // Map the routes
    Router.map(function() {
        // Homepage
        this.route('home', {
            path: '/',
            onBeforeAction: function() {
              if (!Meteor.user()) {
                console.log('User is not logged in. Displaying login form.');
                Router.go('login');
              } else {
                console.log('User is already logged in:', Meteor.user());
              }
            }
        });

        // Login page
        this.route('login', {
            path: '/login'
        });
    });
}

So, I get the console log in the browser saying User is not logged in. Displaying login form., and when I click the Login with Google button I get the popup asking which Google account I want to use, then the confirmation page. But when I click the Accept button I get nothing. The Accounts.onCreateUser() doesn't seem to run, nor does the callback code on the loginWithGoogle(). How do I get this configured correctly so that the callback runs, and ultimately I am re-directed back to my homepage?

Answer 1

Your onCreateUser doesn't work because you don't have username specified.

Try using

 if(user.services.google)
       user.username = user.services.google.name

And by the way, why won't you use {{>loginButtons}}?