grpc-node在bff中的實踐（上）

前言

開始閱讀以前，先了解一下概念。rpc, gprc, protocol buffer,bff

什麼是grpc

• gRPC 是一個高性能、開源和通用的 RPC 框架，面向移動和 HTTP/2 設計，提供多語言支持。gRPC使用protocol buffers做爲其接口定義語言（IDL）和其基礎消息交換格式
• RPC（Remote Procedure Call）遠程過程調用。簡單來講，就是我在本地調用了一個函數，或者對象的方法，其實是調用了遠程機器上的函數，或者遠程對象的方法，可是這個通訊過程對於程序員來講是透明的。

grpc調用過程如圖1：

什麼是bff

簡單來時就是爲前端不一樣的設備創建對應的後端。如圖：

hello grpc

解決概念問題後，先來看看nodejs如何實現grpc server和client調用。如圖1

定義 protobuf

hello.proto

syntax = "proto3"; // 語法proto3

package greeter; // 包名

/**
package greeter 包含兩個service：Hello和 SelfIntro
message 定義了rpc方法參數和返回值的結構
*/

service Hello {
    rpc SayHello (SayHelloRequest) returns (SayHelloResponse) {}
}

service SelfIntro {
    rpc IntroMyself (SelfIntroRequest) returns (SelfIntroResponse) {}
}


message SayHelloRequest {
    string name = 1;
}

message SayHelloResponse {
    string message = 1;
}


message SelfIntroRequest {
    
}

message SelfIntroResponse {
    string job = 1;
}
複製代碼

grpc使用protobuf有兩種方式。 一種是使用Protobuf.js在運行時動態生成代碼，另外一種是使用protoc編譯器生成靜態的代碼（生成對應的結構和方法）。 本篇實例採用前者。

加載protobuf

const grpc = require("grpc")
const protoLoader = require("@grpc/proto-loader")
const packageDescripter = protoLoader.loadSync(
    __dirname+ '/../hello.proto',
    {
        keepCase: true
    }
)

const gretterPackage = grpc.loadPackageDefinition(packageDescripter).greeter
複製代碼

server實現

// ... load proto

/** * 實現rpc方法 SayHello，IntroMyself * 在50051端口啓動服務 */

function SayHello(call, callback) {
    callback(null, {message: 'Hello ' + call.request.name})
}

function IntroMyself(call, callback) {
    callback(null, {job: 'program enginner'})
}

function main() {
    const server = new grpc.Server()
    server.addService(gretterPackage.Hello.service, {
        SayHello,
    })
    server.addService(gretterPackage.SelfIntro.service, {
        IntroMyself,
    })

    server.bind('0.0.0.0:50051', grpc.ServerCredentials.createInsecure())
    server.start(() => {
        console.log('server runing on prot 50051')
    })
}
複製代碼

客戶端（stub）調用

// ... load proto

/** * 建立服務端存根（stub） * 調用遠程方法 */
function main () {
    // 指定遠端爲localhost:50051

    const stubHello = new gretterPackage.Hello('localhost:50051', grpc.credentials.createInsecure())
    const name = "joe"

    stubHello.SayHello({name}, (err, response) => {
        if (err) { return console.error(err) }
        console.log('Greeting: ', response.message)
    })


    const stubIntro = new gretterPackage.SelfIntro('localhost:50051', grpc.credentials.createInsecure())

    stubIntro.IntroMyself({}, (err, response) => {
        if (err) { return console.error(err) }
        console.log('SelfIntro: my job is', response.job)
    })
}

複製代碼

到此爲止咱們已經體驗了一個完整的grpc調用過程。一般定義protobuf和server實現由後端完成。node這一層建立客戶端，拿到rpc結果，以restful api的方式提供給前端

ts提效

咱們經過proto知道遠端定義那些service，有哪些prc方法，以及調用參數和返回值類型。因爲js是弱類型的語言，在實際應用中，沒有辦法校驗參數的合法性，也不能再寫代碼的時候提供補全提示等。爲此，引入ts解決以上問題。

可是，grpc只是支持nodejs。這就須要經過某種方式安卓proto文件生成對應的ts文件

解決那些問題

1. 代碼提示補全
2. 參數檢查

quick look

types.ts

// This file is auto generated by grpc-code-gen, do not edit!
// tslint:disable
export namespace greeter {
  export interface SayHelloRequest {
    'name'?: string;
  }


  export interface SayHelloResponse {
    'message'?: string;
  }


  export interface SelfIntroRequest {
  }


  export interface SelfIntroResponse {
    'job'?: string;
  }


}

複製代碼

greeter/Hello.ts

export interface IHello {
  $FILE_NAME: string;
  new (address: string, credentials: ChannelCredentials, options?: object): IHello;

  /** @deprecated 請使用: SayHelloV2 */
  SayHello(
    request: types.greeter.SayHelloRequest,
    options?: { timeout?: number; flags?: number; host?: string; }
  ): Promise<types.greeter.SayHelloResponse>;
  /** @deprecated 請使用: SayHelloV2 */
  SayHello(
    request: types.greeter.SayHelloRequest,
    metadata: MetadataMap,
    options?: { timeout?: number; flags?: number; host?: string; }
  ): Promise<types.greeter.SayHelloResponse>;
  
  SayHelloV2(option: {
    request: types.greeter.SayHelloRequest;
    metadata?: MetadataMap;
    options?: { timeout?: number; flags?: number; host?: string; };
  }): Promise<{ response:types.greeter.SayHelloResponse, metadata: Metadata }>;
}
export const hello: IHello = new greeter.Hello(`${serviceConfig.host}:${serviceConfig.port}`, credentials);
複製代碼

clinet.ts

import {hello} from "greeter/Hello.ts"
import * as types from "types"

export sayHello = (req: types.greeter.SayHelloRequest):  Promise<types.greeter.SayHelloResponse> => {
    return hello.SayHello(req)
}

sayHello({name: 'grpc'})
複製代碼