Nie wiem, jak uchronić się przed przekierowaniem na inna podstronke gdy mam złe dane logowania. Gdy wpiszę poprawne dane logowania
console.log(responseJson) zwraca mi :
{
token:..
userName...
...
}
gdy wpiszę błedne to w konsoli mam message: userName or password is invalid, ale przekieruje mnie mimo to do strony ktora powinna byc widoczna po zalogowaniu..
Proszę o jakąś wskazowkę.
class Login extends Component {
constructor() {
super();
this.state = {
Username: '',
Password: '',
grant_type: 'password',
redirectToReferrer: false
};
this.login = this.login.bind(this);
this.onChange = this.onChange.bind(this);
}
login = () => {
var details = {
'Username': this.state.Username,
'Password': this.state.Password,
'grant_type': 'password'
};
var formBody = [];
for (var property in details) {
var encodedKey = encodeURIComponent(property);
var encodedValue = encodeURIComponent(details[property]);
formBody.push(encodedKey + "=" + encodedValue);
}
formBody = formBody.join("&");
fetch('http://xxx' + '/Token', {
method: 'POST',
headers: {
'Accept': 'application/json',
'Content-Type': 'application/x-www-form-urlencoded'
},
body: formBody
})
.then(res => res.json())
.then(result => {
let responseJson = result;
if (responseJson) {
sessionStorage.setItem('', responseJson)
this.setState({
redirectToReferrer: true
})
} else {
console.log("Login error")
}
console.log(responseJson)
})
}
render() {
if (this.state.redirectToReferrer) {
return (<Redirect to={'/home'} />)
}
if (sessionStorage.getItem('')) {
return (<Redirect to={'/home'} />)
}
return (
<div className="row" id="Body">
<div className="medium-5 columns left">
<h4>Login</h4>
<label>Username</label>
<input type="text" name="Username" placeholder="Username" onChange={this.onChange} />
<label>Password</label>
<input type="password" name="Password" placeholder="Password" onChange={this.onChange} />
<input type="submit" className="button success" value="Login" onClick={this.login} />
<a href="/signup">Registration</a>
</div>
</div>
);
}
}