przekierowuje mnie na inna podstronę mimo złych danych logowania

0

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>
        );
    }
}
1

Nie sprawdzasz zawartości JSONa, który zwraca Ci API. A tam pewnie jest odpowiedź, że masz złe dane logowania. Ponieważ responseJson jest obiektem, instrukcja if (responseJson) zwróci Ci zawsze true. Bo i czemu miałoby dać false? Nie obsługujesz też catch z Promise.

Poczytaj sobie, jak w JavaScripcie porównywane są wartości https://developer.mozilla.org/en-US/docs/Web/JavaScript/Equality_comparisons_and_sameness

1 użytkowników online, w tym zalogowanych: 0, gości: 1