Ionic framework 登录一次后无法跳过登录页3

我正在用MySQL数据库做一个登录应用。我已经登录，但当我关闭我的应用程序或按下手机的后退按钮时，它会再次从登录页面开始

我试图将登录数据保存在本地存储中，但它不起作用。我一直在网上搜索一些答案，但似乎找不到解决办法

下面是我的代码

login.ts

signIn(page) {
if(this.username.value==""){
  let alert = this.alertCtrl.create({

    title:"ATTENTION",

    subTitle:"Username field is empty",

    buttons: ['OK']

    });

    alert.present();
}else if(this.password.value=="") {
  let alert = this.alertCtrl.create({

    title:"ATTENTION",

    subTitle:"Password field is empty",

    buttons: ['OK']

    });

    alert.present();
}
else {
  var headers = new Headers();
  headers.append("Accept", 'application/json');

  headers.append('Content-Type', 'application/json' );

  let options = new RequestOptions({ headers: headers });

  let data = {

    username: this.username.value,
    password: this.password.value

    };
  let loader = this.loading.create({
    content: 'Processing please wait…',    
    });
  loader.present().then(()=>{
    this.http.post('http://mybusket.com/webapi/carapi/logincheck.php',data,options)
    .map(res=>res.json())
    .subscribe(res=>{
      console.log(res)
      loader.dismiss()
      if(res>0) {
        localStorage.setItem('response',JSON.stringify(res));
          console.log(JSON.parse(localStorage.getItem('response')));


          this.navCtrl.push(page)
      }
      else{
        let alert = this.alertCtrl.create({

          title:"ERROR",

          subTitle:"Your Login Username or Password is invalid",

          buttons: ['OK']

          });

          alert.present();
      }
    });
  });    
}
}

export class MenuPage {

rootPage = 'Welcome';
pages = [
{ title: 'Home', component: 'Welcome' },
{ title: 'Qr Code', component: 'QrPage' },
  { title: 'Logout', component: 'LogoutPage' }
];

@ViewChild('content') nav: NavController;

constructor(public navCtrl: NavController, public navParams: NavParams) 
{
}

ionViewDidLoad() {
console.log('ionViewDidLoad MenuPage');
}

 openPage(page) {
// Reset the content nav to have just this page
// we wouldn't want the back button to show in this scenario
this.nav.setRoot(page.component);
}

}

当我点击按钮时，登录功能运行并导航到连接到欢迎页面的菜单页面

菜单.ts

signIn(page) {
if(this.username.value==""){
  let alert = this.alertCtrl.create({

    title:"ATTENTION",

    subTitle:"Username field is empty",

    buttons: ['OK']

    });

    alert.present();
}else if(this.password.value=="") {
  let alert = this.alertCtrl.create({

    title:"ATTENTION",

    subTitle:"Password field is empty",

    buttons: ['OK']

    });

    alert.present();
}
else {
  var headers = new Headers();
  headers.append("Accept", 'application/json');

  headers.append('Content-Type', 'application/json' );

  let options = new RequestOptions({ headers: headers });

  let data = {

    username: this.username.value,
    password: this.password.value

    };
  let loader = this.loading.create({
    content: 'Processing please wait…',    
    });
  loader.present().then(()=>{
    this.http.post('http://mybusket.com/webapi/carapi/logincheck.php',data,options)
    .map(res=>res.json())
    .subscribe(res=>{
      console.log(res)
      loader.dismiss()
      if(res>0) {
        localStorage.setItem('response',JSON.stringify(res));
          console.log(JSON.parse(localStorage.getItem('response')));


          this.navCtrl.push(page)
      }
      else{
        let alert = this.alertCtrl.create({

          title:"ERROR",

          subTitle:"Your Login Username or Password is invalid",

          buttons: ['OK']

          });

          alert.present();
      }
    });
  });    
}
}

export class MenuPage {

rootPage = 'Welcome';
pages = [
{ title: 'Home', component: 'Welcome' },
{ title: 'Qr Code', component: 'QrPage' },
  { title: 'Logout', component: 'LogoutPage' }
];

@ViewChild('content') nav: NavController;

constructor(public navCtrl: NavController, public navParams: NavParams) 
{
}

ionViewDidLoad() {
console.log('ionViewDidLoad MenuPage');
}

 openPage(page) {
// Reset the content nav to have just this page
// we wouldn't want the back button to show in this scenario
this.nav.setRoot(page.component);
}

}

我正在处理离子3中的延迟加载

---

我希望这样，当我登录应用程序时，当我按下设备应用程序的后退按钮关闭时，也不需要再次登录

登录时，只将响应保存到本地存储中。如果您已登录或未登录，则没有检查程序。因此，要保持登录应用程序，您需要有一个检查程序

如果成功登录，请在本地存储中创建项目。例如，将项目

isLoggedIn

设置为

true

localStorage.setItem('isLoggedIn',true);

退出并重新启动应用程序时，您要做的第一件事是从本地存储中检查

isLoggedIn

。如果为真，则导航到欢迎页面。否则，请转到登录页面

注销时，请确保将

isLoggedIn

更改为false，或将其删除

编辑：

根据您的

rootpage

，您可以在

app.component.ts

中找到整个应用程序。（

rootpage

是打开应用程序时显示的第一个页面）

如果整个应用程序的

rootpage

是您的登录页面， 您的.ts文件应该具有

constructor{

    //check if the isLoggedIn in the local storage exists or is true
    if(localstorage.getItem('isLoggedIn')){

    // if it is true, set the menupage (which is connected to your welcome page) as root. 
        this.navCtrl.setRoot(MenuPage); 
    }

}

另外，在您的登录页面中。在您的

登录（页面）

方法中，调整此选项

if(res>0) {
    localStorage.setItem('response',JSON.stringify(res));
      console.log(JSON.parse(localStorage.getItem('response')));

    // add this
    // set the isLoggedIn to true
    localStorage.setItem('isLoggedin', true);

    this.navCtrl.push(page)
}

---

PS>这在语法上可能不正确，因为我看不到您的全部代码。这仅供参考，如有必要，请调整代码。

我对您的代码不是100%清楚。因此，基本上，当您显示登录页面时，您应该自动检查（例如，在

ionViewDidLoad（）

中），是否有任何有效的登录信息存储在localStorage中，如果是，您可以进入下一页。你在做这样的检查吗？您希望代码在何处标识您的用户以前已登录？如果我正确理解了您的代码，您只需在用户按下按钮后执行此检查。此菜单页已连接到另一页…菜单为“显示侧菜单”。我已将数据存储在本地存储器中，并在下一页打印。但当我关闭应用程序或按“上一步”按钮时，它将再次转到登录页。