1. Overview
GraphQL has been widely used as a pattern of communication in web services. The basic premise of GraphQL is to be flexible in use by client-side applications.
In this tutorial, we’ll look into another aspect of flexibility. We’ll also explore how a GraphQL field can be exposed with a different name.
2. GraphQL Schema
Let us take an example of a blog having Posts by different Authors. The GraphQL schema looks something like this:
query {
recentPosts(count: 1, offset: 0){
id
title
text
category
author {
id
name
thumbnail
}
}
}
type Post {
id: ID!
title: String!
text: String!
category: String
authorId: Author!
}
type Author {
id: ID!
name: String!
thumbnail: String
posts: [Post]!
}
Here we can fetch recent posts. Every post will be accompanied by its author. The result of the query is as follows:
{
"data": {
"recentPosts": [
{
"id": "Post00",
"title": "Post 0:0",
"text": "Post 0 + by author 0",
"category": null,
"author": {
"id": "Author0",
"name": "Author 0",
"thumbnail": "http://example.com/authors/0"
}
}
]
}
}
3. Exposing GraphQL Field with a Different Name
A client-side application may require to use of the field first_author. Right now, it’s using the author. To accommodate this requirement, we have two solutions:
- Change the definition of the schema in the GraphQL server
- Make use of the concept of Aliases in GraphQL
Let’s look at both one by one.
3.1. Changing Schema
Let’s update the schema definition of the post:
type Post {
id: ID!
title: String!
text: String!
category: String
first_author: Author!
}
The author isn’t a trivial field. It’s a complex one. We’ll also have to update the handler method to accommodate this change.
The method author(Post post), marked with @SchemaMapping in PostController, will need to be updated to getFirst_author(Post post). Alternatively, the field attribute has to be added in the @SchemaMapping to reflect the new field name.
Here’s the query:
query{
recentPosts(count: 1,offset: 0){
id
title
text
category
first_author{
id
name
thumbnail
}
}
}
The result of the above query is as follows:
{
"data": {
"recentPosts": [
{
"id": "Post00",
"title": "Post 0:0",
"text": "Post 0 + by author 0",
"category": null,
"first_author": {
"id": "Author0",
"name": "Author 0",
"thumbnail": "http://example.com/authors/0"
}
}
]
}
}
This solution has two main issues:
- It is introducing changes to the schema and server-side implementation
- It is forcing other client-side applications to follow this updated schema definition
These issues contradict the flexibility feature GraphQL offers.
3.2. GraphQL Aliases
Aliases, in GraphQL, let us rename the result of a field to anything we want without changing the schema definition. To introduce an alias in a query, the alias and colon symbol (:) have to precede the GraphQL field.
Here’s the demonstration of the query:
query {
recentPosts(count: 1,offset: 0) {
id
title
text
category
first_author:author {
id
name
thumbnail
}
}
}
The result of the above query is as follows:
{
"data": {
"recentPosts": [
{
"id": "Post00",
"title": "Post 0:0",
"text": "Post 0 + by author 0",
"category": null,
"first_author": {
"id": "Author0",
"name": "Author 0",
"thumbnail": "http://example.com/authors/0"
}
}
]
}
}
Let’s notice that the query itself is requesting the first post. Another client-side application may request to have first_post instead of recentPosts. Again, Aliases will come to the rescue.
query {
first_post: recentPosts(count: 1,offset: 0) {
id
title
text
category
author {
id
name
thumbnail
}
}
}
The result of the above query is as follows:
{
"data": {
"first_post": [
{
"id": "Post00",
"title": "Post 0:0",
"text": "Post 0 + by author 0",
"category": null,
"author": {
"id": "Author0",
"name": "Author 0",
"thumbnail": "http://example.com/authors/0"
}
}
]
}
}
These two examples clearly show how flexible it is to work with GraphQL. Every client-side application can update itself according to the requirement. Meanwhile, the server-side schema definition and implementation stay the same.
4. Conclusion
In this article, we’ve looked into two ways of exposing a graphQL field with a different name. We’ve introduced the concept of Aliases with examples and explained how it is the right approach.
As always, the example code for this article is available over on GitHub.
