https://future-architect.github.io/articles/20220819a/

Go 1.19が8/2に早々にリリースされました。個人的にはGo 1.19よりも楽しみだったのが、サービス間通信とIDL(インタフェース記述言語)連載の中でご紹介したgRPCのGo実装の新星、Connectのアップデートでした。そしてそれはやってきました。

詳しい内容は↑の記事を見ていただくとして、Connectがその開発元ブログの紹介記事で宣言していたのが次の2つのことでした。

前者はまだ0.3だったのですが、connect-webはリリースされました。歴史のあるフロントエンドのコードジェネレータはTypeScript対応が後付けだったりするのですが、TypeScriptがファーストシチズンかつ、ネイティブというコードジェネレータなので、開発はかなりやりやすくなることが期待されます。connect-webの公開は数日前でしたが、本家の紹介記事もちょうど今日、公開されました。

Connect-Web: It’s time for Protobuf and gRPC to be your first choice in the browser

本家のチュートリアルとかもまだない状態ですが、サンプルコードを見たら簡単そうだったので、connect-goとセットで試してみました。サンプルは以下のリポジトリにアップしています。

https://github.com/shibukawa/connect-test

元のエントリーではRuby, Python, PHPにも出していくよ宣言がありましたが、今回のconnect-webのブログには、Node.js、Android, iOSにも出すよ宣言がありました。あと、connect-webの中のソースコードを見ると、

fetch()がないってことは古いNode.js使っているのか?connect-nodeを待ってて!

とあるので、今でもfetch()のあるNode.js 18でクライアントなら動作しそうですね。

フォルダ構造はこんな感じです。Goの標準的な構成(トップにgo.mod、cmdフォルダ以下にエントリポイント)にプラスして、frontendというフォルダにフロントエンドのプロジェクトフォルダを起きました。

プロジェクトのフォルダ(ここではconnect-test)を作り、次のようにプロジェクトを作りました。フロントエンドはSolid.jsを使ってます。

必要なツール類を入れます。メインのbufとGo用のツールはGo製なのでgo installで入れます。フロントエンドの方はnpmで配布されているのでnpm installします。

ここでは、connect-goのサンプルをとりあえずそのまま利用しました。go_packageだけはgo modで設定したルートのパッケージ名はじまりになるように修正しています。

buf mod initを実行してbuf.yamlを生成したあとは、buf.gen.yamlを自分で作成します。上二つはGoコード生成のためのconnect-goのサンプルと同じですが、下にフロントエンド用のコード生成用の設定です。出力先はフロントエンドフォルダの中になるようにしています。

あとはbuf generateでサーバーとフロントのコードを生成します。

中身はconnect-goのサンプルとほぼ同じで、リクエストできたnameパラメータを使って、レスポンスの文字列を作って返しているだけです。