Обработка ошибок с помощью express-graphql & реагировать-apollo

Question

Я пытаюсь отобразить простую ошибку "Электронная почта и пароль не совпадают" в форме входа в систему, но у меня возникли проблемы, и я не уверен, находится ли ошибка на сервере или в приложении React. Я думал, что отправлю здесь, так как я не уверен, какой репозиторий GitHub будет уместным. Вот решатель на сервере:

// Schema definition:

type Mutation {
   loginViewer(credentials: AUTH_CREDENTIALS): SignInPayload!
}

type SignInPayload {
   token: String
   expires: Int
   requiresReset: Boolean
}

// Mapping the mutation to the resolver:

Mutation: {
   loginViewer: loginViewerMutation,
},


// Resolver:

const loginViewerMutation = async (obj, args) => {
   const { credentials } = args
   const user = await User.findOne({ email })
   if (!user) throw new GraphQLError('Email and password do not match')
   const matches = await user.comparePassword(password)
   if (!matches) throw new GraphQLError('Email and password do not match')
   return createJWT(user)
}

Затем мутация, как она называется внутри моего компонента Login:

const mutation = gql`
   mutation LoginViewer($password: String!, $email: String!) {
      loginViewer(credentials: { email: $email, password: $password }) {
         token
         expires
         requiresReset
      }
   }
`

export class Login extends React.Component {
   handleLogin = (credentials) => {
      this.props
         .mutate({ variables: { ...credentials } })
         .then(() => {
            // ...
         })
         .catch((error) => {
            console.log(error.message)
            console.log(error.graphQLErrors)
            // ...
         })
   }

   render() {
      // ...
   }
}

export default graqphql(mutation)(Login)

Все работает как положено, когда я предоставляю правильную информацию. Когда я не делаю, ошибка, которая поймана, не содержит GraphQLErrors.

Я использую промежуточное программное обеспечение apollo-link-error со стандартными настройками: https://www.apollographql.com/docs/link/links/error.html

Моя консоль выглядит так:

Ожидаемая ошибка аутентификации возвращается и регистрируется из промежуточного программного обеспечения. Но в моем компоненте Login массив error.graphQLErrors пуст.

Где я могу пойти не так?

• Неправильно возвращать 500 внутренних ошибок сервера - он ведет себя именно так, как я хочу. Я неправильно это реализую на сервере?

• Как графические ошибки теряются между промежуточным программным обеспечением регистрации и.catch(ошибка)?

Answer 1

Я задал этот вопрос в репозитории express-graphql github, они быстро указали, что решение - удалить ! на моем loginViewer мутация:

// Schema definition:

type Mutation {
   loginViewer(credentials: AUTH_CREDENTIALS): SignInPayload!
}

// Should be:

type Mutation {
   loginViewer(credentials: AUTH_CREDENTIALS): SignInPayload
}

Это ожидаемое поведение, поскольку ваше поле верхнего уровня (loginViewer) определено как ненулевое. Это означает, что при появлении ошибки в движке GraphQL нет никакой опции, кроме как сделать поле данных равным нулю:

Поскольку поля ненулевого типа не могут быть нулевыми, ошибки поля распространяются для обработки родительским полем. Если родительское поле может быть нулевым, тогда оно разрешается до нуля, в противном случае, если это не ненулевой тип, ошибка поля далее распространяется на его родительское поле.

Если все поля от корня запроса до источника ошибки возвращают ненулевые типы, то запись "данные" в ответе должна быть нулевой.

http://facebook.github.io/graphql/draft/

Если данные нулевые, это означает, что весь запрос не выполнен, и ответ express-graphql равен 500.