GraphQL - Validação
Ao adicionar ou modificar dados, é importante validar a entrada do usuário. Por exemplo, podemos precisar garantir que o valor de um campo não seja sempre nulo. Podemos usar! (non-nullable) digite o marcador no GraphQL para realizar essa validação.
A sintaxe para usar o ! o marcador de tipo é conforme abaixo -
type TypeName {
   field1:String!,
   field2:String!,
   field3:Int!
} 
    A sintaxe acima garante que todos os campos não sejam nulos.
Se quisermos implementar regras adicionais, como verificar o comprimento de uma string ou se um número está dentro de um determinado intervalo, podemos definir validadores personalizados. A lógica de validação personalizada fará parte da função de resolução. Vamos entender isso com a ajuda de um exemplo.
Ilustração - Implementando Validadores Customizados
Vamos criar um formulário de inscrição com validação básica. O formulário terá campos de e-mail, nome e senha.
Etapa 1 - Baixe e instale as dependências necessárias para o projeto
Crie uma pasta chamada validation-app. Mude o diretório para validation-app no terminal. Siga as etapas 3 a 5 explicadas no capítulo Configuração do ambiente.
Etapa 2 - Criar um esquema
Adicionar schema.graphql arquivo na pasta do projeto validation-app e adicione o seguinte código -
type Query {
   greeting:String
}
type Mutation {
   signUp(input:SignUpInput):String
}
input SignUpInput {
   email:String!,
   password:String!,
   firstName:String!
} 
    Note- Podemos usar o tipo de entrada SignUpInput para reduzir o número de parâmetros na função de inscrição. Portanto, a função signUp leva apenas um parâmetro do tipo SignUpInput.
Etapa 3 - Criar resolvedores
Crie um arquivo resolvers.js na pasta do projeto e adicione o seguinte código -
const Query = {
   greeting:() => "Hello"
}
const Mutation ={
   signUp:(root,args,context,info) => {
      const {email,firstName,password} = args.input;
      const emailExpression = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
      
      const isValidEmail =  emailExpression.test(String(email).toLowerCase())
      if(!isValidEmail)
      throw new Error("email not in proper format")
      if(firstName.length > 15)
      throw new Error("firstName should be less than 15 characters")
      if(password.length < 8 )
      throw new Error("password should be minimum 8 characters")
      
      return "success";
   }
}
module.exports = {Query,Mutation} 
    A função de resolução, signUp, aceita os parâmetros email, password e firstName. Eles serão passados pela variável de entrada para que possam ser acessados por meio de args.input.
Etapa 4 - Executar o aplicativo
Crie um arquivo server.js. Consulte a etapa 8 no capítulo Configuração de ambiente. Execute o comando npm start no terminal. O servidor estará instalado e funcionando na porta 9000. Aqui, usaremos GraphiQL como um cliente para testar o aplicativo.
Abra o navegador e digite o URL http://localhost:9000/graphiql. Digite a seguinte consulta no editor -
mutation doSignUp($input:SignUpInput) {
   signUp(input:$input)
} 
    Como a entrada para a função de inscrição é um tipo complexo, precisamos usar variáveis de consulta no graphiql. Para isso, precisamos primeiro dar um nome à consulta e chamá-la doSignUp, a $ input é uma variável de consulta.
A seguinte variável de consulta deve ser inserida na guia de variáveis de consulta do Graphiql -
{
   "input":{
      "email": "abc@abc",
      "firstName": "kannan",
      "password": "pass@1234"
   }
} 
    A matriz de erros contém os detalhes dos erros de validação, conforme mostrado abaixo -
{
   "data": {
      "signUp": null
   },
   
   "errors": [
      {
         "message": "email not in proper format",
         "locations": [
            {
               "line": 2,
               "column": 4
            }
         ],
         "path": [
            "signUp"
         ]
      }
   ]
} 
    Temos que inserir uma entrada adequada para cada campo conforme fornecido abaixo -
{
   "input":{
      "email": "[email protected]",
      "firstName": "kannan",
      "password": "pass@1234"
   }
} 
    A resposta é a seguinte -
{
   "data": {
      "signUp": "success"
   }
} 
    Aqui, na consulta abaixo, não estamos atribuindo nenhuma senha.
{
   "input":{
      "email": "[email protected]",
      "firstName": "kannan"
   }
} 
    Se um campo obrigatório não for fornecido, o servidor qraphql exibirá o seguinte erro -
{
   "errors": [
      {
         "message": "Variable \"$input\" got invalid value {\"email\":\"[email protected]\",\"firstName\":\"kannan\"}; Field value.password of required type String! was not provided.",
         "locations": [
            {
               "line": 1,
               "column": 19
            }
         ]
      }
   ]
}