Setroot doesn't work after log in

Ionic Framework ionic-v3
1

Hello,

I’m trying to do an authentication with Azure, it works so far but when I try to set the root page after the user logged in, it doesn’t work and shows me the LoginPage instead of the HomePage.

Here is my login.ts login() function :

login() {
        let ctrl = this;
        let authContext = new Microsoft.ADAL.AuthenticationContext("https://login.microsoftonline.com/common");

        authContext.acquireTokenAsync("https://graph.microsoft.com",
            "theid",
            "http://localhost:8100")

            .then(function (result: Microsoft.ADAL.AuthenticationResult) {
                ctrl.zone.run(() => {
                    ctrl.isAuthenticated = true;
                     this.navCtrl.setRoot(HomePage)
                    this.navCtrl.popToRoot();

Could someone help me please ? Thank you

2

just remove this line and then try again

3

Hello thanks for your answer, it still doesn’t work :frowning:

4

have you find any error in console or anything ?

5

Actually I cannot test in the console cause when I do it says ‘Microsoft is not defined’. It only works on the emulator.

The strange thing is that it works when I put it at the top of the login() function, but it is not what I want cause I want to know if the user is authenticated or not

6

is this plugin you use ?

7

Yes it’s this one :slight_smile:

8

can you show you full ts file code so i can try to understand where is problem.

and first i want to know why you use ctrl.zone.run() ?

9

I followed a tutorial on Microsoft website, I believe he uses zone to update the view based on the authentication success but I’m not sure…


import { Component, ViewChild, NgZone } from '@angular/core';
import { App, NavController } from 'ionic-angular';
import { Http, Headers } from '@angular/http';
import { Platform } from 'ionic-angular';
import { HomePage } from '../home/home';


@Component({
    selector: 'page-login',
    templateUrl: 'login.html'
})
export class LoginPage {
    items: Array<any> = [];
    isAuthenticated: boolean = false;

    constructor(private navCtrl: NavController, private zone: NgZone, private http: Http, public appCtrl: App, private platform: Platform) {

    }

    login() {
        if(this.isAuthenticated) {
            this.navCtrl.setRoot(HomePage);
        }
        let ctrl = this;
        let authContext = new Microsoft.ADAL.AuthenticationContext("https://login.microsoftonline.com/common");

        authContext.acquireTokenSilentAsync("https://graph.microsoft.com",
            "theId",
            "http://localhost:8100")

            .then(function (result: Microsoft.ADAL.AuthenticationResult) {
                ctrl.zone.run(() => {
                    ctrl.isAuthenticated = true;
                    this.navCtrl.setRoot(HomePage)

                    ctrl.http.get("https://graph.microsoft.com/v1.0/me/drive/root/children", {
                        headers: new Headers({ "Authorization": "Bearer " + result.accessToken })
                    }).subscribe(res => {
                        if (res.status == 200) {
                            ctrl.items = res.json().value;
                        } else {
                            console.log("no");
                        }
                    });
                });
            }, function (err) {
                console.log(err)
            }
        )
    }
10

i suggest you to implement code according to ionic doc.because i implemented it one of my project and it run perfectly :ok_hand:.

1 Like
11

Man… I suggest I learn to read… Thank you very very very very much

1 Like