我想知道如何在ionic 4中保持用户登录到应用程序中，我做了一些工作，如存储的凭证，如电子邮件和交叉检查用户在使用api和重定向到菜单页面，但我得到的登录页面几秒钟，然后重定向到菜单页面如何解决这个问题，其实它应该直接打开菜单页面。
app-routing.modules.ts
import { NgModule } from '@angular/core';
import { PreloadAllModules, RouterModule, Routes } from '@angular/router';
import { AuthGuard } from './auth.guard';
const routes: Routes = [
{
path: '',
redirectTo: 'login',
pathMatch: 'full'
},
{
path: 'home',
loadChildren: () => import('./home/home.module').then(m => m.HomePageModule)
},
{
path: 'assign',
loadChildren: () => import('./assign/assign.module').then( m => m.AssignPageModule)
},
{
path: 'login',
loadChildren: () => import('./login/login.module').then( m => m.LoginPageModule)
},
{
path: 'register',
loadChildren: () => import('./register/register.module').then( m => m.RegisterPageModule)
},
{
path: 'view',
loadChildren: () => import('./view/view.module').then( m => m.ViewPageModule)
},
{
path: 'view-routes',
loadChildren: () => import('./view-routes/view-routes.module').then( m => m.ViewRoutesPageModule)
},
{
path: 'view-orders',
loadChildren: () => import('./view-orders/view-orders.module').then( m => m.ViewOrdersPageModule)
},
{
path: 'view-customers',
loadChildren: () => import('./view-customers/view-customers.module').then( m => m.ViewCustomersPageModule)
},
{
path: 'view-leads',
loadChildren: () => import('./view-leads/view-leads.module').then( m => m.ViewLeadsPageModule)
},
{
path: 'view-team',
loadChildren: () => import('./view-team/view-team.module').then( m => m.ViewTeamPageModule)
},
{
path: 'view-channel-partners',
loadChildren: () => import('./view-channel-partners/view-channel-partners.module').then( m => m.ViewChannelPartnersPageModule)
},
{
path: 'my-profile',
loadChildren: () => import('./my-profile/my-profile.module').then( m => m.MyProfilePageModule)
},
{
path: 'customer-details',
loadChildren: () => import('./customer-details/customer-details.module').then( m => m.CustomerDetailsPageModule)
},
{
path: 'add-customer',
loadChildren: () => import('./add-customer/add-customer.module').then( m => m.AddCustomerPageModule)
},
{
path: 'leadetails',
loadChildren: () => import('./leadetails/leadetails.module').then( m => m.LeadetailsPageModule)
},
{
path: 'updatedetails',
loadChildren: () => import('./updatedetails/updatedetails.module').then( m => m.UpdatedetailsPageModule)
},
{
path: 'orderdetails',
loadChildren: () => import('./orderdetails/orderdetails.module').then( m => m.OrderdetailsPageModule)
},
{
path: 'search',
loadChildren: () => import('./search/search.module').then( m => m.SearchPageModule)
},
{
path: 'otp',
loadChildren: () => import('./otp/otp.module').then( m => m.OtpPageModule)
},
{
path: 'reminders',
loadChildren: () => import('./reminders/reminders.module').then( m => m.RemindersPageModule)
},
{
path: 'create-lead',
loadChildren: () => import('./create-lead/create-lead.module').then( m => m.CreateLeadPageModule)
},
{
path: 'add-update',
loadChildren: () => import('./add-update/add-update.module').then( m => m.AddUpdatePageModule)
},
{
path: 'add-order',
loadChildren: () => import('./add-order/add-order.module').then( m => m.AddOrderPageModule)
},
{
path: 'about-customer',
loadChildren: () => import('./about-customer/about-customer.module').then( m => m.AboutCustomerPageModule)
},
{
path: 'Orders',
loadChildren: () => import('./orders/orders.module').then( m => m.OrdersPageModule)
},
{
path: 'billdetails',
loadChildren: () => import('./billdetails/billdetails.module').then( m => m.BilldetailsPageModule)
},
{
path: 'cust-det',
loadChildren: () => import('./cust-det/cust-det.module').then( m => m.CustDetPageModule)
},
{
path: 'logout',
loadChildren: () => import('./logout/logout.module').then( m => m.LogoutPageModule)
}
];
@NgModule({
imports: [
RouterModule.forRoot(routes, { preloadingStrategy: PreloadAllModules })
],
exports: [RouterModule]
})
export class AppRoutingModule {}服务
this.http.get('https://www.url.com/App_1.3.5/login.php?compid=' + Companyid + '&username=' + Userid + '&password=' + Password + '&deviceID=' + deviceid + '&latitude=' + lat + '&longitude=' + lot + '&version='+ this.version +'&brand='+ this.manufacturer +'&model='+ this.model +'').subscribe(data => {
this.response = data;
this.authenticationState.next(true);
this.displayUsername();
this.userid = Userid;
console.log(data);
});
******************************************************************
async displayUsername() {
// console.log(this.response.compid, this.response.role);
const result = this.response.result;
this.compDomain = this.response.compDomain;
if (result === 'success') {
this.set('ocompid', this.response.compid);
this.set('ocompname', this.response.comp_name);
this.set('orole', this.response.role);
this.set('ocity', this.response.city);
this.set('ocompDomain', this.response.compDomain);
this.set('ocomp_type', this.response.comp_type);
this.router.navigateByUrl('/view-customers');// giving access to menu page
} else {
const toast = await this.toastController.create({
message: result,
position: 'bottom',
duration: 1500
});
toast.present();
// alert(result);
}这也是交叉检查后重定向到菜单页的服务。
if(this.scmpid != undefined && this.suserid != undefined ) {
this.http.get('https://www.url.com/App_1.3.5/Executive/get_executive_status.php?compid='+ this.scmpid +'&username='+ this.suserid +'&appVersion='+ this.appVersion +'&Device_Id='+ this.ud.uuid +'').subscribe(data => {
this.logres = data['result'];
// alert(this.logres);+' '+
if( this.logres == 'success') {
alert('3'+ this.logres);
console.log('success');
this.cmpid = this.scmpid;
this.userid = this.suserid;
this.authenticationState.next(true);
}
});*所以我想到了一个简单的解决方案来解决这个问题*。
所以我隐藏了用户登录时的登录页面内容
登录.html
<ion-content *ngIf='logged == true'>
<img src="" alt="">
<ion-row>
<ion-col>
<img src="assets/img/serviceho.png" alt="" srcset="">
</ion-col>
</ion-row>
</ion-content> 是的，上面的答案根据你的情况起了作用，但一般情况下，你必须使用auth-guard和使用函数。但一般情况下，你必须使用auth-guard，并使用函数 canLoad() 的角度。应称为 ngOnInit() 的应用程序组件