1

我试图在登录表单上显示一个简单的“电子邮件和密码不匹配”错误，但我遇到了麻烦，不确定我出错的地方是在服务器上还是在我的 React 应用程序中。我想我会在这里发帖，因为我不确定哪个 github repo 是合适的。这是服务器上的解析器：

// 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)
}

然后，在我的登录组件中调用突变：

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 Internal Server Error 似乎不正确——它的行为完全符合我的意愿。我是否在服务器上错误地实现了这一点？

  • graphQLErrors 如何在日志中间件和 .catch(error) 之间“丢失”？

4

1 回答 1

1

我在 express-graphql github repo 上问了这个问题，他们很快指出解决方案是删除!我的loginViewer突变：

// Schema definition:

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

// Should be:

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

这是预期的行为，因为您的顶级字段 (loginViewer) 定义为非空。这意味着当错误冒泡时，GraphQL 引擎除了使数据字段等于 null 之外别无选择：

由于 Non-Null 类型的字段不能为 null，因此字段错误被传播以由父字段处理。如果父字段可能为空，则它解析为空，否则如果它是非空类型，则字段错误会进一步传播到它的父字段。

如果从请求根到错误源的所有字段都返回非空类型，则响应中的“数据”条目应该为空。

http://facebook.github.io/graphql/draft/#sec-Errors-and-Non-Nullability

如果 data 为 null，则表示整个请求失败，并且 express-graphql 响应为 500。

于 2018-02-23T03:31:27.223 回答