はじめに

GRPCは、オープンソース、最初にGoogleで開発された現代のRPCフレームワークです.これは、インターフェイス記述言語としてプロトコルバッファを使用し、Protobufは、構造化データをシリアル化するためのメカニズムです.あなたはちょうどprotoファイルであなたのサービスとそのデータ構造を定義します、そして、GRPCはいろいろな言語とプラットホームであなたのサービスのためにクライアントとサーバー突出部を自動的に生成します.Profobufを使用するとJSONの代わりにバイナリを使用して通信することができます、これはGRPCはるかに高速かつ信頼性の高い.GRPCの他の重要な特徴のいくつかは、双方向ストリーミングおよびフロー制御、ブロッキングまたは非ブロッキング結合およびプラグブル可能な認証である.GRPCはクライアントとサーバが単一の基礎的なTCP接続の上で複数のストリームを始めることができる多重化を使用するHTTP/2を使用します.

ヒア GRPCウェブ

GRPCウェブは、我々が直接Webブラウザを介してGRPCサービスに話すことができるJavaScriptライブラリです.GRPCウェブクライアントは、特別なゲートウェイプロキシ(使節プロキシ)を介してGRPCサービスに接続します.これは、私たちのケースでは、ブラウザの通信(http/1.1)でGRPC(HTTP/2)をブリッジしている同じサーバマシン上で動作します
これは当初、我々はサービスやマイクロサービスの間の通信のためだけにGRPCを使用することができたし、クライアントは、データにアクセスするためにREST APIの呼び出しを使用することができますが、今GRPCを使用することにより、我々は我々のアプリ全体でGRPCの力を利用し、残りを排除することができますので、これはゲームチェンジャーだったて

なぜGRPCは休息より良いのか

RESTとGRPCの主な違いは

ペイロードタイプ、残りはJSONを使用します、そして、GRPCはProtobuff を使います

転送プロトコル、残りはHTTP/1.1を使用します、そして、GRPCはHTTP/2

を使います
GRPCでProtobufを使っているので、動詞(get,put)やヘッダなどを気にする必要はありません.また、GRPCフレームワークによって生成されたスタブがこれらの面倒を見るすべてのデータモデルに対して書く必要のあるシリアル化コードを減らします.
GRPCでHTTP/2を使用しているので、リクエストとレスポンスの両方をストリームすることができ、レイテンシの問題、ラインブロッキングの頭、TCP接続を確立する複雑さを取り除くことができます.

必要なツールとソフトウェア

Protoc V 36.1 -クライアントとサーバスタブを生成するProtobufコンパイラ.

GO V 111 — 私たちのサーバーはGo Lang

Nodejs — VueをビルドするにはJSフロントエンドアプリ.

Docker — 使節代理をする.

フォルダ構造

カバーするトピックの概観

プロトファイルを作成する

サーバのスタブを作成し、GRPCサービスハンドラを書く
GRPCサービス

を作成する

使節代理サービス

を作成する
クライアント・スタブおよびクライアント・アプリケーションを作成する

proto file

さて、すぐにコードにジャンプしようとすると、protoファイルは、このファイルを使用して当社のGRPCアプリの中心であるGRPCフレームワークは、クライアントとサーバーのスタブを生成する、我々はデータモデルを定義し、それらのデータモデルを消費するサービスは、このファイルは、プロジェクトのルートでToDoフォルダー内に配置されます.
< div >
< file >ファイルの最初の行は、使用するprotoバッファのバージョンを指定する.ToDoServiceでは、RPCメソッドの戻り値型として、要求型と引数として応答型を持つ3つのRPCメソッドAddToDo、DeleteToDo、GetToDOSを持ちます.それぞれのメッセージタイプでは、エンコードとデコード時に使用されるユニークなタグである= 1、= 2のようなタグを指定します.繰り返しのキーワードは、フィールドを何度も繰り返すことができることを意味します.p >

2サーバのスタブファイルを生成する

