网络错误：响应不成功：收到状态码 400答案

【问题标题】：Network error: Response not successful: Received status code 400网络错误：响应不成功：收到状态码 400
【发布时间】：2020-07-09 20:40:46
【问题描述】：

我的脑子坏了。为什么服务器会发送此错误。我查看了所有具有相同错误的文章，但没有找到解决方案。问题是什么？我该如何解决这个错误？请帮忙。我的代码。

App.jsx 这是 Apollo 客户端的客户端

const client = new ApolloClient({
  uri: "http://localhost:4000/api/",
  request: (operation) => {
    const token = localStorage.getItem("token");

    operation.setContext({
      headers: {
        authorization: token ? `Bearer ${token}` : ""
      }
    });
  }
});

signUp.js 这是 sighUp 的突变

import { gql } from "apollo-boost";

export default gql`
  mutation signup($firstName: String!, $secondName: String!, $email: String!, $password: String! ) {
    signup(firstName: $firstName, secondName: $secondName, email: $email, password: $password ) 
  }
`;

RegForm.jsx 这是我的组件注册

import React, {Component} from 'react'
import {Field, reduxForm, SubmissionError} from 'redux-form'
import regForm from './RegForm.module.css'
import { matchInput, passLength, email, required} from '../../../utils/validators'

import RegMutation from '../../../queries/signup'
import Button from '../../../UI/Button/Button'
import myInput from '../../../UI/Input/Input'
import { withMutation } from "react-apollo";

const passwordValidator = passLength(8);


class RegForm extends Component {
  constructor(props){
    super(props)

    this.handleSubmit = this.handleSubmit.bind(this);
  }

    handleSubmit(fields) {
      console.log('Fields from handleSubmit',fields);

      const { mutate } = this.props;

      return new Promise((resolve, reject) => {
        mutate({
          variables: {
            firstName: fields.loginField,
            email: fields.email,
            password: fields.passwordField
          }
        })
          .then(res => {
           console.log(res.data);
            resolve(res);
          })
          .catch(e => {
            reject(new SubmissionError({ _error: e?.message }));
          });
   });
  }

    render(){
        return (
            <div>
            <form 
                className={regForm.formContent}
                onSubmit={this.props.handleSubmit(this.handleSubmit)}
            >

            <Field 
                name='loginField'
                type='text'
                component={myInput}
                validate={[required]}

            />
            <Field 
                name='email'
                type='text'
                component={myInput}
                validate={[email]}

            />
            <Field 
                name='passwordField'
                type='password'
                component={myInput}
                validate={[passwordValidator]}
                placeholderText='Введите пароль'
            />
            <Field 
                name='repPas'
                type='password'
                component={myInput}
                validate={[matchInput]}

            />
            <Button
                onClick={this.Click}
                className={regForm.button}>Sign Up
            </Button>

        </form>

        {this.props.error ? <span>{this.props.error}</span> : null}
        </div>
        )
    }
}
const connectedToReduxForm = reduxForm({
  form: "loginForm",
});



export default withMutation(RegMutation)(connectedToReduxForm(RegForm))

【问题讨论】：

填写表格时收到响应400错误？
400 响应代码表示您的查询无效或格式错误。请在浏览器的开发工具中查看服务器的原始响应——它应该包含一个 errors 数组，其中包含有关您查询的具体问题的详细信息。
我遇到了类似的情况，出现 400 错误，并且能够通过在网络选项卡中查找和读取错误数组来进行调试。谢谢！

标签： graphql

【解决方案1】：

secondName 字段不存在。我已经通过运行完整的项目了解了这一点） screenshot

【讨论】：