Hello everybody !
I’m french, i’m sorry if my english is not very understandable.
I have a problem with Ionic authentication. I have a gmail account and a twitter account using the same email and password.
First, i login with google and no problem, the user is well created in the database.
Then, when i try to login with twitter account or manually entering Email and Password, I have some errors.
With twitter account, i have the following error “An account already exists with the same email addr…ng a provider associated with this email address” and with Email/Password, the error is “The password is invalid or the user does not have a password”.
Is it possible to solve this problem ?
Thanks in advance
<ion-header>
<ion-navbar color="dark">
<ion-title>Connexion</ion-title>
</ion-navbar>
</ion-header>
<ion-content padding>
<form [formGroup]="form" (ngSubmit)="login()" novalidate>
<ion-item>
<ion-label floating>Email</ion-label>
<ion-input type="text" formControlName="email"></ion-input>
</ion-item>
<ion-item>
<ion-label floating>Mot de passe</ion-label>
<ion-input type="password" formControlName="password"></ion-input>
</ion-item>
<ion-item>
<h2 class="text-center">Ou se connecter avec :</h2>
<div class="social-media-login">
<img class="social-media-icon" src="assets/icon/icon-google.png" (click)="socialLogin('google')">
<img class="social-media-icon" src="assets/icon/icon-facebook.png" (click)="socialLogin('facebook')">
<img class="social-media-icon" src="assets/icon/icon-twitter.png" (click)="socialLogin('twitter')">
</div>
</ion-item>
<button ion-button type="submit" [disabled]="!form.valid" block>Se connecter</button>
<button ion-button secondary block (click)="goRegister()" color="secondary">S'inscrire</button>
</form>
</ion-content>
import { Component } from '@angular/core';
import { NavController, NavParams } from 'ionic-angular';
import {RegisterPage} from "../register/register";
import {LoginService} from "./login-service";
import {LoginForm} from "../../models/forms/login-form";
import {FormGroup} from "@angular/forms";
/**
* Generated class for the LoginPage page.
*
* See https://ionicframework.com/docs/components/#navigation for more info on
* Ionic pages and navigation.
*/
@Component({
selector: 'page-login',
templateUrl: 'login.html',
})
export class LoginPage {
private form : FormGroup = LoginForm.buildForm();
constructor(public navCtrl: NavController, public navParams: NavParams, private loginService: LoginService) {
}
login(){
this.loginService.login(this.form.value.email, this.form.value.password);
}
socialLogin(type) {
this.loginService.socialLogin(type);
}
goRegister() : void{
this.navCtrl.push(RegisterPage);
}
}
import { Injectable } from '@angular/core';
import { AngularFireAuth } from "angularfire2/auth";
import firebase from "firebase";
@Injectable()
export class LoginService {
private TYPE_LOGIN;
constructor(private fire : AngularFireAuth) {
}
login(email, password){
var credential = firebase.auth.EmailAuthProvider.credential(email, password);
this.fire.auth.signInWithCredential(credential)
.then(res => {
this.TYPE_LOGIN = "default";
console.log(res);
})
.catch(e => {
console.log(e);
});
}
socialLogin(type) : any {
switch(type){
case 'google':
this.loginWithGoogle();
case 'facebook':
this.loginWithFacebook();
case 'twitter':
this.loginWithTwitter();
default:
return null;
}
}
private loginWithGoogle() {
this.fire.auth.signInWithPopup(new firebase.auth.GoogleAuthProvider())
.then(res => {
this.TYPE_LOGIN = "google";
console.log(res);
})
.catch(e => {
console.log(e);
});
}
private loginWithFacebook(){
this.fire.auth.signInWithPopup(new firebase.auth.FacebookAuthProvider())
.then(res => {
this.TYPE_LOGIN = "facebook";
console.log(res);
})
.catch(e => {
console.log(e);
});
}
private loginWithTwitter(){
this.fire.auth.signInWithPopup(new firebase.auth.TwitterAuthProvider())
.then(res => {
this.TYPE_LOGIN = "twitter";
console.log(res);
})
.catch(e => {
console.log(e);
});
}
}