Hi, I just started on my journey to make an app and I was following some tutorials online, mainly from this guy :https://www.youtube.com/watch?v=fRLVy4yMV8M&list=PLYxzS__5yYQng-XnJhB21Jc7NW1OIaqct&index=25
So the problem is when I tried to use Sign-in with redirect, My app starts up the inapp browser, loads for a while before returning back to the homepage.
Below is my Home.html
iFarm <div id = "topButtons">
<button block ion-button (click)="signIn()"*ngIf = "!provider.loggedin" item-left>Sign In</button>
<button block ion-button (click)="register()"*ngIf = "!provider.loggedin" item-left>Register</button>
</div>
<div>
<button block ion-button (click)="login('facebook')" *ngIf = "!provider.loggedin" item-left><ion-icon name="logo-facebook"></ion-icon> Login With Facebook</button>
<button block ion-button (click)="login('google')" *ngIf = "!provider.loggedin" item-left><ion-icon name="logo-googleplus"></ion-icon> Login With Google</button>
<ion-card *ngIf = "provider.loggedin">
<img src="{{ provider.profilePicture }}"/>
<ion-card-content>
<ion-card-title>
{{ provider.name }}
</ion-card-title>
<p style = "text-align: center">
{{ provider.email }}
</p>
</ion-card-content>
</ion-card>
<button block ion-button (click)="FinalLogin()" *ngIf = "provider.loggedin" item-left>Please Enter!!</button>
<button block ion-button (click)="logout()" *ngIf = "provider.loggedin" item-left>Logout</button>
</div>
<!-- <div class="btn_container">
<button ion-button full (click)="loginf();">Login with Facebook</button>
</div> -->
Below is my home.ts.
import { Component, ViewChild, ChangeDetectorRef } from ‘@angular/core’;
import { NavController, AlertController } from ‘ionic-angular’;
import { LoginPage } from ‘…/login/login’;
import { RegisterPage } from ‘…/register/register’;
import firebase from ‘firebase’;
import {AngularFireAuth} from ‘angularfire2/auth’;
import { LoggedinPage } from ‘…/loggedin/loggedin’;
@Component({
selector: ‘page-home’,
templateUrl: ‘home.html’
})
export class HomePage {
@ViewChild('username') uname;
@ViewChild('password') password;
provider = {
name : '',
profilePicture: '',
email: '',
loggedin : false
}
constructor(private fire: AngularFireAuth, public navCtrl: NavController, public alertCtrl: AlertController, public ref: ChangeDetectorRef,public fb: Facebook) {
console.log(‘constructor’);
}
signIn(){
this.navCtrl.push(LoginPage,{
});
}
FinalLogin(){
this.navCtrl.push(LoggedinPage,{
});
}
register(){
this.navCtrl.push(RegisterPage);
}
login(provider){
let signInProvider = null;
console.log(“Help”)
switch(provider){
case “facebook”:
signInProvider = new firebase.auth.FacebookAuthProvider()
console.log(“Help2”)
break;
case "google":
signInProvider = new firebase.auth.GoogleAuthProvider()
break;
}
this.fire.auth.signInWithRedirect(signInProvider).then ( () => {
console.log(“Help”)
this.fire.auth.getRedirectResult().then( res => {
console.log(res)
console.log('from -Google--')
this.provider.loggedin = true;
this.provider.name = res.user.displayName;
this.provider.name = res.user.email;
this.provider.profilePicture = res.user.photoURL;
this.ref.detectChanges();
console.log(res)
});
})
}
logout(){
this.provider.loggedin = false;
this.ref.detectChanges();
this.fire.auth.signOut();
console.log()
}
}
Can anyone help? Many thanks to those who reply.