web-dev-qa-db-fra.com

Client Apollo: comment déboguer simplement une erreur de code 400?

J'utilise Apollo-client et je ne comprends pas pourquoi il est si difficile de déboguer mon erreur: Il se termine avec un code d'erreur 400, et je n'ai aucun moyen de récupérer les informations.

Par exemple, lorsque je teste mon service graphene sur l'interface/graphQL, il me renvoie des erreurs utiles telles qu'une mauvaise entrée ou un mauvais nom de méthode. Ici, sur le client apollo, cela ne me jette une erreur de code 400. Cela ne m'aide pas du tout. Donc, est-il possible d'avoir les informations d'erreur de graphene de mon client Apolo, au lieu d'une erreur de code 400 inutile?

Voici un exemple, tiré de mon interface graphene (/ graphQL):

mutation myMutation {
  uploadFile(input:"") {
    success
  }
}

affichera:

{
  "errors": [
    {
      "message": "Argument \"input\" has invalid value \"\".\nExpected \"UploadFileMutationInput\", found not an object.",
      "locations": [
        {
          "column": 20,
          "line": 2
        }
      ]
    }
  ]
}

Quand j'essaie la même chose sur le client apollo (js):

client.mutate({
  mutation: gql`
    mutation($file: Upload!) {
      uploadFile(input: $file) {
        success
      }
    }
  `,
  variables: { file } })
  .then(console.log)
  .catch((e) => { console.log("catch", e) })

Je reçois Error: Network error: Response not successful: Received status code 400

Ma prise n'est jamais appelée et la documentation ne m'aide pas du tout.

Ce que je veux, c'est obtenir les erreurs de détail de la mutation de mes appels: lorsque j'utilise un appel de méthode incorrect ou un type d'entrée incorrect, je ne dois pas tomber dans un 400 sans aucune information indiquant en quoi ma demande est mauvaise. 

debugginggraphqlapollo
5
Mr Bonjour

Vous devez utiliser ce lien: https://www.npmjs.com/package/apollo-link-error lors de l’instanciation de ApolloClient. Il devrait aller avant les autres liens, comme ceci:

import { ApolloClient, ApolloLink } from 'apollo-boost'
import { onError } from 'apollo-link-error'

const errorLink = onError(({ graphQLErrors }) => {
  if (graphQLErrors) graphQLErrors.map(({ message }) => console.log(message))
})

new ApolloClient({
  ...
  link: ApolloLink.from([errorLink, authLink, restLink, httpLink]),
})
6
Yan Takushevich

Cette solution l'a résolu pour moi:

const client = new ApolloClient({
  uri: 'http://localhost:4444/graphql',
  onError: ({ networkError, graphQLErrors }) => {
    console.log('graphQLErrors', graphQLErrors)
    console.log('networkError', networkError)
  }
})
2
Fellow Stranger

J'ai réussi à le faire en mettant une fonction onError dans la configuration du client directement (graphQLErrors est toujours vide quand on le fait dans la mutation):

const client = new ApolloClient({
  uri: 'http://localhost:3000/graphql',
  onError: (e) => { console.log(e) },
});
0
Almaju