mirror of
https://github.com/sensebox/blockly-app
synced 2025-07-03 03:00:23 +02:00
login provider and post request to api for login
This commit is contained in:
parent
5fbd4d1d99
commit
db4d2ffbd5
5 changed files with 114 additions and 35 deletions
|
@ -15,6 +15,7 @@ import { StorageProvider } from '../providers/storage/storage';
|
||||||
import { AddItemPage } from '../pages/add-item/add-item';
|
import { AddItemPage } from '../pages/add-item/add-item';
|
||||||
import { SensorDetailPage } from '../pages/sensor-detail/sensor-detail';
|
import { SensorDetailPage } from '../pages/sensor-detail/sensor-detail';
|
||||||
import { MySenseBoxPage } from '../pages/my-sense-box/my-sense-box';
|
import { MySenseBoxPage } from '../pages/my-sense-box/my-sense-box';
|
||||||
|
import { LoginProvider } from '../providers/LoginProvider/LoginProvider';
|
||||||
|
|
||||||
// For AoT compilation (production builds) we need to have a factory for the loader of translation files.
|
// For AoT compilation (production builds) we need to have a factory for the loader of translation files.
|
||||||
// @TODO: we possibly could optimize this by using a static loader in combination with webpack:
|
// @TODO: we possibly could optimize this by using a static loader in combination with webpack:
|
||||||
|
@ -58,6 +59,7 @@ export function createTranslateLoader(http: HttpClient) {
|
||||||
{provide: ErrorHandler, useClass: IonicErrorHandler},
|
{provide: ErrorHandler, useClass: IonicErrorHandler},
|
||||||
LoggingProvider,
|
LoggingProvider,
|
||||||
StorageProvider,
|
StorageProvider,
|
||||||
|
LoginProvider
|
||||||
]
|
]
|
||||||
})
|
})
|
||||||
export class AppModule {}
|
export class AppModule {}
|
||||||
|
|
|
@ -14,13 +14,14 @@
|
||||||
</ion-grid>
|
</ion-grid>
|
||||||
<ng-template late #nonloading>
|
<ng-template late #nonloading>
|
||||||
<ion-card>
|
<ion-card>
|
||||||
|
<form #form="ngForm" (ngSubmit)="submitLogin(form)">
|
||||||
<ion-grid>
|
<ion-grid>
|
||||||
<ion-row>
|
<ion-row>
|
||||||
<ion-item>
|
<ion-item>
|
||||||
<ion-label>
|
<ion-label>
|
||||||
<ion-icon name="person"></ion-icon>
|
<ion-icon name="person"></ion-icon>
|
||||||
</ion-label>
|
</ion-label>
|
||||||
<ion-input placeholder="userName" [(ngModel)]="userName"></ion-input>
|
<ion-input placeholder="email" name="email" type="email" ngModel required></ion-input>
|
||||||
</ion-item>
|
</ion-item>
|
||||||
</ion-row>
|
</ion-row>
|
||||||
<ion-row>
|
<ion-row>
|
||||||
|
@ -28,7 +29,7 @@
|
||||||
<ion-label>
|
<ion-label>
|
||||||
<ion-icon name="lock"></ion-icon>
|
<ion-icon name="lock"></ion-icon>
|
||||||
</ion-label>
|
</ion-label>
|
||||||
<ion-input placeholder="Password" [(ngModel)]="password"></ion-input>
|
<ion-input name="password" type="password" placeholder="Password" ngModel required></ion-input>
|
||||||
</ion-item>
|
</ion-item>
|
||||||
</ion-row>
|
</ion-row>
|
||||||
<ion-row>
|
<ion-row>
|
||||||
|
@ -36,11 +37,14 @@
|
||||||
</ion-col>
|
</ion-col>
|
||||||
<ion-col col-4>
|
<ion-col col-4>
|
||||||
<ion-item>
|
<ion-item>
|
||||||
<button full ion-button color="secondary" (click)="submitLogin()"><ion-icon name="send"></ion-icon>Login</button>
|
<button full ion-button type="submit" color="secondary">
|
||||||
|
<ion-icon name="send"></ion-icon>Login
|
||||||
|
</button>
|
||||||
</ion-item>
|
</ion-item>
|
||||||
</ion-col>
|
</ion-col>
|
||||||
</ion-row>
|
</ion-row>
|
||||||
</ion-grid>
|
</ion-grid>
|
||||||
|
</form>
|
||||||
</ion-card>
|
</ion-card>
|
||||||
</ng-template>
|
</ng-template>
|
||||||
</ion-content>
|
</ion-content>
|
|
@ -1,6 +1,7 @@
|
||||||
import { Component } from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
import { IonicPage, NavController, NavParams } from 'ionic-angular';
|
import { IonicPage, NavController, NavParams } from 'ionic-angular';
|
||||||
import {MySenseBoxPage} from "../my-sense-box/my-sense-box"
|
import {MySenseBoxPage} from "../my-sense-box/my-sense-box"
|
||||||
|
import { LoginProvider } from "../../providers/LoginProvider/LoginProvider"
|
||||||
/**
|
/**
|
||||||
* Generated class for the LoginPage page.
|
* Generated class for the LoginPage page.
|
||||||
*
|
*
|
||||||
|
@ -16,14 +17,25 @@ import {MySenseBoxPage} from "../my-sense-box/my-sense-box"
|
||||||
export class LoginPage {
|
export class LoginPage {
|
||||||
userName: string;
|
userName: string;
|
||||||
password: string;
|
password: string;
|
||||||
|
private token:string
|
||||||
|
private user:ArrayBuffer=undefined;
|
||||||
public loading=false;
|
public loading=false;
|
||||||
constructor(public navCtrl: NavController, public navParams: NavParams) {
|
constructor(
|
||||||
|
public navCtrl: NavController,
|
||||||
|
public navParams: NavParams,
|
||||||
|
private loginProvider: LoginProvider
|
||||||
|
) {
|
||||||
}
|
}
|
||||||
|
|
||||||
submitLogin(){
|
private async submitLogin(form){
|
||||||
this.loading = true;
|
try {
|
||||||
// make api call to login with the credentials
|
this.token = await this.loginProvider.login("e_thie10@uni-muenster.de","Qxpxtexb1")
|
||||||
this.navCtrl.push(MySenseBoxPage)
|
this.user = await this.loginProvider.getUser(this.token);
|
||||||
|
}
|
||||||
|
catch(err){
|
||||||
|
console.log(err.message)
|
||||||
|
}
|
||||||
|
this.navCtrl.push(MySenseBoxPage,this.user);
|
||||||
}
|
}
|
||||||
|
|
||||||
ionViewDidLoad() {
|
ionViewDidLoad() {
|
||||||
|
|
|
@ -1,6 +1,6 @@
|
||||||
import { Component } from '@angular/core';
|
import { Component } from '@angular/core';
|
||||||
import { IonicPage, NavController, NavParams } from 'ionic-angular';
|
import { IonicPage, NavController, NavParams } from 'ionic-angular';
|
||||||
|
import {LoginProvider} from "../../providers/LoginProvider/LoginProvider";
|
||||||
/**
|
/**
|
||||||
* Generated class for the MySenseBoxPage page.
|
* Generated class for the MySenseBoxPage page.
|
||||||
*
|
*
|
||||||
|
@ -14,12 +14,16 @@ import { IonicPage, NavController, NavParams } from 'ionic-angular';
|
||||||
templateUrl: 'my-sense-box.html',
|
templateUrl: 'my-sense-box.html',
|
||||||
})
|
})
|
||||||
export class MySenseBoxPage {
|
export class MySenseBoxPage {
|
||||||
|
token:string;
|
||||||
constructor(public navCtrl: NavController, public navParams: NavParams) {
|
private user: ArrayBuffer=undefined;
|
||||||
|
constructor(public navCtrl: NavController,
|
||||||
|
public navParams: NavParams,
|
||||||
|
private loginProvider: LoginProvider
|
||||||
|
) {
|
||||||
}
|
}
|
||||||
|
|
||||||
ionViewDidLoad() {
|
ionViewDidLoad() {
|
||||||
console.log('ionViewDidLoad MySenseBoxPage');
|
console.log('ionViewDidLoad MySenseBoxPage');
|
||||||
}
|
console.log(this.navParams) }
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
57
src/providers/LoginProvider/LoginProvider.ts
Normal file
57
src/providers/LoginProvider/LoginProvider.ts
Normal file
|
@ -0,0 +1,57 @@
|
||||||
|
import { HttpClient, HttpHeaders } from '@angular/common/http';
|
||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
import { timeout } from 'rxjs/operators'
|
||||||
|
const URL_login = 'https://api.opensensemap.org/users/sign-in';
|
||||||
|
const URL_user = 'https://api.opensensemap.org/users/me/boxes';
|
||||||
|
|
||||||
|
// const URL = "http://compiler.snsbx.nroo.de"
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class LoginProvider {
|
||||||
|
|
||||||
|
constructor(public http: HttpClient) { }
|
||||||
|
|
||||||
|
async login(username:string,password:string): Promise<string> {
|
||||||
|
const headers = new HttpHeaders({'Content-Type': 'application/json'} );
|
||||||
|
// send compilation request, returning a job ID
|
||||||
|
return this.http.post(`${URL_login}?email=`+username+`&password=`+password, { headers })
|
||||||
|
.pipe(timeout(30000))
|
||||||
|
.toPromise()
|
||||||
|
.catch(err => {
|
||||||
|
let msg = err.message
|
||||||
|
if (err.name === 'TimeoutError')
|
||||||
|
msg = 'unable to contact api. are you online?'
|
||||||
|
|
||||||
|
try {
|
||||||
|
// attempt to extract the compilation error message and clean it up
|
||||||
|
console.error(err)
|
||||||
|
msg = JSON.parse(err.error.message)
|
||||||
|
if (msg.process) {
|
||||||
|
msg = `compilation error: ${msg.process.substr(msg.process.indexOf(' '))}`
|
||||||
|
msg = msg.substr(0, msg.indexOf('^'))
|
||||||
|
}
|
||||||
|
} catch (err2) {
|
||||||
|
console.error(err2)
|
||||||
|
}
|
||||||
|
throw Error(msg)
|
||||||
|
})
|
||||||
|
// download the resulting sketch binary
|
||||||
|
.then((response: any) => {
|
||||||
|
return response.token;
|
||||||
|
});
|
||||||
|
};
|
||||||
|
|
||||||
|
async getUser(token:string):Promise<ArrayBuffer>{
|
||||||
|
const headers = new HttpHeaders({'Authorization':"Bearer "+token})
|
||||||
|
return this.http.get(URL_user,{headers})
|
||||||
|
.pipe(timeout(30000))
|
||||||
|
.toPromise()
|
||||||
|
.catch(err=>{
|
||||||
|
let msg = err.message;
|
||||||
|
console.log(msg);
|
||||||
|
})
|
||||||
|
.then((response:any)=>{
|
||||||
|
return response;
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
Loading…
Add table
Reference in a new issue