GraphQL introduction

What is a GraphQL

GraphQL is a set of query language developed by Facebook. Like Restful query specification, it is a specification for front and back end data interaction, not a query language like SQL.

GraphQL and Restful

  • Restful: mainstream of the interaction specification before and after the end, and the process of development, short and concise, can understand the meaning of the interface, will not bring additional development complexity, but the interface of the data returned is fixed, if front need only part of the data, then the interface returned or all of the data, will lead to additional resources waste
  • GraphQL: The idea of GraphQL is to allow the front end to control the return of the fields of interface data, so as to increase the flexibility of the interface. Besides, the increase and change of interface data does not bring interface upgrade and maintain multiple sets of interfaces. However, it is more complicated than Restful

GraphQL query specification

GraphQL defines a set of query specifications that allow the front end to control the data to be queried. Flexible control of the query attribute objects is just a specification

Common query specifications:

Fields (Fileds)

In the GraphQL query, the request structure contains the structure of the expected result of the lock, which is called the field. The structure of the response data remains consistent with the structure of the request

  • grammar

    The syntax looks similar to JSON, but is a custom query language that allows you to customize the query object or field

    {
    	hero {
    		name
        	id
    	}
    }
    
    // response
    {
        "data": {
            "hero": {
                "name": "xx"."id": 1}}}Copy the code
    • heroRepresents the object that defines the query, so the fields in Hero need to be defined in the object in Hero
    • nameRepresents the query field, the name field of the Hero object
Arguments

GraphQL query can also carry parameters and pass parameters to the server for data query

  • grammar

    {
    	hero(id: 11) {
    		name
    	}
    }
    
    // response
    {
        "data": {
            "hero": {
                "name": "xx"}}}Copy the code
    • Fields defined in ()** are passed as arguments by adding **() to the back end of the object
Aliases

If you need to query more than one object at a time, you need to define an alias for each object, otherwise the returned data will have problems parsing JSON

  • grammar

    {
    	GaiHero: hero(id: 11) {
    		name
    	}
    	JaxHero: hero(id: 22) {
    		name
    	}
    }
    
    // response
    {
        "data": {
            "GaiHero": {
                "name": "gailun"
            },
            "JaxHero": {
                "name": "jax"}}}Copy the code
    • GaiHero,jaxHeroRepresented as aheroThe alias of the object definition. In the returned JSON data, the property name of the field is also the alias name to return
Fragment

If multiple objects are the same and the same fields are queried, there will be a lot of repetitive code, which can be encapsulated using fragments (similar to SQL tags in Mybatis).

  • grammar

    {
    	GaiHero: hero(id: 11) {
    		...allFields
    	}
    	JaxHero: hero(id: 22) {
    		...allFields
    	}
    }
    
    fragment allFields on Character {
    	id
    	name
    	friends {
    		name
    	}
    }
    Copy the code
    • usingfragmentIt is possible to encapsulate the fields of a query and expand them by extending operators

Schemal and type specifications

Schemal

Schemal is used to define data structures, such as what properties are in an object and how objects relate to each other

  • grammar

    schemal {  // Define a query, equivalent to a namespace
    	query: UserQuery
    }
    
    type UserQuery {  // Define the type of query, which represents the front-end query request, used to process the query request
    	user(id: ID): User // Specify the query name and parameters, and the type of the query object. ID is also a type. 'user(ID: ID)' indicates the name and parameter type of the query structure defined by the front end
    }
    
    type User {
    	id:ID!
    	name: String
    	age: Int
    }
    Copy the code
    • !A trailing symbol indicates that the parameter is non-empty
type
  • Basic types of

    • Int: 32-bit signed integer
    • String: String type
    • Boolean: true or false
    • ID: Unique identifier
    • Float: signed double-precision floating-point value
  • Enumerated type

    The value of a restricted field in an optional collection can only be a value in the defined enumeration

    enum CATAGORY {
    	FRONT
    	END
    	MIDDLE
    }
    
    type Human {
    	name: string
    	kind: [CATAGORY]
    }
    Copy the code

    Enumerated types need to be represented in collections

  • interface

    Interfaces are abstract types and can also be implemented with implements, which must contain all properties in the interface

    interface Human {
    	id: ID!
    	name: String
    }
    
    type editor implements IDE {
    	id: ID!
    	name: String
    	age: Int
    }
    Copy the code

    In addition to containing properties defined in the interface, an implementation class can have its own fields