Javascript 为什么我的axios请求不能返回正确的数据？

我在axios实例中使用的url上运行了一个api。为登录定义了一个路由，该路由在提供有效凭据的情况下返回JWT访问和刷新令牌。我可以使用postman进行测试，一切都很好，但在我使用axios的应用程序中，即使使用有效凭据，也不会返回任何令牌或错误。该API也是为cors设置的，并且正在实时运行

以下是axios实例：

import axios from 'axios';

const url = NOT SHOWN;

const axiosInstance = axios.create({
  baseURL: url,
  headers: {
    'Content-Type': 'application/json',
  },
});

export default axiosInstance;

以下是基本登录组件：

import React, { Component } from 'react';
import { Link as RouteLink, Redirect } from 'react-router-dom';
import axiosInstance from '../../axiosInstance';

//material ui
import Button from '@material-ui/core/Button';
import CssBaseline from '@material-ui/core/CssBaseline';
import TextField from '@material-ui/core/TextField';
import FormControlLabel from '@material-ui/core/FormControlLabel';
import Checkbox from '@material-ui/core/Checkbox';
import Link from '@material-ui/core/Link';
import Grid from '@material-ui/core/Grid';
import Typography from '@material-ui/core/Typography';
import { makeStyles } from '@material-ui/core/styles';
import Container from '@material-ui/core/Container';

class Login extends Component {
  state = {
    email: '',
    password: '',
    isAuthenticated: false,
  };

  login(email, password) {
    const data = {
      email: email,
      password: password,
    };
    axiosInstance
      .post('/login', data)
      .then((res) => {
        console.log(res.data);
      })
      .catch((err) => {
        console.log(err);
      });
  }

  onSubmit = (e) => {
    const { email, password } = this.state;
    this.login(email, password);
  };

  onChange = (e) => this.setState({ [e.target.name]: e.target.value.trim() });

  render() {
    if (this.state.isAuthenticated) {
      return <Redirect to='/' />;
    }
    return (
      <Container component='main' maxWidth='xs' style={{ marginTop: '75px' }}>
        <CssBaseline />
        <div>
          <Typography component='h1' variant='h3' align='center'>
            Login
          </Typography>
          <form noValidate>
            <TextField
              variant='outlined'
              margin='normal'
              required
              fullWidth
              id='email'
              label='Email Address'
              name='email'
              autoComplete='email'
              autoFocus
              onChange={this.onChange}
            />
            <TextField
              variant='outlined'
              margin='normal'
              required
              fullWidth
              name='password'
              label='Password'
              type='password'
              id='password'
              autoComplete='current-password'
              onChange={this.onChange}
            />
            <FormControlLabel
              control={<Checkbox value='remember' color='primary' />}
              label='Remember me'
            />
            <Button
              type='submit'
              fullWidth
              variant='contained'
              color='primary'
              //className={classes.submit}
              onClick={this.onSubmit}
            >
              LOGIN
            </Button>
            <Grid container>
              <Grid item xs>
                <Link variant='body2'>Forgot password?</Link>
              </Grid>
              <Grid item>
                <Link component={RouteLink} to={'/signup'} variant='body2'>
                  {"Don't have an account? Sign Up"}
                </Link>
              </Grid>
            </Grid>
          </form>
        </div>
      </Container>
    );
  }
}

export default Login;

---

“

我认为登录函数的定义不正确，因此没有调用它。请尝试使用函数表达式：

login = (email, password) => {
    const data = {
      email: email,
      password: password,
    };
    axiosInstance
      .post('/login', data)
      .then((res) => {
        console.log(res.data);
      })
      .catch((err) => {
        console.log(err);
      });
  }

  onSubmit = (e) => {
    const { email, password } = this.state;
    login(email, password);
  };

---

您是否在浏览器的开发工具中看到该请求？如果你能看到它，它是否有正确的有效负载电子邮件和密码？在dev tools Network->response选项卡中，响应是什么样子的？因为您的登录函数使用类的状态。您需要使用此关键字绑定登录函数。this.login=this.login.bindthis在您的constructor@Phil在浏览器开发工具中，请求似乎从未到达服务器，我收到一个NS_BINDING_中止错误，post请求为任何遇到此问题的人解决了这个问题。在我的登录路径服务器端，我在正文中查找“电子邮件”和“密码”，但在客户端，我在登录函数中创建的数据对象中发送电子邮件和密码。@t您的评论毫无意义。您正在发布带有电子邮件和密码属性的JSON请求正文。您的服务器端代码究竟想用它做什么？错在哪里？你做了什么来修复它？