こんにちは私は自分のアプリにfirebase認証を実装しようとしています。しかし、私は動作していないようです。私がフォームを提出するかFacebookのログインをクリックすると何もしません。このエラーが発生します:Firebase Auth&Firebase Auth Facebookが動作しない
Uncaught Error: The error you provided does not contain a stack trace.
私を助けてくれてありがとうございます。ポップアップサインイン訪問Facebookの開発者のためのサイトのための「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;