New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

ng-token-auth with Ionic Framework/Cordova #90

Closed
Liampronan opened this Issue Jan 9, 2015 · 36 comments

Comments

Projects
None yet
@Liampronan

Liampronan commented Jan 9, 2015

Hello!

I'm using ng-token-auth + devise-token-auth for an app I'm working on, and it's working great for the browser version of my site. My auth flow uses twitter oauth. I'm attempting to use the same auth code for Ionic/Cordova on mobile, but am running into issues with the log-in flow: after hitting the omniauth callback, my app stays on the 'redirecting...' screen.

I believe the issue is with the Cordova app window and the new window that is opened by ng-token-auth. I'm thinking that a solution would be to implement ng-token-auth with the InAppBrowser Cordova plugin, but wanted to check to see if anyone has run into something similar and/or has any ideas.

Any help would be greatly appreciated!

@lynndylanhurley

This comment has been minimized.

Owner

lynndylanhurley commented Jan 9, 2015

@Liampronan - this could be an issue with Cordova and postMessage.

There is an undocumented config option called forceHardRedirect - try setting it to true and see if that solves the issue.

Example
angular.module('myApp', ['ng-token-auth'])
    .config(function($authProvider) {
        $authProvider.configure({
            apiUrl: 'http://api.example.com',
            forceHardRedirect: true
        });
    });
@rajaaa92

This comment has been minimized.

rajaaa92 commented Jan 9, 2015

@Liampronan I have the same issue.

And the solution suggested by @lynndylanhurley is not helping - in the mobile app we are not allowed to make redirections.

@Liampronan is probably right abut the InAppBrowser Cordova plugin. I have found another repo that enables facebook registration also for Cordova apps: https://github.com/ccoenraets/OpenFB
We can read in the readme:

"The library works for both browser-based apps and Cordova/PhoneGap apps. When running in a browser, the OAuth URL redirection workflow happens in a popup window. When running in Cordova, it happens inside an "In-App Browser"."

@Liampronan

This comment has been minimized.

Liampronan commented Jan 12, 2015

