Question

我正在尝试使用axios发布数据并尝试从中获取响应，但是它能够成功发布数据但无法打印响应数据。我在邮递员中尝试过，它可以给我正确的响应。是问题来自后端或前端。我尝试格式化json数据和其他各种方式仍然没有运气

import React, { Component } from 'react'
import {browserHistory} from "react-router"
import image from '../Images/jeff.gif'

    import '../styles/auth.css'
    import axios from 'axios'
    import {connect} from 'react-redux';
    import {authProfile} from '../actions/authaction'
    import{getProfile} from '../actions/profileaction'
    import PropTypes from 'prop-types';

    class SignUp extends Component {
      constructor() {
        super()
        this.handleSubmit = this.handleSubmit.bind(this)
        this.handleLogin=this.handleLogin.bind(this)

        }

        handleLogin(event) {
          event.preventDefault()



        const email = event.target.elements.email.value
        const password=event.target.elements.password.value
        axios.post('http://ec2-3-16-156-118.us-east-2.compute.amazonaws.com:3000/user/login', {
          email: email,
          password: password
        })
        .then(res=> {
          console.log(res);
        })
        .catch(function (error) {
          console.log(error);
        });



        }




        handleSubmit(event) {
          event.preventDefault()


        const username = event.target.elements.name.value
        const email = event.target.elements.email.value
        const password=event.target.elements.password.value


        console.log(this.props.getProfile({"Name":username}))



        axios({
          method: 'post',
          url: 'http://ec2-3-16-156-118.us-east-2.compute.amazonaws.com:9000/user/signup',
          data:{
            "email":email,
            "password":password,
            "username":username


          }

        })
      .catch(function (error) {
        console.log(error)


      }).then((result)=>
      {
        console.log(result)
        this.props.getProfile({"Name":username})
        this.props.authProfile();





      })

    }

      render() {
        return (
          <div>

            <div id="login-box">
  <div class="left">
    <h2>Sign up</h2>
    <h2> Fakestagram </h2>

 <form onSubmit={this.handleSubmit}> 
 <input type ="text" placeholder="Username" name="name"/>
 <input type ="text" placeholder="email" name="email"/>
 <input type="text" placeholder="password"name="password"/>
 <button> Sign up </button>
 </form>
 </div>

  <div className="right">



    <span className="loginwith">Login with email and password<br />social network</span>
    <form onSubmit={this.handleLogin}> 
 <input type ="text" placeholder="email" name="email"/>
 <input type="text" placeholder="password"name="password"/>
 <button> Login </button>
 </form>
 </div>






  </div>
  <div className="or">OR</div>
</div>

        )
      }
    } 

    const mapStateToProps=(state)=>({
      posts:state.post.posts,
      profiles:state.profile.profile ,
      auth:state.authStatus.status     //this can be accessed as props by main class
  });

  export default connect(mapStateToProps,{authProfile,getProfile}) (SignUp);

Express后端

      router .post("/login",(req,res,next)=>{
           User.find({email:req.body.email}).exec().then(user=>{
            if(user.length<1)
            {
                return res.status(401).json({
                    message:"Failure"
                });
            }
           bcrypt.compare(req.body.password,user[0].password,(err,result)=>{
                if(err)
                {
                    return res.status(401).json({
                        message:'Auth fail'
                    });
                }
          if(result)
                {
                   const token= jwt.sign({
                        email:user[0].email,
                        userId:user[0]._id
                    },"passwordds",{expiresIn:"1h"});
                    return res.status(200).json({

                        "message":"Auth successful",
                        "token":"eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJlbWFpbCI6IjEyMzQiLCJ1c2VySWQiOiI1Y2UyOTU5ZmI5NWM5YjUxMjdlOWY0MmIiLCJpYXQiOjE1NTgzNjQ3MjgsImV4cCI6MTU1ODM2ODMyOH0.fkLICMslibkJww8Vw2ghlomggdyDroG-pK3c8TQWowI",
                        "userId":"5ce2959fb95c9b5127e9f42b",
                        "username":"12348999"

                    });
                }
            res.status(401).json({
            message:"Auth failed"
                })
            });


           })
           .catch(err=>{
               console.log(err);
               res.status(500).json({
                   error:err
               })
           })
       })

Answer 1

尝试从axios原始响应中将响应解析为json

axios.post('http://ec2-3-16-156-118.us-east-2.compute.amazonaws.com:3000/user/login', {
          email: email,
          password: password
        })
        .then(res=> res.json())
        .then(resJson=> {
          console.log(resJson);
        })
        .catch(function (error) {
          console.log(error);
        });

与您的注册请求类似

发布后，Axios无法获取响应数据

1 个答案: