After login sometimes white stage, sometimes working?


#1

Hi guys,

I am still new to this all and work on my first app right now. I was pretty happy until I discovered a strange problem for me and I try since 2 days to solve. I have a pretty simple setup and on my first screen I have a login form. The form post to my php backend and gets some user data back.

I can see that all works fine in log and I get as expected all my data. At this point I don’t do anything else and once I got the data back I simple forward to another stage with the user profile.

To do that I use simple $state.go('app.profile'); after successful receiving the user infos.

The strange thing now is that in 90% of the logins this works perfect and my profile opens BUT in about 10-20% of the time the stage keeps white without any error or any visible wrong in my log or terminal etc. all looks perfect but the stage keeps white. I always use the same user data as well. If I hit now the reload in my browser the stage opens normal as well.

My problem is that I not even know how I would debug this since there are no errors. Also I need to say that the user profile page contains nothing right now and is a static page. this view dont use any real data yet.

Why this sometimes work and sometimes not?
I would be happy about any help I can get in this case, I am exhausted in testing but still happen again and again.

thanx


#2

Based on my understanding, I believe you are getting some data before going to next screen.

If that is the workflow.

I believe you need to implement “promise” to get the data and navigate to next page when the data is successfully retrieved.

In other words to confirm this the the issue. Set some timeout for state.go. I believe it will work

Thanks,
Surendher


#3

Hi and thx for your reply.

I already use promise in my http request and I see in my console that the data was already received. Once I get the data I also first popup a alert message with the success message and only AFTER that the user can click at the button to continue which trigger the state.go … this works most of the time but for some reason not always.

How ever I see in my console (and always look for) that the http request is successful finished.
Either way i test with the timeout now to make sure I am not stupid…


#4

This is basically the way how I do my http request and how I continue if result was as expected. I deleted some lines in the middle to show this here better but the main function is as shown here. You see in the alert popup that I only move on with state.go one the data is in and the user clicked the ok button as well. As far as I understand I did all correct with the promises but I am not sure… (noob)

	// prepare http request
        var http_req = {
        method: 'POST',
        url: 'https://www.mydomain/json_mobile_login.php',
        data: { KEY0: user_phonenumber, KEY1: user_pin }
        };
        
        // do the request and check the results
        $http(http_req).then(function mySucces(response) {
	    
        if (response.data.TOKEN == 'MISSMATCH' || response.data.TOKEN == 'NOMATCH' || response.data.TOKEN == 'ERROR') {
    	// we got an error, this number does not exist!
    	// do stuff
 
        } else {

    	// we got a winner
        console.log('SUCCESS:' + response.data[0].TOKEN);
        
        // Inform the user that all went well
        $scope.showAlert = function() {
          var alertPopup = $ionicPopup.alert({
            title: 'Sucesso <i class="ion-checkmark-circled"></i>',
            template: '<p>Bem vindo, ' + response.data[0].FULLNAME + '</p>',
          });
       
          alertPopup.then(function(res) {
            $state.go('app.noticias');  <-- The moment where things to wrong sometimes!
          });
        };

       $scope.showAlert();

    }
    
    }, function myError(response) {
        console.log('URL ERROR');
    });

#5

White screens of death use to be caused by by (broken/unsatisfied) promises in the ui-router resolve statement. UI-router shouts its complaints via $rootScope which is not very friendly. I have found a magical LOC (thank you SO) that let you know if the router is not happy. Put this line into the .run() statement of your app.
$rootScope.$on("$stateChangeError", console.log.bind(console));

Dont ask me why I still have problem to believe this hacky way of binding something to the console really works.


#6

Hi @adyba,

Thanks for your tip. I did include your code in my run statement but still get no error. I also get the same strange situation now in another link (logout) which not even call any http or other function and still get the white page without error. A simple hit on browser reload does show the page normal. I am starting to wonder if this is a browser issue and not ionic issue. Tomorrow I test build my android and ios apps and test on my devices if this happen as well or if this is only inside my browser for some reason.

thx