WebBroker와 DataSnap에서의 sgcHTML | eSeGeCe 블로그

WebBroker와 DataSnap에서의 sgcHTML

· 기능

sgcHTML을 사용하면 JavaScript를 작성할 필요 없이 컴포넌트로 Delphi에서 웹 UI를 구축할 수 있습니다. 지금까지 이러한 페이지는 sgcWebSockets 서버에서 실행되었습니다. 이제 동일한 페이지를 모든 Embarcadero WebBroker 애플리케이션과 DataSnap 서버에서 제공할 수 있으므로, 기존 REST 백엔드가 Delphi를 벗어나지 않고도 완전한 웹 프런트엔드로 성장할 수 있습니다. 자세한 내용과 컴포넌트, 코드는 새로운 WebBroker & DataSnap 페이지에 있습니다.

이것이 가능한 이유는 sgcHTML이 서버가 아니라 렌더러이기 때문입니다. 컴포넌트와 노드 계층은 페이지를 소켓, 전송 또는 서버 클래스에 대한 의존성이 없는 순수 HTML 문자열로 변환합니다. 그 문자열은 WebSocket 서버의 응답이 될 수 있는 것과 마찬가지로 손쉽게 TWebResponse의 본문이 될 수 있으며, 이것이 아래의 두 가지 통합을 가능하게 하는 요소입니다.

모든 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를 대체하는 드롭인 브리지 서버가 이미 함께 제공되므로, 서버는 동일한 포트에서 WebSocket, 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 핸들러도 체이닝되어 먼저 실행됩니다. 동일한 패턴이 세 가지 브리지 서버 모두를 다룹니다. TsgcHTMX_Engine_Server_WebBrokerBridge는 HTTP/1.1 위의 Indy 브리지와 HTTP/2 브리지를 제공하고, TsgcHTMX_Engine_Server_HTTPAPI_WebBrokerBridge는 HTTP.sys 브리지를 제공합니다.

하나의 백엔드, 두 개의 얼굴

DataSnap에서 호스팅하는 것의 좋은 결과는 하나의 서버 메서드 집합이 이중 역할을 할 수 있다는 점입니다. 여러분의 TDSServerModule은 모든 외부 클라이언트를 위한 /datasnap/rest의 REST 및 JSON API이면서, 동시에 여러분의 sgcHTML 페이지가 프로세스 내에서 렌더링하는 데이터 소스이기도 합니다. 비즈니스 로직을 한 번만 작성하면, 하나의 서버, 하나의 포트에서 기계용 API와 사람용 웹 UI를 모두 얻게 됩니다.

시작할 수 있는 세 가지 데모

이 제품에는 동일한 작은 애플리케이션을 서로 다른 스타일로 구축하는 세 가지 데모가 함께 제공되므로, 여러분의 프로젝트에 맞는 것을 고를 수 있습니다:

요구 사항 및 이용 가능성

WebBroker 엔진은 Delphi 7부터 Delphi 13까지 지원합니다. DataSnap 브리지 경로는 DataSnap을 포함하는 Delphi 에디션, 즉 Enterprise 또는 Architect가 필요합니다. WebBroker와 DataSnap은 Delphi 및 C++Builder 프레임워크이므로, 이 호스팅 방식은 이 두 컴파일러에 한정됩니다. sgcHTML .NET 포트는 대신 ASP.NET Core에서 호스팅되며, 거기서도 동일한 결과에 도달합니다.

여기서 설명한 모든 것은 지금 이용할 수 있습니다. 전체 설명과 컴포넌트 레퍼런스, 코드 샘플은 WebBroker & DataSnap 페이지에 있습니다.

질문이나 피드백이 있거나 sgcHTML을 DataSnap 서버에 연결하는 데 도움이 필요하신가요? 문의하기. 코드를 작성한 사람들로부터 답변을 받으실 수 있습니다.