如何從axios承諾中獲取控制台日志

Question

這真讓我抓狂。 我無法從axios POST請求中看到response對象。

 import React, { Component } from 'react'; import axios from 'axios'; class SignUp extends Component { state = { name: '', email: '', password: '' }; handleNameChange = e => { this.setState({ name: e.target.value }); }; handleEmailChange = e => { this.setState({ email: e.target.value }); }; handlePasswordChange = e => { this.setState({ password: e.target.value }); }; handleSubmit = e => { e.preventDefault(); const { name, email, password } = this.state; const user = { name: name, email: email, password: password }; axios .post('http://localhost:7777/signup', { user }) .then(function(response) { console.log(response); }) .catch(function(error) { console.log(error); }); }; render() { return ( < form className = "form-signin" onSubmit = { this.handleSubmit } > < h2 className = "form-signin-heading" > Please sign up < /h2> < label htmlFor = "inputName" className = "sr-only" > Name < /label> < input type = "name" name = "name" onChange = { this.handleNameChange } id = "inputName" className = "form-control" placeholder = "Name" required / > < label htmlFor = "inputEmail" className = "sr-only" > Email address < /label> < input type = "email" name = "email" onChange = { this.handleEmailChange } id = "inputEmail" className = "form-control" placeholder = "Email address" required / > < label htmlFor = "inputPassword" className = "sr-only" > Password < /label> < input type = "password" name = "password" onChange = { this.handlePasswordChange } id = "inputPassword" className = "form-control" placeholder = "Password" required / > < button className = "btn btn-lg btn-primary btn-block" type = "submit" > Sign up < /button> < /form> ); } } export default SignUp; 

有人請告訴我我錯過了什么。 我收到服務器console消息。 但我無法在瀏覽器開發人員工具中看到該消息。

這是我的后端代碼。

 const express = require('express'); const bodyParser = require("body-parser"); const cors = require("cors"); const app = express(); app.use(bodyParser.json()); app.use(cors({ origin: "http://localhost:3019" })); app.post('/signin', function(req, res) { let useremail = req.body.email; let password = req.body.password; if (useremail && password) { console.log('success') } else { console.log('Failure'); } }); app.post('/signup', function(req, res) { let userfullname = req.body.fullname; let useremail = req.body.email; let password = req.body.password; console.log(` Thank you ${userfullname} for signing up, your login credentials are login: ${useremail} password: ${password} `) }); app.listen(7777, function() { console.log("Started listening on port", 7777); }) 

Answer 1

您需要確保請求處理程序根據請求返回響應 。

例如，您可以發送一個JSON響應，通過執行以下操作向客戶端/瀏覽器發出請求已處理並完成的信號：

app.post('/signin', function(req, res) {
  let useremail = req.body.email;
  let password = req.body.password;
  if (useremail && password) {
    console.log('success')
  } else {
    console.log('Failure');
  }

  /* 
  Add this: send a json response to client 
  */
  res.json({ message : 'sign in request completed' });
});

app.post('/signup', function(req, res) {
  let userfullname = req.body.fullname;
  let useremail = req.body.email;
  let password = req.body.password;
  console.log(`
    Thank you ${userfullname} for signing up, 
    your login credentials are 
    login: ${useremail}
    password: ${password}  
  `)

  /* 
  Add this: send a json response to client 
  */
  res.json({ message : 'sign up request completed' });
});

除了json() ，express框架的Response接口還提供了其他響應方法，例如send()和end() ，它們可能更適合您的用例。

這里的關鍵概念是傳入的請求應該將相應的響應發送回客戶端。 這允許客戶端正確響應發送到服務器的網絡請求並從中恢復。

Answer 2

你必須調用res.json('Success'); 至少看到任何回應。 現在，后端API代碼不會對API進行響應

所以修改后的代碼看起來像

const express = require('express');
const bodyParser = require("body-parser");
const cors = require("cors");

const app = express();

app.use(bodyParser.json());
app.use(cors({
  origin: "http://localhost:3019"
}));

app.post('/signin', function(req, res) {
  let useremail = req.body.email;
  let password = req.body.password;
  if (useremail && password) {
    res.json({status:'Success'});
  } else {
    res.json({status:'Failed'});
  }
});

app.post('/signup', function(req, res) {
  let userfullname = req.body.fullname;
  let useremail = req.body.email;
  let password = req.body.password;
  res.json({messahge:`
    Thank you ${userfullname} for signing up, 
    your login credentials are 
    login: ${useremail}
    password: ${password}  
  `})


});

app.listen(7777, function() {
  console.log("Started listening on port", 7777);
})