gRPC pour TypeScript : bibliothèques et exemples d'utilisation

gRPC pour TypeScript : bibliothèques et exemples

\n\n

gRPC est un framework RPC haute performance de Google, fonctionnant sur HTTP/2 et utilisant Protocol Buffers (protobuf) pour la sérialisation des données. En TypeScript (et Node.js), gRPC permet de construire des architectures de microservices efficaces avec prise en charge des flux et de la communication bidirectionnelle. Sur cette page, nous allons passer en revue les bibliothèques principales, la configuration de l'environnement de travail et écrire un exemple fonctionnel d'application client-serveur.

\n\n

Bibliothèques principales pour gRPC en TypeScript

\n\n

Pour travailler avec gRPC dans l'écosystème TypeScript, il existe trois packages clés :

\n\n

\n
• @grpc/grpc-js — une implémentation pure JavaScript de gRPC (sans dépendances natives), prenant entièrement en charge HTTP/2 et fonctionnant avec Node.js 12+.
\n
• @grpc/proto-loader — un chargeur de fichiers .proto, créant dynamiquement des classes JavaScript basées sur les définitions protobuf.
\n
• ts-proto — un générateur de types TypeScript à partir de fichiers proto. Une alternative à grpc-tools intégré, mais avec un meilleur support du typage strict.
\n

\n\n

Installation de tous les composants en une seule commande :

\n\n

npm install @grpc/grpc-js @grpc/proto-loader ts-proto\nnpm install -D typescript @types/node

\n\n

Création du fichier .proto

\n\n

Commençons par définir le service. Créez un fichier hello.proto :

\n\n

syntax = "proto3";\n\npackage hello;\n\nservice Greeter {\n  rpc SayHello (HelloRequest) returns (HelloReply);\n  rpc SayHelloStream (HelloRequest) returns (stream HelloReply);\n}\n\nmessage HelloRequest {\n  string name = 1;\n}\n\nmessage HelloReply {\n  string message = 1;\n}

\n\n

Génération de types TypeScript avec ts-proto

\n\n

ts-proto crée des interfaces et des classes de messages complètes. Installez protoc et le plugin :

\n\n

npm install -g protoc-gen-ts-proto\nprotoc --ts_proto_out=./generated hello.proto

\n\n

Le résultat sera un fichier generated/hello.ts avec les interfaces HelloRequest, HelloReply et le service typé GreeterClient.

\n\n

Partie serveur (serveur gRPC en TypeScript)

\n\n

Créez un fichier server.ts :

\n\n

import * as grpc from '@grpc/grpc-js';\nimport * as protoLoader from '@grpc/proto-loader';\nimport { ProtoGrpcType } from './generated/hello';\n\nconst packageDef = protoLoader.loadSync('hello.proto');\nconst grpcObj = (grpc.loadPackageDefinition(packageDef) as unknown) as ProtoGrpcType;\nconst server = new grpc.Server();\n\nserver.addService(grpcObj.hello.Greeter.service, {\n  SayHello: (call: any, callback: any) => {\n    const name = call.request.name;\n    callback(null, { message: `Bonjour, ${name}!` });\n  },\n  SayHelloStream: (call: any) => {\n    const name = call.request.name;\n    for (let i = 0; i < 5; i++) {\n      call.write({ message: `Message ${i + 1} pour ${name}` });\n    }\n    call.end();\n  }\n});\n\nserver.bindAsync('0.0.0.0:50051', grpc.ServerCredentials.createInsecure(), () => {\n  console.log('Serveur démarré sur le port 50051');\n});

\n\n

Partie cliente (client gRPC en TypeScript)

\n\n

Créez un fichier client.ts :

\n\n

import * as grpc from '@grpc/grpc-js';\nimport * as protoLoader from '@grpc/proto-loader';\nimport { ProtoGrpcType } from './generated/hello';\n\nconst packageDef = protoLoader.loadSync('hello.proto');\nconst grpcObj = (grpc.loadPackageDefinition(packageDef) as unknown) as ProtoGrpcType;\n\nconst client = new grpcObj.hello.Greeter(\n  'localhost:50051',\n  grpc.credentials.createInsecure()\n);\n\n// Appel unaire\nclient.SayHello({ name: 'Alice' }, (err, response) => {\n  if (!err) console.log('Réponse :', response?.message);\n});\n\n// Appel avec flux serveur\nconst stream = client.SayHelloStream({ name: 'Bob' });\nstream.on('data', (data) => console.log('Flux :', data.message));\nstream.on('end', (