title: Ionic 4 Using MySQL API Authentication Guard Not Working As Expected
body: <p>i am required to make Register And Login process by connecting Ionic 4 to MySQL, the Login and Registration works, but i am having problem on configuring the guard to enable access based on user currently logged in, below is my code at <strong>tabs.router.module.ts</strong> which is the route for first loaded page after user logged in</p>
  
  <pre><code>{
      path: 'profile-qr',
      children: [
          {
          path: '',
          loadChildren: () =&gt;
              import('../profile-qr/profile-qr.module').then(m =&gt; m.ProfileQRPageModule),
          canActivate: [AuthGuard],
          data: {
              role: 'C'
          }
          }
      ]
  },
  </code></pre>
  
  <p>below is my code to store login data in local storage during login process <strong>login.page.ts</strong></p>
  
  <pre><code>  async prosesLogin(){
      if(this.loginForm.value.email != "" &amp;&amp; this.loginForm.value.password != ""){
        let body = {
          email: this.loginForm.value.email,
          password: this.loginForm.value.password,
          action: 'login'
        };
  
        this.postPvdr.postData(body, 'user-api.php').subscribe(async data =&gt;{
  
            if(data.success){
  
              this.storage.set('session_storage', data.result);
  </code></pre>
  
  <p>below is my code at AuthGuard <strong>auth.guard.ts</strong></p>
  
  <pre><code>canActivate(route: ActivatedRouteSnapshot){
      const expectedRole = route.data.role;
  
      this.storage.get('session_storage').then((res)=&gt;{
        if (res == null){
          this.router.navigate([`/home`]);
          return false;
        }else{
          if (expectedRole == res.role) {
            return true;
          } else {
            this.router.navigateByUrl('/login');
            return false;
          }
  
        }
      })
      return false;
  }
  </code></pre>
  
  <p>during login as customer@email.com which have a role of 'C' which is customer, i am unable to access any page which have set canActivate : [AuthGuard]</p>
  
  <p>i have tried to copy other code style, which use Observable and Firebase, but i am unable to do so with MySQL because i do not really understand how to write Observable object.</p>
  
  <p>i have checked on the mysql database and the user role are inserted correctly, there are no problem appear on my VSCode,
  the problem are only at RBAC</p>
  
  <p>kindly guide and explain on how to write code at <strong>auth.guard.ts</strong></p>