GraphQL - Doğrulama

Veri eklerken veya değiştirirken, kullanıcı girişini doğrulamak önemlidir. Örneğin, bir alanın değerinin her zaman boş olmamasını sağlamamız gerekebilir. Kullanabiliriz! (non-nullable) Böyle bir doğrulamayı gerçekleştirmek için GraphQL'de işaretleyici yazın.

Kullanmak için sözdizimi ! tip işaretçisi aşağıda verildiği gibidir -

type TypeName {
   field1:String!,
   field2:String!,
   field3:Int!
}

Yukarıdaki sözdizimi, tüm alanların boş olmamasını sağlar.

Bir dizginin uzunluğunu kontrol etmek veya bir sayının belirli bir aralıkta olup olmadığını kontrol etmek gibi ek kurallar uygulamak istiyorsak, özel doğrulayıcılar tanımlayabiliriz. Özel doğrulama mantığı, çözümleyici işlevinin bir parçası olacaktır. Bunu bir örnek yardımıyla anlayalım.

Örnek - Özel Doğrulayıcıları Uygulama

Temel doğrulama ile bir kayıt formu oluşturalım. Formda e-posta, ad ve şifre alanları olacaktır.

Adım 1 - Proje için Gerekli Bağımlılıkları İndirin ve Yükleyin

Adlı bir klasör oluşturun validation-app. Dizini terminalden validation-app olarak değiştirin. Ortam Kurulumu bölümünde açıklanan 3 ila 5 arasındaki adımları izleyin.

Adım 2 - Şema Oluşturun

Ekle schema.graphql proje klasöründeki dosya validation-app ve aşağıdaki kodu ekleyin -

type Query {
   greeting:String
}

type Mutation {
   signUp(input:SignUpInput):String
}

input SignUpInput {
   email:String!,
   password:String!,
   firstName:String!
}

Note- SignUp işlevindeki parametre sayısını azaltmak için SignUpInput girdi tipini kullanabiliriz. Bu nedenle, signUp işlevi SignUpInput türünde yalnızca bir parametre alır.

Adım 3 - Çözücüler Oluşturun

Bir dosya oluştur resolvers.js proje klasörüne ve aşağıdaki kodu ekleyin -

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}

Çözümleyici işlevi olan signUp, e-posta, şifre ve firstName parametrelerini kabul eder. Bunlar, args.input aracılığıyla erişilebilmesi için input değişkeninden geçirilecektir.

Adım 4 - Uygulamayı Çalıştırın

Bir server.js dosyası oluşturun. Ortam Kurulum Bölümünde 8. adıma bakın. Terminalde npm start komutunu yürütün . Sunucu, 9000 portunda çalışır durumda olacaktır. Burada, uygulamayı test etmek için bir istemci olarak GraphiQL kullanacağız.

Tarayıcıyı açın ve URL'yi girin http://localhost:9000/graphiql. Düzenleyiciye aşağıdaki sorguyu yazın -

mutation doSignUp($input:SignUpInput) {
   signUp(input:$input)
}

Kaydolma işlevi girdisi karmaşık bir tür olduğundan, graphiql'de sorgu değişkenlerini kullanmamız gerekir. Bunun için önce sorguya bir isim vermemiz ve ona doSignUp dememiz gerekiyor, $ input bir sorgu değişkenidir.

Graphiql'nin sorgu değişkenleri sekmesine aşağıdaki sorgu değişkeni girilmelidir -

{
   "input":{
      "email": "abc@abc",
      "firstName": "kannan",
      "password": "pass@1234"
   }
}

Hatalar dizisi, aşağıda gösterildiği gibi doğrulama hatalarının ayrıntılarını içerir -

{
   "data": {
      "signUp": null
   },
   
   "errors": [
      {
         "message": "email not in proper format",
         "locations": [
            {
               "line": 2,
               "column": 4
            }
         ],
         "path": [
            "signUp"
         ]
      }
   ]
}

Her alan için aşağıda belirtildiği gibi uygun bir girdi girmeliyiz -

{
   "input":{
      "email": "[email protected]",
      "firstName": "kannan",
      "password": "pass@1234"
   }
}

Cevap aşağıdaki gibidir -

{
   "data": {
      "signUp": "success"
   }
}

Burada, aşağıdaki sorguda herhangi bir şifre tahsis etmiyoruz.

{
   "input":{
      "email": "[email protected]",
      "firstName": "kannan"
   }
}

Gerekli bir alan sağlanmadıysa, qraphql sunucusu aşağıdaki hatayı görüntüler -

{
   "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
            }
         ]
      }
   ]
}