1
I have the class ts Authprovider
import { Injectable } from '@angular/core';
import { Http, Response, Headers } from '@angular/http';
import 'rxjs/add/operator/map';
@Injectable()
export class AuthProvider {
baseUrl:string = 'http://tutaapp.azurewebsites.net/';
constructor(public http: Http) {
}
createAuthorizationHeader(headers: Headers){
headers.append('Authorization', window.localStorage.getItem('token'));
}
private(){
let headers = new Headers();
this.createAuthorizationHeader(headers);
return this.http.get(this.baseUrl+'token', {
headers: headers
}).map(res => res.json());
}
login(data){
return this.http.post(this.baseUrl+'token', data)
.map(this.extractData);
}
isLogged(){
if(window.localStorage.getItem('Token')){
return true
}else{
return false;
}
}
logout(){
window.localStorage.removeItem('Token');
return true;
}
private extractData(res: Response){
let body = res.json();
if(body.succes === true){
window.localStorage.setItem('Token', body.Token);
};
return body || {};
}
}
and the login class ts
import { Component } from '@angular/core';
import { NavController, NavParams, AlertController } from 'ionic-angular';
import { HomePage } from '../home/home';
import { AuthProvider } from '../../providers/auth/auth';
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
constructor(
public navCtrl: NavController,
private auth: AuthProvider,
public alertCrtl: AlertController
) {}
login(FormLogin){
this.auth.login(FormLogin.value).subscribe(data => {
if(data.succes === true){
this.navCtrl.setRoot(HomePage);
}else{
FormLogin.password = '';
let alert = this.alertCrtl.create({
title: 'Login Failed',
subTitle: data.message,
buttons: ['OK']
})
alert.present();
}
})
}
}
and html
<!--
Generated template for the LoginPage page.
See http://ionicframework.com/docs/components/#navigation for more info on
Ionic pages and navigation.
-->
<ion-header>
<ion-navbar>
<ion-title>login</ion-title>
</ion-navbar>
</ion-header>
<ion-content>
<form #FormLogin="ngForm" (ngSubmit)="login(FormLogin)">
<ion-item>
<ion-label floating>Username</ion-label>
<ion-input [(ngModel)]="FormLogin.username" name="username" type="text" required></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Password</ion-label>
<ion-input [(ngModel)]="FormLogin.password" name="password" type="password" required></ion-input>
</ion-item>
<ion-item>
<button [disabled]="!FormLogin.form.valid" type="submit" full ion-button>Login</button>
</ion-item>
</form>
</ion-content>
giving the following error
"{"error":"unsupported_grant_type"}"