次のステップはprocファイルを作成した後にサーバのスタブを生成することです.Protocを使ってStubファイルを生成し、プロジェクトのルートから以下のコマンドを使用します
<> P >
< div >
上記のコマンドで、出力フォルダをtodo/inputファイルとしてtodo/todoに指定します.protoと、生成されたスタブファイルのプラグイン名とパッケージ名を指定します.上記のコマンドを実行した後、ToDoという名前の新しいファイルを見つけることができます.Pbtodoフォルダ内に移動します.p >
< tt > proto fileで指定された全てのRPCメソッドのハンドラメソッドを書かなければなりません.同じtodoフォルダ内に移動しますbr/>
<> P >
< div class ="LagagCount - gig - Link - tag "
"スクリプトのID "https://gist.github.com/thearavind/a2882a10cfff81bc9252d92260ca53a1.js//>
< div >
< br/> < br/> < br/>
簡単にするために、私たちのTODOの保存と検索のためのデータベースを使用するつもりはありません.同じ生成されたToDoパッケージにあるので、生成されたスタブファイルからリクエストと応答データ型を使用することができます.ハンドラのメソッドは全てサーバ構造に結び付けられます.p >
< tt > AddToDo Handler関数では、UUIDパッケージを使用してtodoオブジェクトのユニークなIDを生成し、todoオブジェクトを生成し、サーバ構造体

のtodosリストに追加します.
< tt > getTodoshandler関数では、サーバ構造内のtodosリストを返します.p >
< tt > DeleteToDoハンドラ関数では、todo idを使って検索と削除操作を行い、サーバ構造体のtodosリストを更新します.p >

GRPCサーバをフックする

現在、すべてのハンドラをフックしてGRPCサーバを起動しなければなりません.プロジェクトの根底にあるbr/>
<> P >
< div class ="LagagCount - gig - Link - tag "
"スクリプトのID "https://gist.github.com/thearavind/a6e2118db9ced8ce47ba12c256fc400f.js//>
< div >
< br/>
上記のファイルでは、ポート14586および空のToDoサーバーインスタンスと新しいGRPCサーバで新しいサーバーを作成しています.この新しいバージョンのGRPCサーバを使用してtodoサービスを登録し、作成したGRPCサーバにサービスを提供します.
上記のファイルを実行するにはgo run serverを使います.GRPCサーバを起動するプロジェクトのルートから移動します.p >

使節代理設定

使節プロキシは、私たちのサーバーとクライアントのアプリの間に座っているDockerサービスになるでしょう、下記は使節プロキシDockerとConfigファイルですbr/>
<> P >
< div class ="LagagCount - gig - Link - tag "
"スクリプトのID "https://gist.github.com/thearavind/cc0a54ab3c11afcc1be10ba6cf6dedf4.js//>
< div >
< br/>
< div class ="LagagCount - gig - Link - tag "
"スクリプトのID "https://gist.github.com/thearavind/93c5d6d215687ec2ec61fbbe7af5cca4.js//>
< div >
< br/>
私たちのTODO GRPCサービスはポート14586で実行され、使節はHTTP
Dockerコンテナ< br/>をビルドするには
<> P >
< div >
使節プロキシを起動するには< br/>を使ってDockerコンテナを起動します.
<> P >
< div >

VueJSフロントエンドアプリ

現在、唯一の欠落部分はクライアントです、我々はVueを使うつもりです.私たちのクライアントWebアプリケーションを作成するためのJSフレームワークは、シンプルさのために、私たちは、todosを加えて、削除するのに責任があるメソッドを見るだけです.p >
< p > Vueを作成します.Vue CLI < br/>を用いたJSプロジェクト
<> P >
< div >
< tt >このプロジェクトのルートでtodoクライアントという新しいフォルダを作成します.次に、クライアントスタブ

を作成しなければなりません
以下のコマンドを使ってクライアントスタブを作成します
<> P >
< div >
上記のコマンドは2つのファイルを作成します.JSとTodother GrpcCardウェッテンPB.srcフォルダ内のjs.簡単にするために、私はGRPCサービスクライアントが使用される部分をカバーするだけです
<> P >
< div >
私たちのクライアントアプリケーションのToDoコンポーネントのTodoコンポーネントのすべての必要なデータ型.からのクライアントとクライアント.次に、ToDoServiceClientを使用して新しいクライアントインスタンスを作成し、EnlocyプロキシをサーバーURLとしてリッスンし、クライアントインスタンスを保存するポートを使用してlocalhost URLを使用しますbr/>
<> P >
< div class ="LagagCount - gig - Link - tag "
"スクリプトのID "https://gist.github.com/thearavind/ea7916bea7312683b294cc28d159d877.js//>
< div >
< br/> < br/> < br/>
上記のコンポーネントは、ToDoボタンをクリックし、ToDoアイコンをクリックして追加します.私たちはクライアントのスタブを使ってGRPCサービスを実行し、スタブデータ型を使い、サーバから送受信されるデータを処理するためのセッターとゲッターです.br/> < br/>

結論

最後まで読んでくれてありがとう😁, この質問について質問がある場合は、以下のコメントを追加してください.p >
あなたが本当に楽しんだならば、それは拍手アイコン
<高橋潤子>
当初は /pで発行された