取不给我回复

Question

我有一个包含用户名和密码字段的登录表单。我正在尝试将用户名和密码发送到我的django api。但没有任何东西出现在控制台中我试图在控制台中打印响应。这是我的代码

export default class LogInComponent extends Component {
    handleLoginButtonClick() {
        fetch('https://myname-backend.appspot.com',{
            method: "POST",
            type: 'json',
        data: {password:document.getElementById("username").value,
               username:document.getElementById("password").value
        }
        })
            .then(function(response) {
                // We get a JWT back.
                let jwt = response.auth_token;
                // We trigger the LoginAction with that JWT.
                console(response);
                //LoginActions.loginUser(jwt);
                return response;
            });

    }

    render() {
        return (
            <div className="LoginPage">
                <div className="login-page">
                    <div className="form">
                        <form className="register-form">
                            <input type="text" placeholder="name"/>
                            <input type="password" placeholder="password"/>
                            <input type="text" placeholder="email address"/>
                            <button>create</button>
                            <p className="message">Already registered? <a href="#">Sign In</a></p>
                        </form>
                        <form className="login-form">
                            <input id="username" type="username" placeholder="username"/>
                            <input id="password" type="password" placeholder="password"/>
                            <button onClick={this.handleLoginButtonClick}>login</button>
                            <p className="message">Not registered? <a href="#">Request Username and Password</a></p>
                        </form>
                    </div>
                </div>
                <img className="Logo_Tessact_White" src="./dev/js/images/TESSACT_logo_white.png"/>
            </div>
        );
    }
}

这是我的api电话指南

我做错了什么？

更新代码

export default class LogInComponent extends Component {
    handleLoginButtonClick() {
        fetch('https://myname-backend.appspot.com/auth/login', {
                method: "POST",
                type: 'json',
                data: {
                    "password": document.getElementById("password").value,
                    "username": document.getElementById("username").value
                }
            }
        )

            .then(function(response) {
            return response.json();
        })
            .then(function(data) {
                // We get a JWT back.
                let jwt = data.auth_token;
                // We trigger the LoginAction with that JWT.
                console.log(data);
                //LoginActions.loginUser(jwt);
                return data;
            });
        //browserHistory.push("app")
        // console.log('clicked')
        // console.log(document.getElementById("password").value);
    }



    render(){
        return (
            <div className="LoginPage">
                <div className="login-page">
                    <div className="form">
                        <form className="register-form">
                            <input type="text" placeholder="name"/>
                            <input type="password" placeholder="password"/>
                            <input type="text" placeholder="email address"/>
                            <button>create</button>
                            <p className="message">Already registered? <a href="#">Sign In</a></p>
                        </form>
                        <form className="login-form">
                            <input id="username" type="username" placeholder="username"/>
                            <input id="password" type="password" placeholder="password"/>
                            <button onClick={this.handleLoginButtonClick}>login</button>
                            <p className="message">Not registered? <a href="#">Request Username and Password</a></p>
                        </form>
                    </div>
                </div>
                <img className="Logo_Tessact_White" src="./dev/js/images/TE_logo_white.png"/>
            </div>
        );
    }

仍然无法让控制台打印响应。

Answer 1

网址似乎错了。你有：

fetch('https://myname-backend.appspot.com',{

并且应该：

fetch('https://myname-backend.appspot.com/login',{

Answer 2

您传递的数据不正确，例如username in password和password in username.

使用

    data: {password:document.getElementById("password").value,
           username:document.getElementById("username").value
    }