2017-10-18 2 views
0

Ich versuche zu implementieren Google und Facebook anmelden auf der gleichen Seite, aber ich bin nicht in der Lage zu tun, dass ich viel Google aber konnte nicht die Antwort finden.Firebase implementieren Google und Facebook anmelden auf der gleichen Seite

Kann mir bitte jemand ein Beispiel von Google und Facebook zur Verfügung stellen, das auf derselben Seite implementiert wurde?

+1

, wenn Sie in Android sind, verwenden Feuerbasis-ui Bibliothek – faruk

Antwort

0

Dies ist ein kompliziertes Problem, das wir vor ein paar Monaten gelöst haben. Sie müssen Ihre Konten basierend auf unterschiedlichen Anmeldedaten zusammenführen. Sie können Anmeldeinformationen, die Sie von Google/Facebook erhalten, mit bereits angemeldetem Konto zusammenführen. Wenn Sie keine andere Auswahlmöglichkeit als Google/Facebook vorhaben, können Sie nur mehrere Konten mit derselben E-Mail-Adresse von der Konsole aus zulassen.

+0

Hey ich will nicht Authentifizierungs-Provider verbinden, sondern sie auf der gleichen Seite zu verwenden und nach der Umsetzung fand ich sie unclicable Sie es bei Link überprüfen http://iitm.000webhostapp.com/login.php –

+0

Mein Code http://iitm.000webhostapp.com/123.txt –

+0

Haben Sie versucht, nur einen Anbieter zu implementieren? Hat es für dich funktioniert? Wenn ja, dann überlegen Sie sich, welche Funktion Sie für die Anmeldung verwenden würden, jetzt haben Sie zwei Funktionen mit demselben Namen. – iiylll

0

Dieses Beispiel funktioniert mit Angular/Ionic. Sie müssen zwei Tasten in HTML:

<button ion-button outline (click)="loginWithFacebook()"> 
    <svg ngClass="svgIcon-use" width="25" height="25" viewBox="0 0 25 25"> 
     <path d="M21 12.646C21 7.65 16.97 3.6 12 3.6s-9 4.05-9 9.046a9.026 9.026 0 0 0 7.59 8.924v-6.376H8.395V12.64h2.193v-1.88c0-2.186 1.328-3.375 3.267-3.375.93 0 1.728.07 1.96.1V9.77H14.47c-1.055 0-1.26.503-1.26 1.242v1.63h2.517l-.33 2.554H13.21V21.6c4.398-.597 7.79-4.373 7.79-8.954"></path> 
    </svg> 
    Facebook 
</button> 

<button ion-button outline (click)="loginWithGoogle()"> 
    <svg ngClass="svgIcon-use" width="25" height="25" viewBox="0 0 25 25"> 
     <g fill="none" fill-rule="evenodd"> 
     <path d="M20.66 12.693c0-.603-.054-1.182-.155-1.738H12.5v3.287h4.575a3.91 3.91 0 0 1-1.697 2.566v2.133h2.747c1.608-1.48 2.535-3.65 2.535-6.24z" 
      fill="#4285F4"></path> 
     <path d="M12.5 21c2.295 0 4.22-.76 5.625-2.06l-2.747-2.132c-.76.51-1.734.81-2.878.81-2.214 0-4.088-1.494-4.756-3.503h-2.84v2.202A8.498 8.498 0 0 0 12.5 21z" 
      fill="#34A853"></path> 
     <path d="M7.744 14.115c-.17-.51-.267-1.055-.267-1.615s.097-1.105.267-1.615V8.683h-2.84A8.488 8.488 0 0 0 4 12.5c0 1.372.328 2.67.904 3.817l2.84-2.202z" 
      fill="#FBBC05"></path> 
     <path d="M12.5 7.38c1.248 0 2.368.43 3.25 1.272l2.437-2.438C16.715 4.842 14.79 4 12.5 4a8.497 8.497 0 0 0-7.596 4.683l2.84 2.202c.668-2.01 2.542-3.504 4.756-3.504z" 
      fill="#EA4335"></path> 
     </g> 
    </svg> 
    Google 
</button> 

Login.ts

loginWithFacebook(): void { 
    this.afAuth.auth.signInWithPopup(new firebase.auth.FacebookAuthProvider()) 
     .then(_ => this.navCtrl.setRoot('HomePage')) 
     .catch(error => alert(error)); 
} 

loginWithGoogle(): void { 
    let provider = new firebase.auth.GoogleAuthProvider(); 
    provider.addScope('https://www.googleapis.com/auth/plus.login'); 
    return this.afAuth.auth.signInWithPopup(provider) 
     .then(_ => this.navCtrl.setRoot('HomePage')) 
     .catch((error) => alert(error)); 

} 
+0

Wären Sie nicht bei zwei verschiedenen Konten angemeldet? – iiylll

+0

Ich möchte es auf der Website implementieren, so kann ich angular/iconic verwenden –

+0

Es ist nur ein Beispiel, Sie können es in Angular implementieren. –

0

I FirebaseUI empfehlen. Es kümmert sich um alle Randfälle für Sie und es ist einfach zu bedienen. Es gibt Situationen, in denen Sie sich beispielsweise bei Google anmelden und sich dann mit derselben E-Mail-Adresse bei Facebook anmelden. Eine Kontenverknüpfung wäre erforderlich, um beide Konten zusammenzuführen.

Verwandte Themen