Getting facebook authentication running within the MeteorJS framework?

client-side, facebook, meteor

Solution

It's probably a very bad idea to do any sort of authentication to an external API, while passing around App IDs, secrets, etc, from the browser (client in the meteor stack).

I've implemented full facebook authentication on the server successfully.

Add the `accounts-facebook` smart package by running `meteor add accounts-facebook` from your application's working directory. This will allow you to be able to configure support for both the OAuth single user as well as the OAuth multi-user facebook authentication workflows. Please see Meteor Accounts System docs for more info.

After adding the `accounts-facebook` smart package, you may do something along these lines...

Under your application's working directory, in `server/server.js` (or similar file under the `server` directory), implement something like this:

Meteor.startup(function () {
  Accounts.loginServiceConfiguration.remove({
    service: "facebook"
  });

  Accounts.loginServiceConfiguration.insert({
    service: "facebook",
    appId: process.env.FACEBOOK_APP_ID,
    secret: process.env.FACEBOOK_APP_SECRET
  });
});

Take note of these lines:

appId: process.env.FACEBOOK_APP_ID,
secret: process.env.FACEBOOK_APP_SECRET

You will need to set the environment variables `FACEBOOK_APP_ID` and `FACEBOOK_APP_SECRET` properly for the above code to use the correct values.

In `client/client.js` (or similar file under the `client` directory), implement something like this:

Meteor.startup(function() {
  Meteor.loginWithFacebook({
    requestPermissions: ['publish_actions']
  }, function (err) {
    if (err) {
      Session.set('errorMessage', err.reason || 'Unknown error');
    }
  });
});

As per Meteor.loginWithExternalService([options], [callback]), the callback function for `Meteor.loginWithFacebook` allows you to easily distinguish between error states, and non-error states:

Optional callback. Called with no arguments on success, or with a single Error argument on failure.

Problem

I'm starting out my little quest into the world of the Meteor framework and I thought it'd be fun to do something a little bit facebooky with it. step one was to follow the create an app tutorial in meteor then add the FB code to the template as found here: https://developers.facebook.com/docs/opengraph/tutorial/#authenticate Sadly it doesn't seem to work on the page at all. In fact, I've just realized that if I add something like `alert('foo');` to my meteor page it doesn't execute. Interesting. So Metor, despite being completely amazing doesn't work like I expect it to... (shock, horror!). How do I execute client side JS in this framework? (specifcially with the hope of creating a facebook JS object on the page?) Thanks! UPDATE (Jan 2013): Meteor released 0.5.0 which has built in authentication and facebook login support. Documentation is here: http://docs.meteor.com/#accountsui Essentially you run some commands in the shell ``` meteor add accounts-password meteor add accounts-ui meteor add accounts-facebook ``` then in your code you add the login button. ``` {{loginButtons}} ``` then you're in.

Original source

Related problems