Solucionado (ver solução)
Solucionado
(ver solução)
7
respostas

Problema ao realizar requisição na API

Pessoal, estou com dificuldade para poder efetuar login no sistema, pois as minhas requisições em api/public/login estão sendo retornadas sempre como 401 (Unauthorized).

Então, botei um console.log na resposta com o erro para visualizar o que era, então obtive o seguinte retorno:

Response {type: "cors", url: "http://localhost:9900/api/public/login", redirected: false, status: 401, ok: false, …}
body:(...)
bodyUsed:false
headers: Headers {}
ok:false
redirected:false
status:401
statusText:""
type:"cors"
url:"http://localhost:9900/api/public/login"
__proto__:Response

Não entendi o porque de erro com o cors se outras requisições eu consigo fazer normalmente.

Desde já, agradeço a ajuda e atenção.

7 respostas

Oi Matheus, mostra pra gente como a requisição está sendo feita por favor?

envia(event){
        event.preventDefault();
        console.log(this.login.value);
        console.log(this.senha.value);

        const requestInfo = {
            method: 'POST',
            body: JSON.stringify({login: this.login.value, senha: this.senha.value}),
            headers: new Headers({
                'Content-Type': 'application/json',
            })
        }

        fetch('http://localhost:9900/api/public/login', requestInfo)
            .then(response => {
                if(response.ok){
                    console.log(response);
                    return response.text();

                } else {
                    console.log(response);
                    this.setState({msg: 'Usuário ou senha inválidos'})
                }
            })
            .then(token => {
                alert(token);
            })
    };

    render(){
        return(
            <div className="login-box">
               <h1 className="header-logo">Instalura</h1>
               <span>{this.state.msg}</span>    

               <form onSubmit={this.envia.bind(this)}> 
                    <input type="text" ref={(input) => this.login = input}/>
                    <input type="password" ref={(input) => this.senha = input}/>
                    <input type="submit" value="login"/>
                </form>    
            </div>
        );
    };

Você está usando login e senha válidos? Que existem no banco do servidor?

Estou sim.

alots - 123456 | rafael - 123456 | vitor - 123456

Matheus, me diz que arquivo é esse por favor? Estou tentado encontrar ele no projeto final para comparar algumas coisas.

https://github.com/asouza/projeto-react-alura/tree/master/src

solução!

Fala aí Wanderson, agradeço demais a sua ajuda e atenção. Eu consegui resolver o problema por aqui.

Acaba que eu só precisei retirar o "public" da URI, deixando só "api/login". Não sei explicar o motivo nem nada, provavelmente o projeto foi atualizado e alteraram as pastas. Não sei muito bem, mas funcionou.

Opa Matheus, que bom! É até engraçado isso ai, vou pedir para verificarem por que se houve divergência entre o conteúdo e o projeto, fica ruim para outros alunos acompanharem também! Obrigado pelo feedback

Bons estudos!