[英]Firebase Auth & Firebase Auth With Facebook not working
您好,我正在嘗試對我的應用程序執行Firebase身份驗證。 但我似乎沒有工作。 當我提交表單或單擊Facebook登錄名時,它什么也沒有做。 我收到此錯誤:
未捕獲的錯誤:您提供的錯誤不包含堆棧跟蹤。
預先感謝您對我的幫助。
從“ firebase”導入firebase
const loginStyles = {
width: "90%",
maxWidth: "380px",
margin: "20px auto",
border: "1px solid #ddd",
borderRadius: "5px",
padding: "10px"
}
const provider = new firebase.auth.FacebookAuthProvider();
class Login extends Component {
constructor(props){
super(props);
this.authWithFacebook= this.authWithFacebook.bind(this);
this.authWithEmailPassword= this.authWithEmailPassword.bind(this);
this.state = {
redirect: false
}
}
authWithFacebook(){
firebase.auth().signInWithPopup(provider)
.then((result, error) => {
if(error){
console.log(error);
this.toaster.show({intend: Intent.DANGER, message: "kann nicht mit Facebook einloggen"})
;
}else{
this.setState({
redirect: true
})
}
})
};
authWithEmailPassword(event){
event.preventDefault();
const email = this.emailInput.value;
const password = this.passwordInput.value;
firebase.auth().fetchProvidersForEmail(email)
.then((providers)=>{
if(providers.length === 0){
//Benutzer Account erstellen
return firebase.auth.createUserWithEmailAndPassword(email, password)
} else if (providers.indexOf("password") === -1 ){
//Facebook wird schon benutzt
this.loginForm.reset()
this.toaster.show({intend: Intent.WARNING, message: "versuche es mit einem abderen Login"})
} else {
// den Benutzer Einloggen
return firebase.auth().signInWithEmailAndPassword(email, password)
}
})
.then((user => {
if(user && user.email){
this.loginForm.reset();
this.setState({
redirect: true
})
}}))
.catch((error) => {
this.toaster.show({intend: Intent.DANGER, message: error.message})
})
}
render(){
if (this.state.redirect === true){
return <Redirect to='/' />
}
return (
<div style={loginStyles}>
<Toaster ref={(element) => {this.toaster = element}} />
<div >
<Col xs={12} md={12}>
<Button style={{width: "100%", marginTop: "10px"}} bsStyle="primary" onClick={()=> {this.authWithFacebook() }}>
Log-In mit Facebook
</Button>
</Col>
</div>
<Col xs={12} md={12}>
<hr/>
</Col>
<Form onSubmit={(event)=> {this.authWithEmailPassword(event)}} ref={(form) =>{this.loginForm = form}}>
<FormGroup style={{marginBottom: "20px"}} controlId="formHorizontalEmail">
<Col xs={12} md={12}>
<FormControl name="email" inputRef={(ref) => { this.emailInput = ref; }} type="email" placeholder="Email" />
</Col>
</FormGroup>
<FormGroup controlId="formHorizontalPassword">
<Col xs={12} md={12}>
<FormControl name="password" inputRef={(ref) => { this.passwordInput = ref; }} type="password" placeholder="Password" />
</Col>
</FormGroup>
<FormGroup style={{marginTop : "20px"}} >
<Col sm={12}>
<Checkbox>Remember me</Checkbox>
</Col>
</FormGroup>
<FormGroup >
<Col sm={12}>
<Button type="submit">
Einloggen
</Button>
</Col>
</FormGroup>
</Form>
</div>
)
}
}
;
export default Login;
要進行彈出式登錄,請訪問Facebook for Developers網站,獲取您的應用程序的應用程序ID和應用程序密鑰。 如果不想彈出,請檢查以下代碼:
firebase.auth().signInWithRedirect(provider); firebase.auth().getRedirectResult().then(function(result) { if (result.credential) { // This gives you a Facebook Access Token. You can use it to access the Facebook API. var token = result.credential.accessToken; // ... } // The signed-in user info. var user = result.user; }).catch(function(error) { // Handle Errors here. var errorCode = error.code; var errorMessage = error.message; // The email of the user's account used. var email = error.email; // The firebase.auth.AuthCredential type that was used. var credential = error.credential; // ... });
這是不正確的:
firebase.auth().signInWithPopup(provider)
.then((result, error) => {
它應該是:
firebase.auth().signInWithPopup(provider)
.then((result) => {
// Success.
}, (error) => {
// Error.
});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.