Ember-Simple-Auth-Torii: How can i handle server side authorizatoin with devise-omniauth

Question

Hi I have a ember app with frontend with ember-cli-simple-auth-torii & ember-cli-simple-auth-devise backend with devise and omniauth-facebook

THe torii gives you an authorizationCode on login in with facebook and what we do with this authorization code is upto us.

Since it is good practice to authenticate user against server side. I want to use this authorizationCode with omni auth.

My AuthenticationController looks like this

class AuthenticationsController < Devise::OmniauthCallbacksController
 def facebook
   omniauth = request.env["omniauth.auth"]
   authentication = Authentication.find_by_provider_and_uid(omniauth['provider'],  omniauth['uid'])
    ...
    sign_in(:user,user)
 end
end

My SessionsController

class SessionsController < Devise::SessionsController
  def create
    respond_to do |format|
      format.html { super }
      format.json do
        binding.pry
        self.resource = warden.authenticate!(auth_options)
        sign_in(resource_name, resource)
        data = {
          user_token: self.resource.authentication_token,
          user_email: self.resource.email
        }
        render json: data, status: 201
      end
    end
  end
end

I am not sure if my approach is right but I guess calling the users/auth/facebook/callback from my client should trigger authentication process at server side and I can authorize user later for crud operations in my app.

authenticateWithFacebook: function(provider) {
       var self = this
        this.get('session').authenticate('simple-auth-authenticator:torii', "facebook-oauth2" ).then(function() {
          var authorizationCode= self.get('session.authorizationCode');
          console.log(authorizationCode);
          Ember.$.ajax({
            type: 'POST',
            url: 'http://localhost:3000/users/auth/facebook/callback',
            dataType: 'json',
            data: {
              code: authorizationCode,
            },
            success: function(data, textStatus, jqXHR) {
              // Handle success case
            },
            error: function(jqXHR, textStatus, errorThrown) {
              // Handle error case
            }
          });

        });
    },

My Server logs says I am able to initiate omniauth facebook login callback phase but then it gives error Error validating verification code. Please make sure your redirect_uri is identical to the one you used in the OAuth dialog request

Started POST "/users/auth/facebook/callback" for 127.0.0.1 at 2014-11-16 11:03:44 +0530
I, [2014-11-16T11:03:44.926842 #5160]  INFO -- omniauth: (facebook) Callback phase initiated.
E, [2014-11-16T11:03:46.185161 #5160] ERROR -- omniauth: (facebook) Authentication failure! invalid_credentials: OAuth2::Error, : 
{"error":{"message":"Error validating verification code. Please make sure your redirect_uri is identical to the one you used in the OAuth dialog request","type":"OAuthException","code":100}}
Processing by AuthenticationsController#failure as HTML
  Parameters: {"code"=>"AQBaag8FhEzyd8qCMh14HbAl-iBXrpK1YSrP9vz72kzRE86S-cf0Vsf1sSfpR1-Fajr1QfUbAoyYqj3ivcXayGk5KcmT27b4avy1NAcLzM2FcW1neGS9RA6CoVhYXpj2rbjYY7Dm-1Qw6Me0RjiidwJxwF4SVUVX4S6Y5UatRMW6FW2IyKxJJy8e0-VYlmFBpv3VKjq3tYE_pdM6lKLTEBAyApvIm2UfTZXLqeWWIIIf3romLB-q48BXvv2koM5fSkrvB2HyPOJq9Y_RLeWtw4nARn8aluJC-KhyYfUcprf_KzM30ZBYNxu5S6IYkgcdq_kwEsHinoddDqe-"}
Redirected to http://localhost:3000/users/sign_in
Completed 302 Found in 62ms (ActiveRecord: 0.0ms)

1. Error validating verification code. Please make sure your redirect_uri is identical to the one you used in the OAuth dialog request I am calling Facebook server from my client side port: 4200 and my ajax call uses url http: // localhost :3000/users/auth/facebook/callback port 3000

2. When in my ajax call from client side I use /users/auth/facebook/callback I get error : Invalid redirect i.e type: 'POST', url: '/users/auth/facebook/callback', dataType: 'json',

   Started POST "/users/auth/facebook/callback" for 127.0.0.1 at 2014-11-16 11:27:40 +0530 I, [2014-11-16T11:27:40.150441 #5160] INFO -- omniauth: (facebook) Callback phase initiated. E, [2014-11-16T11:27:41.336997 #5160] ERROR -- omniauth: (facebook) Authentication failure! invalid_credentials: OAuth2::Error, : {"error":{"message":"Invalid redirect_uri: \u0926\u093f\u0932\u0947\u0932\u0940 URL \u0905\u0928\u0941\u092a\u094d\u0930\u092f\u094b\u0917 \u0915\u0949\u0928\u094d\u092b\u093f\u0917\u0930\u0947\u0936\u0928\u0926\u094d\u0935\u093e\u0930\u0947 \u0905\u0928\u0941\u092e\u0924 \u0928\u093e\u0939\u0940.","type":"OAuthException","code":191}} Processing by AuthenticationsController#failure as JSON Parameters: {"code"=>"AQD38nHY4xvZnGdaFNJrjcIiBaSMPa3ZLsr3jpV8aPRoFHPGOTITGMtPZ9sA7pts41JnObhCsK3fLTI64Z-7YJi2PQGL7_O1i5m8GF57dGBYegxnSOZJAYxhiuxnIwxp4uhw4OBz61hthtOsF1BNw0bK3LNQJbJPXK0LO0HxasZ0d06swFcp4t8mminRhv6Qsx7ZQVCrOs7oonYfyNxGQiVUB7UM6u7JcPVYaySfJQR1QkMKnLvQ058kbKEUaIvvUyrLE73Gjs_i4mgb4SBAZMbR3c1qVlPgZ-75cIsyqmttmqhO-y4NgEAOPh"} Redirected to http : // 127.0.0.1 :3000/users/sign_in Completed 302 Found in 74ms (ActiveRecord: 0.0ms)

I dont know if my approach is right. I want to have devise + torii authentication both

Answer 1

//This worked for me waiting for more elegant way.

   authenticateWithFacebook: function(provider) 
    {
           var self = this;
           this.get('session').authenticate('simple-auth-authenticator:torii', "facebook-connect" ).then(function() 
    {

              var access_token= self.get('session.accessToken');

              Ember.$.ajax({
                type: 'POST',
                url: 'http://localhost:3000/users/auth/facebook_access_token/callback',

                dataType: 'json',
                data: {
                  access_token : access_token,

                },
                success: function(data, textStatus, jqXHR) {
                  // Handle success case
                },
                error: function(jqXHR, textStatus, errorThrown) {
                  // Handle error case
                }
              });

              self.transitionTo('dashboard');
             });
        },