How to get the result from provider

Ionic Framework ionic-v3
1

I’m working on authentification part in ionic application. The mobile application is connected to spring boot application witch contains login function and return a list of diplomas of the user. I will use this information in the mobile application, so I have to check that the provider function return a list witch is not emplty. The provider function works perfectly, but I didn’t know how to return the list in the component. This is the loginProvider:

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';

@Injectable()
export class LoginProvider {

  constructor(public http: HttpClient) { }

  public url = "http://localhost:8080/";

  login(user: any) {
    return this.http.post(this.url+'user/loginEmp',user)
        .subscribe((res: Response ) => console.log(res));
    }
}

this is the loginPage :

import { Component } from ‘@angular/core’;

import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { IonicPage, NavController, NavParams } from 'ionic-angular';
import { TabsPage } from '../tabs/tabs';
import { Md5 } from 'ts-md5/dist/md5';
import { LoginProvider } from '../../providers/login/login';
import 'rxjs/add/operator/toPromise';


@IonicPage()
@Component({
  selector: 'page-login',
  templateUrl: 'login.html',
})
export class LoginPage {

  authForm: FormGroup;
  showError: boolean = false;
  loginError: string;

  constructor(public nav: NavController,
              public navParams: NavParams, 
              public formBuilder: FormBuilder,
              private loginProvider : LoginProvider) {

      this.authForm = formBuilder.group({
        'email': ['', Validators.compose([Validators.required,Validators.email])],
        'password': ['', Validators.compose([Validators.required, Validators.minLength(6)])]
      });
  }

  onSubmit(login:any) {
    let user: any = {
      "email": login['email'].trim(),
      "password" : Md5.hashStr(login['password']).toString()
    };
    this.loginProvider.login(user).subscribe((response)=> {
      console.log(response)
      if(!this.isEmpty(response)){
          sessionStorage.setItem("CurrentUser", JSON.stringify(response));
          this.nav.push(TabsPage);   
      }else{
          this.showError = true;
      }
    });
  }
  // this function return true if the object in argument is empty
  isEmpty(obj) {
    for(var key in obj) {
        if(obj.hasOwnProperty(key))
            return false;
    }
    return true;
  }
}

In the console I get the list, but “console.log(response)” displays “undefined”

2

I haven’t looked at this in detail, but in your provider you are subscribing to the observable you are attempting to return:

  login(user: any) {
    return this.http.post(this.url+'user/loginEmp',user)
        .subscribe((res: Response ) => console.log(res));
    }

and then you try to subscribe to that:

this.loginProvider.login(user).subscribe((response)=> {

You should modify the method in your provider:

  login(user: any) {
    return this.http.post(this.url+'user/loginEmp',user);
  }

This may not be the only issue, but that is one thing that stands out.

3

MD5 is a terrible choice for password hashing for many reasons, the primary one being that it runs too quickly. Use something like bcrypt instead.