728x90
import { Component, OnInit } from '@angular/core';
import { NavController, AlertController } from '@ionic/angular';
import { Storage } from '@ionic/storage';
import Kuzzle from 'kuzzle-sdk/dist/kuzzle.js';
@Component({
selector: 'app-mypage',
templateUrl: './mypage.page.html',
styleUrls: ['./mypage.page.scss'],
})
export class MypagePage implements OnInit {
kuzzle: any;
userId: any;
userPwd: any;
userNickname: any;
constructor(private storage: Storage, private navCtrl: NavController, private alertCtrl: AlertController) {
this.kuzzle = new Kuzzle('192.168.0.26', this.kuzzle_callback.bind(this));
this.storage.get('userid').then(userid => {
this.userId = userid;
});
this.storage.get('userpwd').then(userpwd => {
this.userPwd = userpwd;
});
this.storage.get('usernickname').then(usernickname => {
this.userNickname = usernickname;
});
}
kuzzle_callback (err, res) {
console.log(err);
this.kuzzle.login('local', {username: 'kuzzle id', password: 'kuzzle password'}, '로그인 유지 시간',
function(error, result) {
this.kuzzle.setJwtToken(JSON.stringify(result.jwt));
this.storage.set('jwt', JSON.stringify(result.jwt));
});
}
ngOnInit() {
}
goHome() {
this.navCtrl.navigateRoot('login');
}
kuzzleLogout() {
this.kuzzle.logout(function (err, res) {
if (res) {
this.goHome();
this.kuzzle.unsetJwtToken();
this.storage.set('jwt', null);
this.storage.set('userid', null);
this.storage.set('userpwd', null);
}
}.bind(this));
}
deleteUser() {
const args = {
'index': 'index_name',
'collection': 'collection_name',
'controller': 'document',
'action': 'deleteByQuery'
},
query = {
body: {
'query': {
'bool': {
'must': [{
'match': {
'USER_ID': this.userId
}
},
{
'match': {
'USER_PASSWORD': this.userPwd
}
}
]
}
}
}
};
// Using callbacks (NodeJS or Web Browser)
this.kuzzle.query(args, query, function (err, res) {
this.kuzzle.unsetJwtToken();
});
this.goHome();
this.kuzzle.unsetJwtToken();
this.storage.set('jwt', null);
this.storage.set('userid', null);
this.storage.set('userpwd', null);
}
}
//html
<ion-content padding>
<div style="text-align: center; padding: auto; margin: auto;">
<ion-list style="text-align: center; padding: auto; margin: auto;">
<ion-item style="margin-left: auto; margin-right: auto; width: auto; height: auto;">
<img src="./../../assets/imgs/human2.png" style="width: 160px;height: 120px;margin:auto;padding:auto;" />
<br />
<ion-label style="font-size: 1em; font-weight: 500; color:black;">{{userNickname}}님</ion-label>
</ion-item>
<ion-item style="margin-left: auto; margin-right: auto; width: auto; height: auto;">
<ion-button (click)="kuzzleLogout()" color="button" expand="block" shape="round" size="large" class="bt">
로그아웃</ion-button>
<ion-button (click)="deleteUser()" color="button" expand="block" shape="round" size="large" class="bt">
회원탈퇴</ion-button>
</ion-item>
</ion-list>
</div>
</ion-content>
728x90
'typescript > kuzzle + elastic search' 카테고리의 다른 글
커즐(kuzzle) 활용 예시 5(아이디/닉네임 중복확인) v5.x (0) | 2019.02.26 |
---|---|
커즐(kuzzle) 활용 예시 3(아이디/패스워드 찾기) v5.x (0) | 2019.02.25 |
커즐(kuzzle) 활용 예시 1(회원가입) v5.x (0) | 2019.02.25 |
커즐(kuzzle) 활용 예시 2(로그인) v5.x (0) | 2019.02.25 |
커즐(kuzzle) 특징 (0) | 2019.02.25 |