静的なフロントエンドアプリケーションを Docker にデプロイできます。これは、GeneXus の [ アプリケーションをデプロイ ] を使用して行います。「Docker コンテナへのフロントエンドアプリケーションのデプロイ」を参照してください。
アプリケーション デプロイ ツールは、MSBuild タスクに基づいています。これらのタスクを使用すると、デプロイを自動化できます。
フロントエンドアプリケーションの場合は、3つの MSBuild スクリプトを実行してデプロイを実行します。
概要

• フロントエンドプロジェクトの作成
• フロントエンドパッケージの作成
• イメージのビルド
• トラブルシューティング
• 使用可能バージョン

フロントエンドプロジェクトの作成

GeneXus には、deploy.msbuild (GeneXus インストールのルートにあります) というスクリプトが用意されています。これは、ターゲットデプロイ (TargetId) が [ STATICFRONTEND ] の場合に、フロントエンドアプリケーション用のデプロイプロジェクトを作成するために使用されます。この手順では、gxdproj という名前のファイル (MSBuild スクリプト) を作成します。このファイルには、Deployment Unit オブジェクトの選択されたオブジェクトの一覧と、デプロイ用のいくつかの環境プロパティが含まれます。この gxdproj ファイルは、パッケージを作成する MSBuild タスクの入力として使用されます。
MSBuild 実行に追加するプロパティ:
TargetId: STATICFRONTEND
DEPLOY_TARGETS: 検証が実装されている .targets ファイルへの参照 (staticfrontend.targets) です。
KBPath: ナレッジベースのパスです。
KBVersion: アクティブとして指定するバージョン名です。
KBEnvironment: そのバージョンの環境名です。
DeploymentUnit: デプロイユニットの名前です。
ProjectName: 生成される .gxdproj ファイルの名前です。既定では DeploymentUnit_<TimeStamp>.gxdproj です。
ObjectNames: デプロイするオブジェクトの名前およびそのタイプです (デプロイユニットも選択可能) (参照: MSBuild タスクでオブジェクトリストを指定する方法)。 [ DeploymentUnit ] プロパティを指定する場合、このパラメーターは省略可能です。
Outputpath: Gxdproj の保存場所です。Outputpath が定義されていない場合、gxdproj ファイルは $KB.Location$\$Model.TargetPath$\web の下に保存されます。 

MSBuild.exe /ToolsVersion:4.0 "C:\Genexus\deploy.msbuild" 
/p:KBPath="C:\models\TestAngular\TestAngular" 
/p:KBEnvironment="NETSQLServer" 
/p:KBVersion="TestAngular" 
/p:DeploymentUnit="DeploymentUnit1" 
/p:ProjectName="DeploymentUnit1_20220616193203" 
/p:TargetId="STATICFRONTEND" 
/p:ObjectNames="WorkWithDevices:WorkWithDevicesPerson" 
/p:DEPLOY_TARGETS="C:\Development\Trunk\Deploy\Genexus\debug\DeploymentTargets\StaticFrontEnd\staticfrontend.targets" 
/t:CreateDeploy

フロントエンドパッケージの作成

この手順では、Docker イメージのビルドに必要なすべてのアーティファクトを含むフォルダを作成します。
[ DeployDirectory MSBuild ] プロパティを使用して、ディレクトリーを指定できます。既定では、フォルダ名が「context」となり、Deploy\STATICFRONTEND\<DeploymentUnit>\KB のコンテキストディレクトリーの下に配置されます。
GXDeployFileProject: 「フロントエンドプロジェクトを作成する」の手順で生成された .gxdproj ファイルへのパス (ファイルの名前を含む) です。 
ProjectRootDirectory: Angular アプリケーションが生成される KB の下のディレクトリへのパスです (常に mobile\Angular フォルダの下にあります)。例: "C:\models\TestAngular\TestAngular\NetSQLServer005\mobile\Angular"
GenExtensionName: フロントエンドジェネレーターの名前 (例: Angular) です。
DeploymentScriptDocker: 各フロントエンドジェネレーターには、Docker へのパッケージ化のための独自のスクリプトが必要です。これは [ DeploymentScript msbuild ] プロパティで指定する必要があります。Angular の場合、deploy.angular.docker.msbuild となり、<GeneXus インストール>\GenExtensions\SmartDevices\Angular\deploy ディレクトリーの下に配置されます。
STATICFRONTEND_DOCKER_APPLOCATION: (必須) アプリケーションが配置される Docker イメージ内の場所です。
STATICFRONTEND_PROVIDER: この場合は、「Docker」である必要があります。
GX_PROGRAM_DIR: GeneXus プログラムのディレクトリーです。

MSBuild.exe /ToolsVersion:4.0 "C:\Genexus\CreateFrontendPackage.msbuild" 
/p:GXDeployFileProject="C:\models\TestAngular\TestAngular\NETSQLServer003\Web\DeploymentUnit1_20220616193203.gxdproj" 
/p:ProjectRootDirectory="C:\models\TestAngular\TestAngular\NETSQLServer003\mobile\Angular" 
/p:GenExtensionName="Angular" 
/p:STATICFRONTEND_DOCKER_APPLOCATION="app" 
/p:DeploymentScriptDocker="deploy.angular.docker.msbuild" 
/p:STATICFRONTEND_PROVIDER="docker" 
/p:GX_PROGRAM_DIR="C:\Genexus" 
/t:CreatePackage

イメージのビルド

この手順では、Docker コンテナを作成します (Docker イメージをビルド)。イメージを実行するには、レジストリーにプッシュしてから実行する必要があります。
STATICFRONTEND_PROVIDER: この場合は、「Docker」である必要があります。
DeployFullPath: ビルドするパッケージを配置する場所です。
GX_PROGRAM_DIR: GeneXus プログラムのディレクトリーです。
GXDeployFileProject: 「フロントエンドプロジェクトを作成する」の手順で生成された .gxdproj ファイルへのパス (ファイルの名前を含む) です。 
STATICFRONTEND_DOCKER_IMAGE_NAME: Docker イメージの名前です。任意のレジストリーにプッシュするには、有効な Docker イメージの名前である必要があります。

MSBuild.exe /ToolsVersion:4.0 "C:\Genexus\DeploymentTargets\StaticFrontEnd\deploy.msbuild" 
/p:STATICFRONTEND_PROVIDER="docker" 
/p:GX_PROGRAM_DIR="C:\Genexus" 
/p:DeployFullPath="C:\models\TestAngular\TestAngular\NETSQLServer003\Deploy\STATICFRONTEND\DeploymentUnit1\20220616202241" 
/p:GXDeployFileProject="C:\models\TestAngular\TestAngular\NETSQLServer003\Web\DeploymentUnit1_20220616193203.gxdproj" 
/p:STATICFRONTEND_DOCKER_IMAGE_NAME="testangular:1.0" 
/t:Deploy

Docker イメージを実行するには、まず、Docker イメージのコマンドを使用して、正常に作成されかどうかを確認します。

それから、Docker デスクトップまたはコマンドラインを使用して、必要に応じてローカルで Docker イメージを実行します。Docker コンテナは 80番のポートで実行されますが、「Docker コンテナへのフロントエンドアプリケーションのデプロイ」で説明されているように、これは nginx.conf テンプレートを編集することで変更できます。 

アプリケーションは、以下の画像のように、必ず「app」ディレクトリーの下で実行されます。

トラブルシューティング

これらのアプリケーションをトラブルシューティングする効果的な方法は、ブラウザーの Web 開発者ツール (F 12) でネットワークトラフィックを確認することです。たとえば、CORS エラーが発生したとします。
Docker イメージ自体のエラーは、Docker デスクトップを使用して検査できます。

使用可能バージョン

GeneXus 17 Upgrade 11 以降