Saat ini, di dunia pengembang modern, sangat mustahil membayangkan hidup tanpa teknologi seperti React, Node JS, GraphQL, dan sebagainya. Mereka memiliki peringkat yang kuat dan memegang posisi terdepan dalam pengiriman data. 70% kasus yang saya temui adalah proyek yang terintegrasi dengan GraphQL atau akan bermigrasi ke sana. Semakin banyak perusahaan lebih memilih untuk menggunakan sintaks kueri data Graphql dan saat ini sintaksis tersebut merupakan pengetahuan yang harus dimiliki.

GraphQL adalah bahasa tipe kueri untuk API yang banyak digunakan untuk meminta data dari sisi server ke sisi klien dalam materi yang dioptimalkan. Klien meminta apa yang mereka butuhkan menggunakan skema yang diketik. Ini memungkinkan Anda mengirim hanya apa yang diminta, bukan kumpulan data tetap.

Apollo Server memberi Anda alat untuk mengirimkan respons terhadap permintaan klien. Klien Apollo memberikan kemampuan untuk menggunakan API Graphql termasuk cache dan tautan.

Tentang apa ini?

Kami akan membuat dua Server Apollo yang akan menangani penggabungan skema Graphql. Ini adalah situasi ketika beberapa server eksternal merespons dengan Graphql API dan beberapa layanan lain menggunakan skema GraphQL mereka sendiri termasuk skema eksternal. Pada lapisan Node, kita akan menggabungkan hasil dari server eksternal dalam satu skema dan mengirimkannya ke klien. Secara harfiah, kita hanya akan menggabungkan dua skema menjadi satu dan mengirimkannya ke klien.

Mari selami kodenya

Untuk implementasinya, kami akan menggunakan lingkungan Node JS, middleware Koa, dan Server Apollo dengan Alat GraphQL.

Kita harus menjalankan dua server. Keduanya harus memiliki Server Apollo GraphQL. Berikut diagramnya.

Saatnya membuat boilerplate dan menjalankan keduanya. Untuk itu kita perlu membuat dua folder dan memberi nama satu folder seperti ini: boilerplate-raphql-koa-server-external dan folder kedua seperti ini: boilerplate-graphql-koa-server

Sebelum memulai silakan lihat struktur folder di kedua proyek. Cukup mudah. Perbedaan antara kedua repo tersebut terletak pada kodenya.

├── package.json
└── src
    ├── index.js
    ├── resolvers.js
    └── schema.js

Server GraphQL Eksternal

Sekarang, mari kita siapkan boilerplate-graphql-koa-server-external

Lalu mari kita buat servernya sendiri. Di folder src diindex.js tambahkan pengaturan server:

Fungsi async serverakan menangani aplikasi koa itu sendiri dan kita akan membuat server apollo dengan skema yang dapat dieksekusi di mana kita harus menyediakan tipe dari skema dan penyelesai. Dari dokumen resmi, kita harus menelepon apopServer.start() terlebih dahulu sebelum apolloServer.applyMiddleware . Hal ini memungkinkan untuk mengidentifikasi potensi masalah dan mengambil tindakan jika proses di startup Server Apollo terhenti untuk mulai melayani permintaan.

Bagian kedua adalah skema dan penyelesai pengaturan boilerplate-graphql-koa-server-externalmari.

Resolver untuk skema.

Sekarang saatnya memeriksa respons server. Sebelum itu jangan lupa install paket: npm i lalu jalankan perintah npm run start dan masukkan URL di browser Chrome: http://localhost:4000/api/v1/graphql. Klik pada tombol "Permintaan server Anda" dan Anda bisa mendapatkan antarmuka apollographql. Ini memungkinkan Anda melihat skema yang diminta dari server. Buka halaman Skema Introspeksi. Anda akan melihat skema kami di sana:

Jika Anda dapat melakukan introspeksi skema maka itu berarti kita sudah selesai dengan boilerplate-graphql-koa-server-external kita

Server GraphQL untuk Menggabungkan Skema

Sekarang mari beralih ke boilerplate-graphql-koa-server penyiapan. Hampir semuanya sama di package.json dari external tetapi dengan paket tambahan dan PORT, nama dan deskripsi yang berbeda.

Mari segera siapkan skema baru. Ada hampir sama tetapi datanya sedikit berbeda dalam skema.

Dan penyelesainya:

Dan sekarang mari kita lihat file servernya. Anda dapat mengetahui bahwa itu relatif sama kecuali beberapa baris kode. Pertama-tama, kami mengambil loadSchema untuk mendapatkan skema eksternal berdasarkan permintaan dari EXTERNAL_ENDPOINT yang merupakan server pertama kami yang diluncurkan dan pemuat untuk skema UrlLoader .

Yang paling penting adalah kita harus memastikan bahwa skema kita telah dimuat dan server eksternal tidak menimbulkan kesalahan apa pun. Kita harus menangkap situasi itu. Seperti yang Anda lihat di kode, kami hanya mendapatkan serangkaian skema. Secara default, kami hanya memiliki internalSchema kami sendiri dan kemudian, jika server eksternal tersedia, kami mendorong ke array externalSchema tersebut dan kemudian menggunakan alat mergeSchemas yang membantu menyediakan skema gabungan langsung ke ApolloServer

Instal semua paket dan jalankan server yang akan tersedia di PORT=3000 . Mari kita pergi ke antarmuka apollographql yang sama, tetapi URL harus dengan PORT yang tepat: http://localhost:3000/api/v1/graphql . Sekarang jika kita membuka halaman Skema Introspeksi kita akan dapat melihat skema gabungan. Satu dari eksternal dan satu lagi dari server yang terakhir dibuat.

Ingatlah bahwa jika beberapa server Anda mendapatkan Bidang yang sama, server GraphQL akan memunculkan kesalahan, seperti ini:

Error: Unable to merge GraphQL type “Query”: Field “getFakeDataExample” already defined with a different type. Declared as “DataExample”, but you tried to override with “DataExternalExample”

Artinya kita harus sangat berhati-hati dalam skema GraphQL dengan definisi Bidang dan Tipe agar tidak mengalami situasi yang canggung ketika Tipe atau Bidang sudah ada.

Repo GitHub
https://github.com/antonkalik/boilerplate-graphql-koa-server
https://github.com/antonkalik/boilerplate-graphql -koa-server-eksternal

Skema Memuat Dokumen
https://www.graphql-tools.com/docs/schema-loading

Kesimpulan

Banyak perusahaan beralih ke arsitektur layanan mikro dan mencoba mengisolasi logika aliran data. Pendekatan yang saya jelaskan di atas cocok untuk kasus komunikasi antar layanan mikro di perusahaan ketika ada beberapa jenis layanan global dengan skema default dan layanan mikro kecil dengan bidang tambahan yang akan digunakan oleh klien di masa mendatang.

Terima kasih atas perhatian Anda.