Membuat GraphQL Server dengan Apollo pada Express.js

Membuat GraphQL server dengan Apollo, Express dan autentikasi JWT

Photo by Nicolas Picard on Unsplash

Apollo (GraphQL) Server adalah salah satu GraphQL server yang mengikuti spesifikasi GraphQL dan kompatibel dengan berbagai macam GraphQL Client. Express.js adalah salah satu web framework pada pada Node.js. Kali ini kita akan melakukan implementasi GraphQL server dengan Apollo sebagai middleware pada Express (Node.js)

Implementasi

Project Overview

Pada project ini akan digunakan data dummy dalam bentuk array yang tersimpan dalam file .js pada direktori data. Ada 3 macam entitas data, namun hanya pada entitas author dan book yang bisa dilakukan operasi CRUD melalui GraphQL. Entitas user digunakan untuk autentikasi dan otorisasi saja.

Berikut adalah struktur direktori dari project yang dibuat :

Dependensi

Berikut adalah dependensi yang digunakan dalam project ini.

"dependencies": {
    "@apollo/server": "^4.10.4",
    "body-parser": "^1.20.2",
    "cors": "^2.8.5",
    "graphql": "^16.8.1",
    "jsonwebtoken": "^9.0.2"
  }

Environment

Kemudian untuk development environment adalah sebagai berikut.

$ node -v
v.22.0.0

$ npm -v
10.5.1

Schema

Pada bagian schema graphql, akan ada 3 tipe object yang akan didefinisikan, yaitu :

1. Query : untuk operasi pengambilan (query) data
2. Mutation : untuk operasi pengubahan data
3. Input : untuk struktur input data dalam operasi ubah data

Pada project ini akan ada 2 entitas yang digunakan, yaitu Book dan Author.

Schema Definition

Resolver

Pada bagian resolver, operasi data dilakukan melalui function dari service untuk masing - masing entitas. Pada bagian mutation ada pengecekan otoritas sebelum operasi data. Sehingga user perlu melakukan autentikasi untuk sebelum operasi ubah data.

Data Resolver

Controller

Pada bagian controller, hanya akan ada function untuk melakukan login.

Authentication Controller

Helper / Utils

Pada bagian helper, akan berisi implementasi logic untuk melakukan autentikasi dan otorisasi.

Authentication Helper

Custom Error

Pada project ini juga didefinisikan exception berupa graphql custom error, yang bisa ditampilkan ketika terjadi kesalahan dalam proses autentikasi atau otorisasi.

GraphQL Custom Error

Entry Point

Pada bagian ini dilakukan setup untuk berbagai hal terkait server, mulai dari inisiasi http server, hingga setup GraphQL Server sebagai middleware dalam express.js.

Server entry point

Testing

Authentication

Berikut adalah proses autentikasi yang dilakukan dengan Postman. Autentikasi dilakukan dengan mengakses endpoint login dan dengan mengirimkan data berupa username dan password. Lalu akan mendapatkan bearer token jika sukses. Token ini akan diperlukan ketika akan melakukan mutation atau perubahan data melalui graphql.

Authentication using Postman

Query - All Author

Pada gambar di bawah adalah contoh proses operasi query graphql dari data daftar Author yang dilakukan melalui sandbox.

Query list data Author

Query - Selected Author

Pada gambar di bawah adalah contoh proses operasi query graphql dari data salah satu Author yang dilakukan melalui sandbox.

Query selected data Author

Mutation - Create Author

Pada gambar di bawah adalah contoh proses operasi mutation graphql untuk menambahkan data Author baru yang dilakukan melalui sandbox.

Mutation create Author

Untuk melakukan proses mutation diperlukan menyertakan bearer token yang didapat setelah melakukan proses autensikasi. Token tersebut, disertakan sebagai value dari header Authorization.

Authorization Header (Token)

Jika tidak menyertakan token yang valid, maka ketika melakukan operasi mutation akan muncul error seperti berikut.

Custom error Unauthenticated User.

Mutation - Update Author

Pada gambar di bawah adalah contoh proses operasi mutation graphql untuk mengubah data Author yang dilakukan melalui sandbox.

Mutation update Author

Mutation - Delete Author

Pada gambar di bawah adalah contoh proses operasi mutation graphql untuk menghapus data Author yang dilakukan melalui sandbox.

Mutation delete Author

Penutup

Kata Penutup

Apollo GraphQL Server bisa diimplementasikan pada Express.js (Node.js) sebagai middleware. Dengan demikian, maka express dapat berlaku sebagai server GraphQL sekaligus sebagai API Server konvensional. Semoga tulisan kali ini bermanfaat. Sampai jumpa di tulisan selanjutnya. Salam.

Baca Lebih Lanjut

1. Apollo - Migrating to Apollo Server 4
2. Apollo - GraphQL Schema Basic
3. Apollo - Resolvers
4. Apollo - Authentication and Authorization