@rajaaa92 Agreed. I actually was able to get a quick, working solution using the IAB plugin and some slight workarounds. The login flow is:

  1. Set up an IAB browser directed at your auth URL (instead of using the ng-token-auth $auth.authenticate)

  2. Configure the rails omniauth success callback to send the auth info inside the success template (you can set css display: hidden so that the template still only shows the user "Redirecting...")
    [note: I didn't spend much time looking into it, but could not get the ng-token-auth postMessage JS to fire inside the IAB, which is why I included the auth info in the template)

  3. Set up an event handler on the IAB browser to:
    i) grab the auth info from the template
    ii) manually call $auth.handleValidAuth with that auth info
    iii) close the window
    [note: http://stackoverflow.com/questions/23930744/how-to-use-google-login-api-with-cordova-phonegap/23931392#23931392 is an example of similar oauth and IAB login/window closing]

This will pass the auth info to ng-token-auth and allows it to work with devise-token-auth to make authenticated requests. However, this just handles the initial login, so I will probably have to update it for re-authentication..

Any thoughts on this approach?

@lynndylanhurley thank you for the suggestion! that did not work, but it's really more of an issue with cordova than this library. ng-token-auth and devise-token-auth are extremely useful and awesome!

@lynndylanhurley

This comment has been minimized.

Owner

lynndylanhurley commented Jan 13, 2015

@Liampronan - thank you for posting this.

I'm obviously not very familiar with Cordova. In your experience, is there anything that this module can do to provide better support?

@RobGoretsky

This comment has been minimized.

RobGoretsky commented Jan 31, 2015

@Liampronan - I'm also working on a Cordova app (using the Ionic framework) and was hoping to use ng-token-auth (client side) and devise-token-auth (server side) but realized that i'd hit the same issues you are describing when trying to get through an oauth flow like the one required for facebook login. The approach you described sounded promising - did you end up getting it all to work?

@Liampronan

This comment has been minimized.

Liampronan commented Jan 31, 2015

@RobGoretsky yes, it did! it's a bit of a non-perfect workaround, but definitely works..

https://gist.github.com/Liampronan/9ca625d33e987f0be0f8 -> link to gist to give you a better idea of the implementation. I'd really love to fork ng-token-auth with a more robust fix for cordova, but am a bit busy atm. definitely reach out with any questions -- I'm happy to help

@lynndylanhurley

This comment has been minimized.

Owner

lynndylanhurley commented Jan 31, 2015

@Liampronan - if you send me a PR for this (with tests!) I'll merge ASAP.

@RobGoretsky

This comment has been minimized.

RobGoretsky commented Feb 5, 2015

@Liampronan - Thanks for passing along this Gist, it's incredibly helpful! You mentioned that in addition to this code on the client side, you also configured the 'rails omniauth success callback to send the auth info inside the success template'. I'm guessing you mean that you overrode, within devise token auth on the server side, either app/views/devise_token_auth/omniauth_success.html.erb and/or app/views/layouts/omniauth_response.html.erb .. How did you manage to get those overridden templates to be applied without rewriting much of the controller code? Can you share a sample from that end as well? Thanks again!

@Liampronan

This comment has been minimized.

Liampronan commented Feb 5, 2015

@RobGoretsky Yup, I overrode the omniauth_response.html.erb view. I just put the following code in the view in a p tag:
<%= @auth_origin_url %>

the instance var, @auth_origin_url, is built in the devise token auth omniauth_callbacks_controller and is a url containing the token, client id, uuid, and token expiry for the user -- no controller code needs to be re-written, hooray!! (unless you want to send extra info)

you can then just regex the params from that url that is included in the response. if you're feeling extra nifty, you can even hide the @auth_origin_url with css, so the user doesn't see it in the response.

@lynndylanhurley added to my todo list!

@dtelaroli

This comment has been minimized.

dtelaroli commented Mar 4, 2015

+1

@davidtlee

This comment has been minimized.

davidtlee commented Mar 6, 2015

@Liampronan - really appreciate you sharing your approach. I'm trying to do the same thing and having trouble. Was wondering if you'd be willing to help me see if I'm missing something. The following things seem to be working:

  • A new browser window is launching
  • I see the auth_origin_url after signing in (which looks something like: http://localhost:3000/#?client_id=8lzlsqazJhmGtSNu--YUbA&expiry=1426822518&token=6w3ZIV0kw_WCGq7ZBe4SUQ&uid=108633578503144270402)

However, the window doesn't close and the signin information doesn't get passed. Some simple logging indicates that the eventListener is never firing (I have a console.log statement within the eventListener which isn't going off). Not sure if there's something simple I'm missing. Here's my code:

I added the following in omniauth_response.html.erb:

    <p>
      <%= @auth_origin_url %>  
    </p>

I used the gist you provided with small modifications (not sure if I did the stubUrl correctly):

      //stubUrl to get around angular url '#' check on the backend (via devise_token_auth)
      this.stubUrl = "http://localhost:3000/";
      this.authUrl = $auth.apiUrl() + '/auth/google_oauth2/?auth_origin_url=' + _this.stubUrl;


      this.login = function(){
        var deferred = $q.defer();
        //open IAB window
        var browserWindow = $window.open(_this.authUrl, '_blank', 'location=no');
        console.log("just opened");

        // listen for IAB window finish loading
        browserWindow.addEventListener( "loadstop", function() {
          console.log("In loadstop callback");
          //grab linkedin authcode from url response
          getAuthCodeFromResponse(browserWindow)
            .then(function(success){
              deferred.resolve();
            }, function(err){

            })
        });
        return deferred.promise
      }

Really appreciate any advice you can give!

@RobGoretsky - did you end up getting it to work too?

@RobGoretsky

This comment has been minimized.

RobGoretsky commented Mar 9, 2015

@davidtlee - I did end up getting this to work! I was stuck around the same spot as you (seemed that the eventListener was not firing) but then I realized that the In App Browser plugin only fires that even when running within the emulator (not within the web browser on desktop).. Have you tried running this within the iOS emulator?

@davidtlee

This comment has been minimized.

davidtlee commented Mar 9, 2015

Hey @RobGoretsky, thanks for the help!

I gradually realized the same thing as you and did end up running it on the iOS emulator, but have been getting another strange problem. It sometimes launches the inappbrowser, but sometimes doesn't. I tried tracking it down, but sometimes it's working and then stops working after just commenting out a console.log statement....

When it's working, this is what I see in the console.log file:

2015-03-06 08:49:45.420 HelloWorld[22930:3829995] Resetting plugins due to page load.
2015-03-06 08:49:45.643 HelloWorld[22930:3829995] Finished load of: file:///
2015-03-06 08:49:47.379 HelloWorld[22930:3829995] Setting the WebView's frame to {{0, 0}, {375, 623}}
2015-03-06 08:49:47.386 HelloWorld[22930:3829995] THREAD WARNING: ['InAppBrowser'] took '190.662109' ms. Plugin should use a background thread.
2015-03-06 08:49:47.402 HelloWorld[22930:3829995] just opened
2015-03-06 08:49:48.895 HelloWorld[22930:3829995] In loadstop callback
2015-03-06 08:51:06.584 HelloWorld[23158:3830878] Apache Cordova native platform version 3.8.0 is starting.
2015-03-06 08:51:06.586 HelloWorld[23158:3830878] Multi-tasking -> Device: YES, App: YES
2015-03-06 08:51:06.588 HelloWorld[23158:3830878] Unlimited access to network resources
2015-03-06 08:51:06.590 HelloWorld[23158:3830878]

When it's not working, this is what I see:

2015-03-06 08:51:06.973 HelloWorld[23158:3830878] Resetting plugins due to page load.
2015-03-06 08:51:07.186 HelloWorld[23158:3830878] Finished load of: file:///
2015-03-06 08:51:08.836 HelloWorld[23158:3830878] Resetting plugins due to page load.
2015-03-06 08:51:10.288 HelloWorld[23158:3830878] Finished load of: http://synapp-chat-prod-123.herokuapp.com/api/auth/google_oauth2/callback
2015-03-06 08:51:36.444 HelloWorld[23378:3831486] Apache Cordova native platform version 3.8.0 is starting.
2015-03-06 08:51:36.446 HelloWorld[23378:3831486] Multi-tasking -> Device: YES, App: YES
2015-03-06 08:51:36.449 HelloWorld[23378:3831486] Unlimited access to network resources
2015-03-06 08:51:36.453 HelloWorld[23378:3831486]

Did you ever have similar problems? When looking on stackoverflow, it seemed like there might be a problem related to XCode 6?

@krk324

This comment has been minimized.

krk324 commented Mar 18, 2015

I'm also having same issue. Have anyone figured out the solution?

@davidpatrick

This comment has been minimized.

davidpatrick commented Mar 18, 2015

I was able to solve this using the InAppBrowser's executeScript. Then I handle the return from the executeScript to store the user into $auth and I then emit a successful login. The way I set it up allows my web app and my mobile app to both talk to the same OAuth endpoint.

login_controller.js

angular.module('app.controllers.home', [])
.controller('HomeCtrl', function(loginService){
  $scope.login = function(){
    loginService.authenticate()
  };
});

login_service.js

angular.module('app.services.login', [])
.service('loginService', ['$rootScope', '$q', 'RESOURCES', '$window', '$auth',
  function ($rootScope, $q, RESOURCES, $window, $auth) {
    var _this = this;

    this.originUrl = $window.location.origin;
    this.authUrl = RESOURCES.baseUrl + RESOURCES.signInUrl + _this.originUrl

    this.authenticate = function() {
      var defer = $q.defer();
      var browserWindow = $window.open(_this.authUrl, '_blank', 'location=no');

      browserWindow.addEventListener('loadstop', function(event) {
        if (event.url.match(RESOURCES.baseUrl)) {
          browserWindow.executeScript(
            { code:'getCredentials()' },

            function(response){
              var rsp = response[0];

              if (rsp.message == 'deliverCredentials') {
                var user = rsp.data;

                // Set the user in ng-token-auth
                $auth.initDfd();
                $auth.handleValidAuth(user, true);

                // emit a successful login
                $rootScope.$emit('auth:login-success', user)
                defer.resolve(user);
              } else {
                $rootScope.$emit('auth:login-error', rsp.error)
                defer.reject(rsp.error);
              };

              // Finished with InAppBrowser
              browserWindow.close();
            }
          );
        };
      });

      return defer.promise;
    };
  }
]);

index.html.erb

<!DOCTYPE html>
<html>
  <head>
    <script>
        var getCredentials = function(){
          return {
            message: "deliverCredentials", // required
            auth_token: '<%= @user.authentication_token %>', // required
            uid: '<%= @user.uid %>', // required
            data: <%= raw UserSerializer.new(@user, root: false).to_json %>
          };
        };

        window.addEventListener("message", function(ev) {
          if (ev.data === "requestCredentials") {
            ev.source.postMessage(getCredentials(), '*');
            window.close();
          }
        });
    </script>
  </head>
  <body>
    <h3>
      Thanks you for signing up! Please close this window if it does not close automatically.  
    </h3>
  </body>
</html>
@davidpatrick

This comment has been minimized.

davidpatrick commented Mar 19, 2015

If you are using my fix with Ionic you can also get Ionic Serve to play nicely by only using our new service if we are on iOS

    this.login = function() {
      var isIOS = ionic.Platform.isWebView() && ionic.Platform.isIOS();

      if (isIOS) {
        return this.authenticate();
      } else {
        return $auth.authenticate('instagram');
      }
    };
@davidtlee

This comment has been minimized.

davidtlee commented Mar 21, 2015

@krk324, I ended up not using window.open cause I never could get IAB to work... this probably isn't the right solution, but I ended up using the below code, which was able to get InAppBrowser to launch.

cordova.exec(callback, null, "InAppBrowser", "open", [_this.authUrl, '_blank', 'location=no']);

I haven't tried @davidpatrick's solution, so it's possible that would be a cleaner solution.

@dcadenas

This comment has been minimized.

dcadenas commented Mar 30, 2015

+1

@krk324

This comment has been minimized.

krk324 commented Apr 1, 2015

I'm still having problem logging in.

The inapp browsers opens and the redirecting and authtoken shows up on the webpage, but the IAB doesn't close. I'm testing it on ios simulator. On the server side login success.

When I close the IAB manually by clicking done button I get following error in console.log.

IAB.close() called but it was already closed.
Error in Success callbackId: InAppBrowser1280649790 : TypeError: null is not an object (evaluating 'authResponseQueryString.match(uidRegex)[1]')

@Liampronan

This comment has been minimized.

Liampronan commented Apr 1, 2015

@krk324 have you tried implementing the conditional (simulator vs. device) function shared by @davidpatrick ? If not, as an FYI, the IAB plugin doesn't work in the simulator

@casertap

This comment has been minimized.

casertap commented Apr 13, 2015

Hey guys,
I have open a new issue on something very similar to what you are discussing: #141

The code that I have is very different from what you guys are doing.
I am letting the ngCordova plugin do its magic:

 $cordovaOauth.facebook("9...4", ["email"]).then(function(result) {
            console.log("CONNECTED");
            console.log(result);           
        }, function(error) {
            console.log("ERROR");
            console.log(error);
        });

The output look like this after authentication:

CONNECTED
{"access_token":"CAANOTIKs5WABAKPF7DZC8M1n1U7QmsYd9IjmdAl7RHVhgwHveE83X0ZCRVsO6ZA4HUt3478XB...yHZAZBoB2gty03tL6b4zyiYxcCB6dOjb03R8mmfeIXR5yupx74alcpZBlAx5pWRslDOsjfM2MZD","expires_in":"5182962"}

What should I do next? So I can tell the ng-token-auth plugin that the user is authenticated.

PS: 1) facebook connection is working if I use the ng-token-auth plugin in the browser (without ngCordova).
2) I'm not sure if I have setup the routes correctly for ngCordova because I am using the default:

mount_devise_token_auth_for 'User', at: 'auth'
authProviderPaths: {
                facebook: '/auth/facebook',
                google: '/auth/google_oauth2'
            }

and ngCordova says: "Facebook or Google, it is very important to use http://localhost/callback as the callback / redirect uri."

@heysailor

This comment has been minimized.

heysailor commented May 6, 2015

@casertap you are on the right track if you're getting an access_token returned. The reference to using a local host callback is how ngCordova's plugin hears back from Facebook. If you're getting the FB access token, it's set up correctly.

However the flow from here for a Cordova app needs a different path than is offered by ng-token currently.

I'm working on a fork which will take an OAuth token (ie a Facebook access_token) and send it to the server for checking. I'll put a link here when I'm done. This would need a server-side verification however, which would also need to be added.

@casertap

This comment has been minimized.

casertap commented May 12, 2015

@heysailor Thanks you, I follow also the other discussion where you proposed a solution to this problem. (Actually, that's me that started the discussion :-) ) I hope you will be able to PR the ng-token-auth lib soon. Thanks again. Keep up the good work.

@davidpatrick

This comment has been minimized.

davidpatrick commented May 18, 2015

@casertap The ng-cordova-oauth plugin "magic", uses the same magic here, the InAppBrowser. Except the cordova plugin has wrapped specific api endpoints, and has us returning the oAuth token to a fake endpoint that the InAppBrowser intercepts. What I demonstrated here is how to build our own service and have it return the token to our server instead of a fake endpoint.

@booleanbetrayal

This comment has been minimized.

Collaborator

booleanbetrayal commented Jul 24, 2015

Cross-posted from #141:

@Liampronan / @davidpatrick / anyone-who-is-willing: I'd love to get Cordova OAuth support baked into this module and reduce the number of custom forks that people are requiring. Can you you provide a formal PR for me to take a look at? If so, it'll get top-priority. Same applies for devise_token_auth.

FWIW, seems like most people are landing on ng-cordova-oauth as the module of choice. That seems like a reasonable optional dependency for this implementation.

@booleanbetrayal

This comment has been minimized.

Collaborator

booleanbetrayal commented Jul 28, 2015

@nbrustein and I are working on a refactoring of the omniauth controller logic in order to support sameWindow (new default), externalWindow, and inAppBrowser flows. We should have a PR soon (hopefully).

@booleanbetrayal

This comment has been minimized.

Collaborator

booleanbetrayal commented Jul 31, 2015

The PRs are in for ng-token-auth #188 and devise-token-auth (lynndylanhurley/devise_token_auth#323). Please try these branches out and let us know if there are any issues in implementation. Will merge soon if no major issues are found!

@jackcruz

This comment has been minimized.

jackcruz commented Aug 23, 2015

I'm using this new version and all goes fine, but I'm not able to get the user details by listening to the 'auth:login-success' event on my controller in my ionic app.

This is what I have in my controller:

$rootScope.$on('auth:login-success', function(ev, user) {
alert('Welcome ', user.email);
});

Any thoughts?

@dtelaroli

This comment has been minimized.

dtelaroli commented Aug 23, 2015

I used it, it works, but not persist the session in the ionic application (InAppBrowser).
Maybe the cookies/session it's not setted corretly.

Can you create a one app exemple to test?

The log error

D/CordovaLog( 3506): file:///android_asset/www/lib/ionic/js/ionic.bundle.js: Line 19387 : TypeError: Cannot read property 'config' of undefined
D/CordovaLog( 3506):     at file:///android_asset/www/lib/ng-token-auth/dist/ng-token-auth.js:750:25
D/CordovaLog( 3506):     at Object.invoke (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:11994:17)
D/CordovaLog( 3506):     at response (file:///android_asset/www/lib/ng-token-auth/dist/ng-token-auth.js:748:23)
D/CordovaLog( 3506):     at processQueue (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20962:27)
D/CordovaLog( 3506):     at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20978:27
D/CordovaLog( 3506):     at Scope.$eval (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22178:28)
D/CordovaLog( 3506):     at Scope.$digest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21994:31)
D/CordovaLog( 3506):     at Scope.$apply (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22282:24)
D/CordovaLog( 3506):     at done (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17439:47)
D/CordovaLog( 3506):     at completeRequest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17629:7)
I/chromium( 3506): [INFO:CONSOLE(19387)] "TypeError: Cannot read property 'config' of undefined
I/chromium( 3506):     at file:///android_asset/www/lib/ng-token-auth/dist/ng-token-auth.js:750:25
I/chromium( 3506):     at Object.invoke (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:11994:17)
I/chromium( 3506):     at response (file:///android_asset/www/lib/ng-token-auth/dist/ng-token-auth.js:748:23)
I/chromium( 3506):     at processQueue (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20962:27)
I/chromium( 3506):     at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20978:27
I/chromium( 3506):     at Scope.$eval (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22178:28)
I/chromium( 3506):     at Scope.$digest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21994:31)
I/chromium( 3506):     at Scope.$apply (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22282:24)
I/chromium( 3506):     at done (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17439:47)
I/chromium( 3506):     at completeRequest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17629:7)", source: file:///android_asset/www/lib/ionic/js/ionic.bundle.js (19387)
D/CordovaLog( 3506): file:///android_asset/www/lib/ionic/js/ionic.bundle.js: Line 19387 : TypeError: Cannot call method 'join' of undefined
D/CordovaLog( 3506):     at file:///android_asset/www/js/interceptor.js:49:24
D/CordovaLog( 3506):     at Scope.$emit (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22423:33)
D/CordovaLog( 3506):     at self.error (file:///android_asset/www/js/controllers.js:195:14)
D/CordovaLog( 3506):     at processQueue (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20962:27)
D/CordovaLog( 3506):     at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20978:27
D/CordovaLog( 3506):     at Scope.$eval (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22178:28)
D/CordovaLog( 3506):     at Scope.$digest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21994:31)
D/CordovaLog( 3506):     at Scope.$apply (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22282:24)
D/CordovaLog( 3506):     at done (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17439:47)
D/CordovaLog( 3506):     at completeRequest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17629:7)
I/chromium( 3506): [INFO:CONSOLE(19387)] "TypeError: Cannot call method 'join' of undefined
I/chromium( 3506):     at file:///android_asset/www/js/interceptor.js:49:24
I/chromium( 3506):     at Scope.$emit (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22423:33)
I/chromium( 3506):     at self.error (file:///android_asset/www/js/controllers.js:195:14)
I/chromium( 3506):     at processQueue (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20962:27)
I/chromium( 3506):     at file:///android_asset/www/lib/ionic/js/ionic.bundle.js:20978:27
I/chromium( 3506):     at Scope.$eval (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22178:28)
I/chromium( 3506):     at Scope.$digest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:21994:31)
I/chromium( 3506):     at Scope.$apply (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:22282:24)
I/chromium( 3506):     at done (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17439:47)
I/chromium( 3506):     at completeRequest (file:///android_asset/www/lib/ionic/js/ionic.bundle.js:17629:7)", source: file:///android_asset/www/lib/ionic/js/ionic.bundle.js (19387)
@nbrustein

This comment has been minimized.

Contributor

nbrustein commented Aug 24, 2015

@jackcruz I created an issue for login-success bug: #198

If you read that issue, I mention a possible workaround with the auth:validation-success event, but that event also gets fired in instances other that login, so it might not work for you.

@abhayastudios

This comment has been minimized.

abhayastudios commented Sep 6, 2015

@dtelaroli did you get it to work in ionic? I have a similar issue where I see the ionic app gets the data from the InAppBrowser, but subsequent request to my api don't contain the required headers like client and access-token. I created issue #208 for it.

@angelxmoreno

This comment has been minimized.

Contributor

angelxmoreno commented Sep 29, 2015

@Liampronan you rock! 👍 $auth.initDfd(); was the missing piece to my puzzle. @dtelaroli @rajaaa92 did you ever get it to work? Once enough of us get it to work I would like for us to create a wiki on how to get this done. ng-token-auth + Ionic is pretty awesome

@dtelaroli

This comment has been minimized.

dtelaroli commented Sep 29, 2015

For me it's working fine now.
I just changed de storage to localStorage.
I recreated the application to clean any problems with api version.
I increased the timeout in the devise-token-auth view too, because I was getting error at onload event.

$authProvider.configure({
      omniauthWindowType: 'inAppBrowser',
      storage: 'localStorage'
});
@angelxmoreno

This comment has been minimized.

Contributor

angelxmoreno commented Sep 29, 2015

@dtelaroli omniauthWindowType: 'inAppBrowser', ? I don't know how I missed that! I will attempted to use that in place of my custom flow. Currently, I am building a base64 string on the backend ( nodejs ) and using some custom code to access that using inAppBrowser's events. Would be pretty awesome if I can keep most of the flow the same for Web+Mobile.

@dtelaroli

This comment has been minimized.

dtelaroli commented Sep 30, 2015

@angelxmoreno You can use like that:

var isMob = window.cordova !== undefined;
$authProvider.configure({
      omniauthWindowType: isMob ? 'inAppBrowser' : 'newWindow',
      storage: isMob ? 'localStorage' : 'cookies'
});
@cannahum

This comment has been minimized.

cannahum commented May 13, 2016

Hey everybody,

I had this figured out a few months ago and I hadn't touched my project in a while. Now I'm coming back to it and I'm getting this problem again. I have the $scope.authenticate running, and Google or Facebook approving the authentication. When the inappbrowser disappears, the app gets stuck in the same spot, with the ionicLoading animation going on.

I got rid of the ionicLoading animation, and the state still remains unchanged. I'm trying to read logs from $rootScope.$on('$stateChangeError', etc...) and I'm not even getting there. I think the stateChange is frozen after the inappbrowser disappears. Here's some code that I have:

$authProvider.configure({ apiUrl: ApiEndpoint.url, forceHardRedirect: true, omniauthWindowType: window.cordova == undefined ? 'newWindow' : 'inAppBrowser', storage: window.cordova == undefined ? 'cookies' : 'localStorage', authProviderPaths: { facebook: '/auth/facebook', google: '/auth/google_oauth2' }

$scope.authenticate = function(thing) { $auth.authenticate(thing) .then(function(resp) { $ionicHistory.nextViewOptions({ disableBack: true }); $state.go('app.viewer.list'); }) .catch(function(resp) { console.log(resp); $state.go('pre.user'); }) };

The app initiates the switch to $state.go('app.viewer.list'). I can read a console output from $rootScope.onStateChangeStart. But nothing else happens - I can't read logs from $rootScope.onStateChangeError, or $rootScope.onStateChangeSuccess, or anything from the controllers.

Any ideas? or is anybody else getting this error after updating stuff again?

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment