我使用passportjs创建了REST Api用户身份验证,该身份验证与邮递员一起很好地工作。但是,当我尝试将后端与我的react App集成时,身份验证不起作用,我似乎无法弄清楚我的代码是什么解决方案
我正在使用访存Api将请求发送到后端,同样在package.json proxy
localhost:5000
中包含的我的react App中。并且登录路径为/ user / login
constructor(props){
super(props);
this.state = {
isLoading: true,
token: '',
email: '',
password: '',
signInError: []
};
this.onTextBoxEmail = this.onTextBoxEmail.bind(this);
this.onTextBoxPassword = this.onTextBoxPassword.bind(this);
this.onSignIn = this.onSignIn.bind(this);
}
componentDidMount() {
}
onTextBoxEmail(event){ this.setState({email: event.target.value,})}
onTextBoxPassword(event){this.setState({ password: event.target.value,})}
onSignIn () {
const {
email,
password,
} = this.state;
fetch('/user/login', {
method: "POST",
body: JSON.stringify({
email: email,
password: password,
})
}).then(res => console.log(res))
}
render() {
const {
email,
password,
} = this.state
return (
<>
<div className="container">
<Row className="py-5" >
<Col md="6" className="offset-1 mx-auto py-5" >
<Card className="card-user">
<CardText className="py-3 px-3">
<div className="card-description">
<CardBody>
<h2 className="text-center"> Sign In</h2>
<Form>
<Col className="pl-md-1" md="12">
<FormGroup>
<Input
value={email}
placeholder="mike@email.com"
type="email"
onChange={this.onTextBoxEmail}
/>
</FormGroup>
</Col>
<Col className="pl-md-1" md="12">
<FormGroup>
<Input
value={password}
placeholder="Password"
type="password"
onChange={this.onTextBoxPassword}
/>
</FormGroup>
</Col>
<CardFooter>
<div className="button-container py-3">
<Button
className="btn-fill"
color="primary"
type="submit"
onClick={this.onSignIn}
>
Sign in
</Button>
</div>
<p> Don't have Account. Sign up <a href="register"> here </a> </p>
</CardFooter>
</Form>