0

Atualmente estou fazendo a segurança da minhas rotas no ngOnInit, se tiver no localStorage a chave token, então ele permanece na rota Home (Minha rota root é a home). Caso contrário, ele redireciona para a tela de login. O problema é que tem um delay, a tela Home é mostrada durante alguns milisegundos e depois troca para a tela de Login.

Já tentei no constructor/ngOnInit e também no appcomponen.ts assim que a plataforma é pronta, porém dessa maneira eu continuo tendo uma "piscada" na tela.

Alguém tem alguma solução para isso?

3

2 Respostas 2

1

[EDITADO] - Fiz em ionic 3 para voce. Faz isso no seu app.component.ts

Eu estou usando Ionic 4, no meu arquivo app-routing.module.ts eu uso em Guarda de Rotas para verificar se o usuário tem alguma informação salva no local storage, caso tenha eu redireciono para a home ou se não tiver eu mando ele para login. Segue a logica.

import { Component, ViewChild } from '@angular/core';
import { Platform, Nav, ToastController } from 'ionic-angular';
import { StatusBar } from '@ionic-native/status-bar';
import { SplashScreen } from '@ionic-native/splash-screen';
import { SharedData } from '../providers/shared-data';
import { ClientStorage } from '../database/client-storage';

@Component({
    templateUrl: 'app.html'
})
export class MyApp {
    @ViewChild(Nav) nav: Nav;
    rootPage: any;

    constructor(
        public platform: Platform,
        public statusBar: StatusBar,
        public splashScreen: SplashScreen,
        public sharedData: SharedData,
        private clientStorage: ClientStorage,
    ) {
            this.clientStorage.buscaRealizada.then(() => {
                statusBar.styleDefault();
                splashScreen.hide();
                if (this.clientStorage.data.UserId)
                    this.rootPage = 'HomePage';
                else
                    this.rootPage = 'LoginPage';
            });
        });
    }
}


4
  • a pergunta era referente ao ionic v3 28/08/2019 às 16:10
  • Olha esse link então, é em Ionic 2 poré, vc consegue adaptar para o 3 de uma forma mais fácil -> medium.com/lfdev-blog/guarda-de-rota-em-ionic-2-1dd3451839b3
    – Jeferson
    28/08/2019 às 17:26
  • O certa mesmo, e você fazer essa parte de acesso a rotas no app.component.ts, pq antes de iniciar o app ele ja vai mapear isso e redirecionar para local certo. E dai não vai ter esse delay
    – Jeferson
    28/08/2019 às 17:40
  • Editado para Ionic 3
    – Jeferson
    28/08/2019 às 20:08
0

Sim, existe outra solução melhor. Você pode dar uma lida nos Lifecycle events na documentação do IONIC. No seu caso, vc pode usar o ionViewCanEnter. Antes da página ser criada, ele vai verificar sua lógica. Se o usuario tiver acesso, sua logica retorna true e cria a pagina a ser acessada, se não retorna false.

Veja este tutorial

import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';

@Component({
  selector: 'page-a',
  templateUrl: 'a.html'
})
export class PageA{

  constructor(public navCtrl: NavController) {}

  ionViewCanEnter() {
    \\sua logica aqui. retorne true ou false.
  }
}
1
  • Mesmo usando ionViewCanEnter a tela ainda aparece, mesmo que em milisegundos. 23/08/2018 às 12:49

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .