InAppBrowser/Auth0 login getting stuck at window

ionic-v1
1

I’m using Auth0 for login. When I use ionic serve in the browser, the login functions work just fine. When I’m emulating, I’m able to successfully login (checked auth0 logs) but the InAppBrowser is just a white page with ‘OK’ at the top right . iOS image

2

Do you mind sharing some code so that we can see what the issue could be?

3

Absolutely.

Login controller:

.controller('LoginCtrl', function($scope, auth, $state, store, $http) {
  auth.signin({
    closable: false,
    // This asks for the refresh token
    // So that the user never has to log in again
    authParams: {
      scope: 'openid offline_access'
    }
  }, function(profile, idToken, accessToken, state, refreshToken) {
    store.set('profile', profile);
    store.set('token', idToken);
    store.set('refreshToken', refreshToken);
    $state.go('tab.dash');
    $http.post('http://localhost:3000/users', store.inMemoryCache.profile).then(function(response){
      //note to store this response in a user service
    });
  }, function(error) {
    console.log("There was an error logging in", error);
  });
})

app.js

angular.module('starter', ['ionic',
  'starter.controllers',
  'starter.services',
  'auth0',
  'angular-storage',
  'ngCordova',
  'angular-jwt'])



.run(function($ionicPlatform) {
  $ionicPlatform.ready(function() {
    // Hide the accessory bar by default (remove this to show the accessory bar above the keyboard
    // for form inputs)
    if(window.cordova && window.cordova.plugins.Keyboard) {
      cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
    }
    if(window.StatusBar) {
      // org.apache.cordova.statusbar required
      StatusBar.styleDefault();
    }
  });
})


.config(function($stateProvider, $urlRouterProvider, authProvider, $httpProvider,
  jwtInterceptorProvider) {

  $stateProvider

  .state('login', {
    url: '/login',
    templateUrl: 'templates/login.html',
    controller: 'LoginCtrl',
  })

  .state('tab.development', {
    url: '/development',
    views: {
      'tab-development': {
        templateUrl: 'templates/features/tab-development.html',
        controller: 'UserCtrl',
        data: {
          requiresLogin: true
        }
      }
    }
  });

  // Configure Auth0
  authProvider.init({
    domain: AUTH0_DOMAIN,
    clientID: AUTH0_CLIENT_ID,
    loginState: 'login'
  });

  // if none of the above states are matched, use this as the fallback
  $urlRouterProvider.otherwise('/tab/dash');

  jwtInterceptorProvider.tokenGetter = function(store, jwtHelper, auth) {
    var idToken = store.get('token');
    var refreshToken = store.get('refreshToken');
    if (!idToken || !refreshToken) {
      return null;
    }
    if (jwtHelper.isTokenExpired(idToken)) {
      return auth.refreshIdToken(refreshToken).then(function(idToken) {
        store.set('token', idToken);
        return idToken;
      });
    } else {
      return idToken;
    }
  }

  $httpProvider.interceptors.push('jwtInterceptor');
}).run(function($rootScope, auth, store) {
  $rootScope.$on('$locationChangeStart', function() {
    if (!auth.isAuthenticated) {
      var token = store.get('token');
      if (token) {
        auth.authenticate(store.get('profile'), token);
      }
    }

  });
});
4

Anything else I can pass along?

5

Solved it, my AJAX request was that last thing happening during login hence seeing the ‘OK’ from the http response. Changing the state should have been the last thing to happen>

$http.post('http://localhost:3000/users', store.inMemoryCache.profile).then(function(response){
      //STORE  response.data SOMEWHERE, it's the USER OBJECT, BRO
    })
    $state.go('tab.dash'); //THIS NEEDED TO BE LAST
1 Like
6

Hey, didn’t see this until this morning (EST)

Glad to see you got this solved.

7

As mentioned here : https://auth0.com/docs/native-platforms/ionic (in the last paragraph)
If the authentication finishes with an “OK” page, it means that you have to install cordova InAppBrowser.
This fixed the problem for me.

8

I’m getting same problem with Ionic2.

1 Like
9

I’m also getting same problem with Ionic2.

1 Like
10

I dont get inAppBrowser to open

11

I’ve been fighting with a similar issue. I actually had InAppBrowser installed per auth0’s documentation, but, on android , the social login buttons would spin and never go to the google/facebook logins.

I actually just removed InAppBrowser and found it would then take me to the login pages, let me sign in, and dump me at the OK screen.

Does anybody have any idea what’s causing this behavior?