WebBroker と DataSnap で動く sgcHTML | eSeGeCe ブログ

WebBroker と DataSnap で動く sgcHTML

· 機能

sgcHTML を使えば、Delphi のコンポーネントから Web UI を構築でき、JavaScript を一切書く必要がありません。これまで、そうしたページは sgcWebSockets サーバー上で動作していました。今後は、あらゆる Embarcadero WebBroker アプリケーションや DataSnap サーバーからも同じページを配信できるようになり、既存の REST バックエンドが Delphi を離れることなく本格的な Web フロントエンドを備えられます。詳細、コンポーネント、コードは新設された WebBroker & DataSnap ページにあります。

これが実現するのは、sgcHTML がサーバーではなくレンダラーだからです。コンポーネントとノードのレイヤーが、ページをプレーンな HTML 文字列に変換し、ソケット、トランスポート、サーバークラスのいずれにも依存しません。その文字列は、WebSocket サーバーの応答になれるのと同じくらい容易に、TWebResponse のボディにもなれます。これが、以下の 2 つの統合を可能にしています。

あらゆる WebBroker アプリケーション

TsgcHTMX_Engine_Server_WebBroker コンポーネントは、標準の IWebDispatch インターフェースを実装しています。TWebModule 上に配置するか、TWebActionItem からその DispatchRequest を呼び出すと、sgcHTML のページ、組み込みの CSS と JavaScript のアセット、そして htmx ルートを配信します。スタンドアロンの TIdHTTPWebBrokerBridge 上、ISAPI 下、Apache モジュール下、そして CGI として動作するため、すでにデプロイしている WebBroker ホストが何であっても適合します。

uses
  Web.HTTPApp, sgcHTMX_Engine_Server_WebBroker, sgcHTMX_Router;

// Any WebBroker host: the engine's Owner is the web module,
// so the standard WebBroker dispatcher calls it automatically
FEngine := TsgcHTMX_Engine_Server_WebBroker.Create(WebModule1);
FEngine.Router := FRouter;   // your htmx routes and the page

インタラクティブ性は通常の htmx の HTTP ラウンドトリップを使うため、WebSocket は不要です。お好みであれば、htmx をまったく使わないクラシックモードもあります。プレーンなフルページナビゲーションと標準的なフォーム投稿で、JavaScript をオフにしても動作します。プレーンな WebBroker にできない唯一のことはプッシュです。というのも CGI と ISAPI の下では、リクエストとレスポンスがソケットを占有するからです。プレーンな WebBroker ホストでライブ更新を行うには、htmx のポーリングを使うか、以下のブリッジサーバーに移行してください。

DataSnap、単一ポート上のライブ更新

sgcWebSockets には、DataSnap や WebBroker アプリケーション内の Indy TIdHTTPWebBrokerBridge を置き換えるドロップインのブリッジサーバーがすでに付属しており、同じポート上でサーバーが WebSockets、HTTP/2、HTTP.sys を獲得します。sgcHTML はこれらにそのまま組み込めるようになりました。エンジンの Server をブリッジサーバーに割り当てれば、ページ、そのアセット、そしてライブの WebSocket フラグメントプッシュのすべてが、DataSnap の REST エンドポイントと同じポート上で動作します。

uses
  sgcWebSocket_Server_WebBrokerBridge,
  sgcHTMX_Engine_Server_WebBrokerBridge, sgcHTMX_Router;

// A DataSnap / WebBroker bridge server
FServer := TsgcWSHTTPWebBrokerBridgeServer.Create(Self);
FServer.Port := 8080;

FEngine := TsgcHTMX_Engine_Server_WebBrokerBridge.Create(Self);
FEngine.Router := FRouter;     // your htmx routes and the page
FEngine.Server := FServer;     // share the DataSnap port
FServer.Active := True;

// push a live HTML fragment to every connected browser
FEngine.BroadcastFragment(BuildStatsFragment);

エンジンが要求するのは自身のパス、つまりページ、アセット、そしてあなたのルートだけです。それ以外のものはすべて手つかずのまま通過するため、/datasnap/* の REST や、TWebModule 上にすでにあるアクションは以前とまったく同じように動作し続け、既存の OnCommandRequest ハンドラーは連結されて最初に実行されます。同じパターンが 3 つのブリッジサーバーすべてに適用されます。TsgcHTMX_Engine_Server_WebBrokerBridge は Indy ブリッジを HTTP/1.1 上で、また HTTP/2 ブリッジを配信し、TsgcHTMX_Engine_Server_HTTPAPI_WebBrokerBridge は HTTP.sys ブリッジを配信します。

1 つのバックエンド、2 つの顔

DataSnap 上でホストすることの嬉しい帰結は、単一のサーバーメソッド群が二重の役割を果たせることです。あなたの TDSServerModule は、あらゆる外部クライアント向けに /datasnap/rest で提供される REST と JSON の API であり、同時に、sgcHTML のページがプロセス内でレンダリングする際のデータソースでもあります。ビジネスロジックを一度書くだけで、そこからマシン向けの API と人間向けの Web UI の両方を、1 台のサーバー上、1 つのポート上で得られます。

出発点となる 3 つのデモ

本製品には、同じ小さなアプリケーションを異なるスタイルで構築する 3 つのデモが付属しており、あなたのプロジェクトに合ったものを選べます。

要件と提供状況

WebBroker エンジンは Delphi 7 から Delphi 13 に対応しています。DataSnap ブリッジの経路には、DataSnap を含む Delphi エディション、すなわち Enterprise または Architect が必要です。WebBroker と DataSnap は Delphi と C++Builder のフレームワークなので、このホスティングの仕組みはこれら 2 つのコンパイラーに固有のものです。sgcHTML の .NET 版は代わりに ASP.NET Core 上でホストし、そこで同じ結果に到達します。

ここで説明したすべてが、今すぐ利用できます。詳しい解説、コンポーネントリファレンス、コードサンプルは WebBroker & DataSnap ページにあります。

ご質問、ご意見、あるいは sgcHTML を DataSnap サーバーに組み込む際のサポートが必要ですか？ お問い合わせください。コードを書いた本人たちから返信が届きます。