Ionic PWA, setRoot()


#1

Hello.

I have a PWA built with Ionic. My login in with Azure AD worked earlier but now, somehow it breaks.

    if (!this.adalservice.userInfo.authenticated) {
      this.adalservice.login();
    }
    else {
    this.initFirebase();
    this.app.getRootNav().setRoot(TabsPage);
    }

I have tried with:

    this.navCtrl.setRoot(TabsPage);

aswell.

That is how my code looks, on web it works great. But on Android, in standalone mode, it does not change the root to TabsPage, it just stays on the same page (LogInPage).

Any ideas on how to fix this?


#2

Probably not related to the navigation itself. Did you see any js error in the console?

Also note, the cache with pwa is powerful, don’t hesitate to try a couple of time to clean cache and retry :wink:


#3

No errors logged. Yeah we tried to clear it a few times, clear & restart device. Nothing worked, but will look into the PWA & Stencil and see if i might swap over to it. :slight_smile:


#4

Keep us posted about your findings, good luck


#5

ps.: not related to your issue, but you know what @enystr, I just lost 15 minutes because of I did forgot to test a nginx change with a blank new cache :smile:


#6

Looks like Azure is not using its callback and authenticating the user.

Used a variable to see if the user was authenticated, always returns false. But it only happens when it is in PWA, browser works fine and returns true…


#7

I remember that in order to implement a valid Facebook login with a PWA I had to remove the hashbang (#) from the URLs (= Ionic 3 routing) otherwise the return URl was wrongly interpreted, maybe that’s your problem too?


#8

Hm, could be the case. Mind sharing some code?


#9

In app.modules set locationStrategy to path

IonicModule.forRoot(MyApp, {
        ...
        locationStrategy: 'path'
    })

WARNING: It may solve your problem but may result in some others, like when a user will refresh (with refresh I mean refresh action of the browser) a page which could end up in an error. I have set my nginx to redirect everything to the root which partially solve this.

NOTE: As far as I understand, due to the introduction of the new routing system in Ionic 4, this won’t be an issue anymore, I think or I hope


#10

Sadly no improvements… Will keep looking for a solution. Its wierd because it worked fine earlier, and we havent touched the login part since…


#11

:frowning:

well I’m a bit out idea too, good luck, keep posted with the solution when you will find it


#12

So i found the missing part, i don’t know why it worked earlier and stopped worked all of a sudden. But i found out that i had been missing out on a few stuff on the AD Config.

const config = {
  instance: 'https://login.microsoftonline.com/', 
  tenant: '*********',
  clientId: '******************',
  popUp: false,
  redirectUri: "****************",
  cacheLocation: 'localStorage',
} 

Using that i managed to get it to work again :) Sorry for the late reply.