[英]Fetch not giving me the response
我有一个包含用户名和密码字段的登录表单。 我正在尝试将用户名和密码发送到我的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>
);
}
仍然无法让控制台打印响应。
网址似乎是错误的。 你有:
fetch('https://myname-backend.appspot.com',{
并且应该:
fetch('https://myname-backend.appspot.com/login',{
您传递的是不正确的数据,即username in password
和username in password
password in username.
采用
data: {password:document.getElementById("password").value,
username:document.getElementById("username").value
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.