Ikhtisar
Klien HTTP berbasis RxJS yang aman untuk TypeScript dan adaptor Next.js/RSocket opsional
@byeolnaerim/typed-rx-httpadalah klien HTTP yang menyuntikkan tipe Paths gaya OpenAPI untuk memeriksa tipe URL, metode HTTP, parameter path/query, dan body permintaan, serta mengembalikan hasil sebagai Observable RxJS.
Apa yang saya inginkan dari pustaka ini bukanlah abstraksi HTTP yang rumit. Saya ingin mengimpor fungsi yang dihasilkan dan memanggilnya langsung tanpa menulis ulang URL dan DTO request/response yang baru saja ditulis di backend.
Metode penggunaan dasar Core
Alur dasar adalah menyiapkan tipe Paths gaya OpenAPI, membuat HeaderStore jika perlu, lalu membuat klien dengan createHttpClient<Paths>() dan memanggil callApi<R>(). Generator service otomatis atau backend WebFlux bukan syarat wajib untuk alur ini.
Tipe permintaan ditentukan oleh Paths, dan tipe respons dipilih oleh pemanggil dari R di callApi<R>(). Tidak ada ResponseWrapper tertentu yang dipaksakan. NDJSON, cache CSR, otentikasi sesi, serta fitur Next.js dan RSocket hanya ditambahkan jika diperlukan.
Kisah asal
Saya menggunakan Next.js dan TypeScript di frontend, dan Java serta WebFlux di backend. Dengan kombinasi ini, saya sering kali harus menulis konten yang sama di kedua sisi.
Di backend, saya membuat entity dan DTO request/response serta menulis endpoint. Namun, untuk memanggil endpoint itu di frontend, saya harus mengetik ulang URL dan membuat tipe atau interface yang hampir sama dengan DTO backend. Jujur saja, itu tidak berbeda dengan menulis ulang apa yang saya buat di backend di frontend.
Pengulangan ini tidak hanya meningkatkan jumlah kode, tetapi juga meningkatkan kemungkinan terlewatnya perubahan pada field atau URL di satu sisi. Oleh karena itu, saya merasakan kebutuhan mendesak untuk menghasilkan kode client HTTP frontend yang dapat diprediksi dari spesifikasi REST API backend.
Dalam proses itu, saya menerapkan prototipe untuk backend di proyek nyata nplauction.comreactive-mongo-dsldanwebflux-fe-dev-assistantprototipe typed-rx-http di frontend. typed-rx-http lebih merupakan pustaka yang muncul sebagai tambahan saat saya membuat webflux-fe-dev-assistant dan membuat pasangan yang diperlukan di frontend.
Metode penggunaan dalam proyek pembuatan otomatis Swagger
Dalam proyek yang menggunakan otomatisasi pembuatan layanan Swagger, createHttpClientsaya tidak menulis URL setiap kali. Saya hanya membuat commonService.tsbuat satu adapter HTTP publik milik proyek, dan hanya impor fungsi layanan yang dihasilkan dari OpenAPI untuk digunakan. commonService.ts bukan nama file yang dihasilkan oleh pustaka, tetapi nama file yang ditentukan oleh proyek, dan Anda dapat memeriksa seluruh kode terlebih dahulu di dokumen memulai/HTTP Client.
const response = await firstValueFrom(
workplacesSearch({ params: { keyword: "kim" } }),
);Kode di atas tidak memiliki URL string atau interface response yang ditulis secara manual. URL, metode HTTP, tipe parameter, dan tipe response termasuk dalam service yang dihasilkan. Satu respons dapat diterima sebagai firstValueFromdan permintaan yang memiliki beberapa nilai yang berurutan seperti kemajuan pekerjaan dapat diterima sebagaisubscribe.
Di mana yang paling cocok?
Jika backend dan frontend terpisah dan backend dapat menyediakanswagger.jsonyang valid, maka pekerjaan berulang di frontend TypeScript dapat dikurangi. Jika menggunakan endpoint fungsional Java WebFlux, Anda dapat menghubungkan pembuatan dokumen hingga pembuatan service dengan webflux-fe-dev-assistant.
typed-rx-http Core tidak bergantung pada WebFlux. Ini adalah TypeScript yang kompatibel dengan spesifikasi OpenAPI terlepas dari implementasi backend. paths Jika ada tipe, ini dapat digunakan untuk mengurangi pekerjaan menulis URL string dan tipe permintaan secara manual setiap kali. Klien RSocket dapat digunakan langsung dari titik masuk /rsocket, dan AsyncAPI generator hanya dapat digunakan di proyek yang memerlukan otomatisasi pembuatan layanan route/request/response.