webstencils demoダウンロードwebstencils demoソースコードのダウンロード

webstencils demo

Delphi のソースコード

1.0.0

ダウンロード

WebStencilsデモ

Delphi 12.2は、ASP.NET Razorテクノロジーと同様のテキストを処理するスクリプトベースの方法であるWebStencilsを導入しました。その主な用途は、WebBrokerサーバーアプリケーションから動的HTMLを生成することですが、他の方法で使用してXML、JSON、またはテンプレートからあらゆるタイプのテキスト出力を生成できます。

このリポジトリには、いくつかの非常にシンプルなDelphi 12.2 WebBrokerアプリケーション（Webブラウザーを起動するWindows VCLプログラムとして実行）が含まれており、 TPageProducerコンポーネントで使用されたHTMLスタイルのタグと比較し、新しい「@」@"シンボルタグと新しいTWebStencilsProcessorコンポーネントで使用されています。すべてのプロジェクトとHTMLファイルは1つのフォルダーにあり、2つのプロジェクトはChinook SQLiteデータベースにアクセスするためのデータモジュールを共有しています（含まれていません）。

各アプリケーションには5ページがあり、同一に見えるように作られているため、テンプレートテクノロジーに集中できます。

インデックス（ログインページを提示）
ログインエラー
顧客リスト（テーブル内の顧客のリスト）
顧客編集（選択した顧客の編集ページを提示）
エラーページ（許可されていないアクセスを防ぐため）

2つのプロジェクトで参照されているHTMLファイルは、どのプロジェクト/テクノロジーを使用するかを明確にするために名前が付けられています。

従来のPageProducerテンプレートHTMLファイル：

index-wbroker.html
loginfailed-wbroker.html
custlist-wbroker.html
custedit-wbroker.html
accessdenied-wbroker.html

新しいwebstencilsテンプレートHTMLファイル：

index-wStencils.html
login-failed-wStencils.html
custlist-wStencils.html
custedit-wStencils.html
accessdenied-wStencils.html
custlistframework1.html

WebStencilsコレクションにもう1つのファイルがあります。これは、WebStencilsアクションから生成された各Webページのフレームワークテンプレートであり、従来のWebbrokerプロジェクトで使用されているページプロデューサーに埋め込まれたヘッダーとフッター文字列から組み合わされています。

プロジェクトの構築

コンパイルまたは実行を試みる前に、Chinookサンプルデータベースをダウンロードする必要があります。これは、チュートリアルやデモに使用される一般的なデータベースであり、さまざまな場所で見つけることができます。無料のデータベースツールであるDbeaverを使用していますが、それが出荷されていることがわかりました。

chinook.dbプロジェクトと同じフォルダーに置いたら、データモジュール（両方のプロジェクトで使用）、 udmCustを開き、 TFDConnectionコンポーネントを変更してデータベースファイルの場所を指定する必要があります。また、データベースツールまたはDelphiのデータエクスプローラーを使用して、データベース内のテーブルを表示することもお勧めします。

Delphi 12.2を使用して、これらのプログラムを作成およびテストしました（サードパーティコンポーネントは使用しません）。

デモを実行します

どちらのデモもWebサーバーWindows GUIプログラムとして作成されます。つまり、デフォルトのWebブラウザを起動するボタンでWebリクエストをリッスンするポートを開く小さなWindows VCLプログラムとして実行されます。 PageProducerバージョンはポート8081に耳を傾け、WebStencilsバージョンはポート8082に耳を傾けるため、必要に応じて両方を同時に実行できます。

リストされている最初のページはログインページです。有効なログインは、顧客リストに移動する前に入力する必要があります。有効なログインは、従業員のテーブルのユーザーです。

ユーザー名はFirstNameであり、ケース非感受性です。
パスワードは、 EmployeeIdとLastName 、Case -Sensiveの連結です。

たとえば、ダウンロードしたサンプルデータベースの最初のエントリには、次の最初の従業員がいました。

ID ：1
FirstName ：アンドリュー
LastName ：Adams

したがって、この従業員とログインするには：

ユーザー名： ANDREW （上または下または混合ケース）
パスワード： 1Adams （正確に）

ログインすると、顧客リストが表示されます。各顧客のID（左列）は、編集ボックスのすべての顧客フィールドをリストする「編集」画面に移動するリンクです。送信ボタンは、変更を保存したり、顧客のリストに戻す以外に何もしません。

テーブル名

2つの異なる「チヌーク」サンプルデータベースを使用しましたが、1つは特異なテーブル名（「顧客」と「従業員」など）があり、もう1つは複数形（「顧客」と「従業員」）を持っていました。あなたが得るものがこのリポジトリのものと異なる場合、一致するようにテーブル名とクエリを変更するだけです。

なぜHTMLテーブル？

カスタマーリストは、古いHTMLテーブルタグ（ <table> 、 <tr> 、 <td>など）を使用して構築されています。これは、 TDataSetTableProducerコンポーネントを使用して構築された古いWebBrokerサーバーアプリが実行されたというシンプルでデフォルトの方法だからです。新しいWebStencilsバージョンは同じHTML結果を構築するため、それがどのように行われるかを比較し、結果のWebページがほぼ同じになります。最新のWebサイトは通常、CSSスタイルのテーブルを構築します。これは、DataSettableProducersからWebstencilsに切り替えることで実現できる利点です。