Mstoreapp
Search…
Account kit integartion (for ionic 4 app)
    1.
    Login Facebook Developer Account
    2.
    Get Facebook App ID (APP_ID) and AccountKit client token (CLIENT_TOKEN) - read document on medium to get APP_ID and CLIENT_TOKEN- https://medium.com/react-native-training/passwordless-authentication-in-react-native-using-facebook-account-kit-part-1-8d83e92077e9
    3.
    Install the plugin in your app
1
cordova plugin add cordova-plugin-accountkit --save --variable APP_ID="123456789" --variable APP_NAME="myApplication" --variable CLIENT_TOKEN="abcdefghijklmnopqrstuvwxyz" --variable API_VERSION="v1.1"
Copied!
4. Uncomment the code in ../src/app/account/login/login.page.ts and ../src/app/account/login/register.page.tsfile
1
loginWithPhone(){
2
this.phoneLogingInn = true;
3
(<any>window).AccountKitPlugin.loginWithPhoneNumber({
4
useAccessToken: true,
5
defaultCountryCode: "IN",
6
facebookNotificationsEnabled: true,
7
}, data => {
8
(<any>window).AccountKitPlugin.getAccount(
9
info => this.handlePhoneLogin(info),
10
err => this.handlePhoneLogin(err));
11
});
12
}
13
handlePhoneLogin(info){
14
if(info.phoneNumber) {
15
this.api.postItem('phone_number_login', {
16
"phone": info.phoneNumber,
17
}).subscribe(res => {
18
this.status = res;
19
if (this.status.errors) {
20
this.errors = this.status.errors;
21
} else if (this.status.data) {
22
this.settings.customer.id = this.status.ID;
23
if (this.platform.is('cordova')){
24
this.oneSignal.getIds().then((data: any) => {
25
this.form.onesignal_user_id = data.userId;
26
this.form.onesignal_push_token = data.pushToken;
27
});
28
this.api.postItem('update_user_notification', this.form).subscribe(res =>{});
29
}
30
if(this.status.allcaps.dc_vendor || this.status.allcaps.seller || this.status.allcaps.wcfm_vendor){
31
this.settings.vendor = true;
32
}
33
this.navCtrl.navigateBack('/tabs/account');
34
}
35
this.phoneLogingInn = false;
36
}, err => {
37
this.phoneLogingInn = false;
38
});
39
} else this.phoneLogingInn = false;
40
}
41
handlePhoneLoginError(error){
42
this.phoneVerificationError = error;
43
this.phoneLogingInn = false;
44
}
Copied!
5. Uncomment Login button in ../src/app/account/login/login.page.html and ../src/app/account/login/register.page.htmlfile
1
<!--ion-button expand="block" color="{{settings.theme.button}}" shape="round" mode="ios" fill="outline" (click)="loginWithPhone()" [disabled]="phoneLogingInn"><ion-spinner name="dots" color="{{settings.theme.button}}" *ngIf="phoneLogingInn"></ion-spinner><span *ngIf="!phoneLogingInn">{{"Login with OTP"| translate}}</span></ion-button-->
Copied!
Last modified 2yr ago
Copy link