エンタープライズ.net light switch

http://biki.jp.net/enterprisenet

エンタープライズ.NETLightSwitch

LightSwitchによるクラウド・コンポジットアプリケーション開発


LightSwitchによるクラウド・コンポジットアプリケーション

目的本書では、 LightSwitchを使って、既存システムやSAP、SharePointと連携したク

ラウド化可能なコンポジット・アプリケーションを構築することで、ビジネス・業務ニーズに迅速対応し、業務システムの付加価値を向上させるソリューションを説明する

後半ではLightSwitchの主な機能と実装方法を説明する

内容

LightSwitch

コンポジット・アプリケーション


2


LightSwitch

LightSwitchとは業務アプリケーションを手軽に作成するツール

業務アプリケーション＝「データ」＋「画面」がほとんど。このようなアプリを簡単に作成

新規、あるいは既存のデータに対して、ユーザーがそれを「入力、更新、削除、参照、検索」などの操作を行うための画面で構成される。

既存のデータベースやSharePointのリストデータ、SAPなどのデータを簡単に利用できる

3

■Step1 データ定義新規作成、SQL Server、SharePoint、SAPなど様々なデータを活用可能

■Step２画面を追加参照画面、表示、追加/編集、など、画面テンプレートから選択

■Step３展開Web、またはデスクトップ、クラウドアプリケーションとして展開

マウス操作のみの3ステップで開発できる！


LightSwitch

優れたアプリケーション基盤と高い拡張性を提供する LightSwitchは当初はSilverlight＋WCF RIA ServiceのRIAアーキテクチャであったが、現在はHTMLクライアントをサポートしてより広範囲なアプリケーションをカバーする

4 http://msdn.microsoft.com/ja-jp/vstudio/gg491708.aspx


LightSwitch

オンプレミスはもちろんクラウドにも対応 LightSwitchはクラウドにも対応しており、AzureやOffice365に配置することができる

5 http://msdn.microsoft.com/ja-jp/vstudio/gg491708.aspx


コンポジット・アプリケーション

コンポジット・アプリケーションとは

既存または新規のアプリケーションやコンポーネントを組み合わせて構築されたアプリケーション

6

財務システム

予定表

電話帳システム

パッケージ・ソフト

メール

文書

コンポジットアプリケーション


コンポジット・アプリケーションなぜコンポジット・アプリケーションなのか？

様々なシステムやアプリケーションを組み合わせる仕組みがあれば多くの課題が解決できる

古いシステムの機能追加やクラウド化長年の修正・保守で既存システムに新しい機能追加を行うことが難しくなっている

ビジネス要求に対応できなくなっている

変更コストが高すぎる

メールなどのコラボレーションツールとの融合 DBアプリケーションとコラボレーションツールを有機的につなげたい

アプリケーションからツールのワークフロー機能利用したい

アプリケーションにドキュメント管理機能を追加する

既存システムの連携異なる部署や異なる時期に作成されたシステムは統合されておらず使いづらい

１つの業務で複数のアプリケーションを使わなくてはならない

データの2重入力が発生したり、データの不整合が発生する

パッケージ製品と自社システムの使用感が異なる7



なぜLightSwicthを利用するのかデータベースやSharePoint、SAPのデータ連携が簡単にできる

クラウド化やリッチで統一されたユーザインタフェース、Office連携機能など付加的要素も魅力

8

利用者

財務データ

予定表

電話帳データ

業務データ

メール

文書

OData

LightSwitch


シナリオ①古いシステムの機能追加やクラウド化

既存システムのデータベースの一部を公開し、LightSwitchを利用して新しい機能を追加する

9

LightSwitchデータベース（新機能用の独自テーブル）

既存システムデータベース

公開されたテーブル・ビュー

①機能拡張するために最低限必要な既存のテーブルやビューを公開する

②機能拡張するために追加が必要な情報はLightSwitchの独自テーブルを作成（既存システムの影響を最小限にするため）

③既存と新規のデータベースを利用して機能拡張を行う

自社システムの一部の機能を外部公開するシナリオ

クラウド化も可能


シナリオ②コラボレーションツールとの融合

SharePoint上のデータを連携してアプリケーションを構築する

10

①テーブル定義を取り込む

③データベースのテーブルとリストデータにデータの関連を定義

②SharePoint上のリストデータの定義を取り組む

④連携データを利用して画面を作成

異なるデータソース間でデータ連携できる点がLightSwitchの良い点

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/4062.Figure1_5F00_3019976C.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/4062.Figure1_5F00_3019976C.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/7077.Figure17_5F00_56939E53.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/7077.Figure17_5F00_56939E53.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/7242.Figure7_5F00_0967B8C7.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/7242.Figure7_5F00_0967B8C7.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/4341.Figure18_5F00_2859A299.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/4341.Figure18_5F00_2859A299.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/2251.Figure13_5F00_7BD13459.jpg

http://blogs.msdn.com/cfs-file.ashx/__key/CommunityServer-Blogs-Components-WeblogFiles/00-00-01-42-23-metablogapi/2251.Figure13_5F00_7BD13459.jpg


シナリオ③既存システム連携データベースやSharePoint以外のデータを利用してコンポジット・アプリケーションを作成する

本格的なアプリケーション統合を行う場合、BizTalkなどの製品を利用することもできる

11

データベースSharePoint

LightSwitch

LightSwitchはOdataと呼ばれる

プロトコルでさまざまなシステムと連携可能

OData


LightSwitchによるクラウド・コンポジットアプリケーション特徴のまとめ

LightSwitchはエンドユーザが業務アプリケーションを手軽に作成するツールで

優れたアプリケーション基盤であり高い拡張性を提供する

コンポジット・アプリケーションは

既存システムやコンポーネントを組み合わせてアプリケーションを低コストで構築する仕組み

LightSwitch×コンポジット・アプリケーションは

変更が難しい既存システムに対して、アプリケーションを組み合わせて新しい機能を提供するというアイデアで、現場のビジネスニーズに合った価値を迅速にもたらすソリューションである

12


LightSwitchの機能


LightSwitchの機能

目的

LightSwitchの主要な機能を説明する

LightSwitchの画面方式としてはSilverlightとHTMLの2つがあるが今回はHTMLクライアントのみ説明。

内容

はじめてLightSwitch

データソース機能

画面ビルダ機能

セキュリティ

LightSwitchの配置

その他

14


はじめてLightSwitch

LightSwitchを使ってアプリケーションを作成する方法を概観する。

手順

① LightSwitchプロジェクトの作成

② LightSwitchでのデータの定義

③ LightSwitchでの画面の作成

④アプリケーションの実行とテスト


① LightSwitchプロジェクトの作成

Visual Studioを起動してLightSwitch HTMLアプリケーションを選択

名前はFirstApp


② LightSwitchでのデータの定義

[新しいテーブルの作成] リンクを選択し以下のようなContactテーブルを作成する


③ LightSwitchでの画面の作成

ソリューションエクスプローラのScreenフォルダを右クリックして「画面の追加」を選択。画面データにContactSetを指定して画面を作成する


④アプリケーションの実行とテスト

FirstAppプロジェクトのプロパティを表示して既定の言語を日本語にしてF5キーでアプリケーションが起動


データソース機能データソースの種類

データベース OData SharePoint SAP WCF RIA Service

データ定義データフィールド計算フィールドリスト値リレーションデータ検証データフィルターデータイベント

クエリ定義


データソースの種類

LightSwitchでは新規でデータベースのテーブルを作成することができるが、既存のデータソースも利用できる

データソースの追加を選択するとウイザードが表示され選択


データソース機能テーブルの追加

テーブルの追加で作成されたデータはLightSwitch固有のSQL ServerまたはSQL Azure上のデータベースにテーブルが作成される


データソース機能データベース

データベースを選択すると既存のSQL Serverのデータベー

スを接続するウイザードが表示されるので、データベースを指定し利用するテーブルを選択する


データソース機能 SharePoint

SharePointを選択した場合、サイトのURLを指定し、利用するエンティティを選択する


データソース機能 OData

ODataを選択した場合、サービスのURLを指定し、利用するエンティティを選択する


データソース機能 SAP

SAPを選択した場合、サービスのURLおよび認証情報を指定し、利用するエンティティを選択する


データソース機能 SAP

テスト用のSAPデータの利用

SAPにユーザ登録したのち「SAP NetWeaver Gateway Developer Center」に登録するとIDとパスワードが取得できる

https://supsignformssapicl.hana.ondemand.com/SUPSignForms

参考

http://scn.sap.com/docs/DOC-40986

https://supsignformssapicl.hana.ondemand.com/SUPSignForms

http://scn.sap.com/docs/DOC-40986


データ定義

データフィールド

計算フィールド

リスト値

リレーションシップ

データ検証

データフィルター

データイベント


データフィールド

TypeVisual Basic のデータ型

C# 型 Range 解説

バイナリ Byte() byte[] -128 ～ 127。可変長のバイト配列。

ブール型 Boolean bool true または false。

日付 DateTime DateTime 日付としてのみ扱われる "日付/時刻" 型。

日付/時刻 DateTime DateTime 0001 年 1 月 1 日12:00:00 AM から9999 年 12 月 31 日 11:59:59 PM。

DateTimeOffset DateTime DateTime 世界協定時刻 (UTC) 形式で日付と時刻を表す値。

Decimal Decimal decimal ±1.0 × 10<sup>−28</sup> ～±7.9 × 10<sup>28</sup>。

有効桁数 28 ～ 29 桁の固定小数点。会計の数字に適しています。

Double (倍精度浮動小数点型)

Double (倍精度浮動小数点型)

double ±5.0e−324 から±1.7e308。

15 ～ 16 桁の精度の浮動小数点。科学の数字に適しています。

電子メールアドレス String String 電子メールアドレスとして扱われる文字列。

テーブルにはデータフィールドを定義できる

LightSwitchが標準定義しているデータ型外部データソースのエンティティの場合、計算フィールドのみを追加可能


データフィールドType

Visual Basic のデータ型

C# 型 Range 解説

Guid String String グローバル一意識別子 (GUID) として書式設定された文字列。値は各レコードに対して自動的に生成されます。

画像 Byte() Byte[] 画像として扱われるバイナリ。

短整数 Short short -32,768 から32,767。

符号付き 16 ビット整数。

整数 Integer int -2147483647 から2147483647。


長整数 Long long -9,223,372,036,854,775,808 から9,223,372,036,854,775,807。


通貨 Decimal (10 進数型)

decimal 通貨の値として扱われる 10 進数。

パーセント Decimal decimal パーセンテージとして扱われる 10 進数。

Person String String ユーザー ID として扱われる文字列。

電話番号 String String 電話番号として扱われる文字列。

String String String 0 個以上の可変長の Unicode 文字のシーケンス。

Web アドレス String String Web アドレス (URL) として扱われる文字列。


計算フィールド

計算フィールドはデータベース内の他のフィールドの値に基づいて値が計算されるフィールド

たとえば、Subtotal とうい名前のフィールドを Order_Detailsエンティティに追加できます。 UnitPriceフィールドの値とOrderQuantityフィールドの値を乗算することによって、Subtotal フィールドの値を取得するように指定できる

[計算されたプロパティ]を追加し、メソッドの編集でFieldName_Computeという名前のメソッドに式を追加

partial void Subtotal_Compute(ref decimal result){

result = this.Quantity * this.UnitPrice;}


リスト値

リスト値を利用すると、選択リストを作成してその中から値を選択できるようにできる

リスト値を設定するデータフィールドを選択し、プロパティのウィンドウの[選択肢リスト]から値を編集して作成


リレーションシップ

リレーションシップを使用すれば、関連データを表示す

る画面を簡単に作成できる。たとえば、顧客と注文の両方を表示する画面を設定だけで作成できる

リレーションは異なるデータソース間でも作成可能

削除時の動作の指定も可能


データ検証

エンティティやテーブルに検証規則を適用することで、入力時やデータの書き込むタイミングでデータ内容をチェックし、正しくない場合エラーメッセージを表示できる

検証規則の適用は大きく２つの方法がある定義済み（ノンコード）

データの型に基づくチェック、必須チェック

カスタム（コードによる実装）コードによる値のチェック

partial void ShippedDate_Validate(EntityValidationResultsBuilder results){

if (this.ShippedDate > DateTime.Today){

results.AddPropertyError("Shipped date cannot be later than today");}

}


データ検証

データ検証のタイミング

Siliverlightでは画面の入力時だがHTMLの場合はデータ保存時に行われるので注意

HTMLの場合、JavaScriptでの設定も可能

beforeApplyChangesに処理追加

if (screen.Contact.ContactName.indexOf('!') != -1) {screen.findContentItem("ContactName").validationResults = [new msls.ValidationResult(screen.Contact.details.properties.contactName,"Contact Name cannot contain the character '!'.")];return false;

}


データフィルター

アクセス許可に基づきレコードのサブセットを表示する場合に便利な機能

たとえば、各従業員が自身の給与情報のみを表示できるようにする場合

<EntitySet>_Filter クエリメソッドを利用

partial void Employees_Filter(ref Expression<Func<Employee, bool>> filter){

filter = e => e.EmployeeName == this.Application.User.Name;}


データイベント

特定のデータイベントの発生時に実行されるコードを記述して、アプリケーションをカスタマイズできる

一般的なメソッド説明

<TableName>_AllowSaveWithErrors

項目に検証エラーがある場合に項目を保存するかどうかを示します。検証エラーがある場合は既定で項目の保存が中止されます。呼び出し元の層で実行されます。

<TableName>_Created 項目が作成された後に呼び出されます。項目が作成された層で実行されます。

<TableSetName>_Deleted 項目がデータストアから削除された直後に呼び出されます。サーバーで実行されます。

<TableSetName>_Deleting 項目がデータストアから削除される直前に呼び出されます。サーバーで実行されます。

<TableSetName>_Inserted 項目がデータストアに挿入された直後に呼び出されます。サーバーで実行されます。

<TableSetName>_Inserting 項目がデータストアに挿入される直前に呼び出されます。サーバーで実行されます。

<TableSetName>_Updated 項目がデータストアで更新された直後に呼び出されます。サーバーで実行されます。

<TableSetName>_Updating 項目がデータストアで更新される直前に呼び出されます。サーバーで実行されます。

<TableSetName>_Validate 項目がサーバーで検証されるときに呼び出されます。


データイベントクエリメソッド説明

Query_ExecuteFailed クエリの実行に失敗した後に呼び出されます。サーバーで実行されます。

Query_Executed クエリの実行後に呼び出されます。クエリの実行に失敗した場合、このメソッドは呼び出されません。サーバーで実行されます。

Query_Executing クエリの実行直前に呼び出されます。サーバーで実行されます。

<TableSetName>_Filter クエリを実行する前に呼び出され、追加クエリのカスタマイズが可能です。サーバーで実行されます。

データソースメソッド説明

SaveChanges_ExecuteFailed データソースの保存に失敗した直後に呼び出されます。サーバーで実行されます。

SaveChanges_Executed データソースで変更を正常に保存した直後に呼び出されます。サーバーで実行されます。

SaveChanges_Executing データソースで変更を保存する直前に呼び出されます。サーバーで実行されます。


画面ビルダ機能

画面の構築

新規画面

画面テンプレート

HTML 画面のデザイン

ダイアログ表示

カスタムコントロール

画面遷移


画面の構築新規画面

LightSwitchではSilverlightとHTMLの２つのテクノロジで画面を作成できる。（今回はHTMLを説明）

HTML版はベースのライブラリにjQuery Mobileを利用

標準のテンプレートはモバイルデバイス向けのレイアウトになっているがカスタマイズすることでPC向きのHTMLにすることも可能（両方に対応させるレスポンシブ画面も可能）

jQueryで利用可能な多くのプラグインがLightSwitchでも利用可能


画面の構築新規画面

LightSwitchでの新規画面は「表示データ」と「テンプレート」を指定して追加する


画面の構築画面テンプレート

データの参照画面詳細の表示画面詳細の追加/編集画面

画像の引用 http://msdn.microsoft.com/ja-jp/library/jj713590.aspx

レコードの一覧を表示するときに使用します

1 件のレコードと関連する子

レコードを表示するときに使用します

1 件のレコードと関連する子

レコードを作成したり、編集したりするときに使用します


画面の構築 HTML 画面のデザイン LightSwitchの画面レイアウトでは複数のタブを作成することができ、それぞれのタブの中にデータをレイアウトして表示するグループを作成して配置するグループはパネルのようなイメージでネストすることもできる

タブ１タブ２

グループ

項目１

項目２

項目３

グループ

ボタン１

項目１

項目２

項目３

グループ

項目１

項目２

項目３

グループ

項目１

項目２

項目３

コマンドバーボタン２


画面の構築 HTML 画面のデザイン

タブ

画面を切り替えることができる

タブ

タブ



タブ（レイアウト）

タイルリスト

テーブル

リスト



グループ

行レイアウト

列レイアウト



ボタンボタンを作成する場合、押下時に動作する独自のメソッドを作成するかまたは既存のメソッドを選択する

既存メソッドには別画面に遷移するものや検索・追記・編集・表示する機能が用意されている



項目

項目の追加は左パインのデータ項目の一覧からDrag&Dropするか追加ボタンで項目を選択する

コントロールの種類はいくつか用意されている


画面の構築ダイアログとポップアップ表示

LightSwicthは既存の画面を保持したまま別画面を表示するためのダイアログやポップアップ画面を作成することができる画面をダイアログ表示する場合、[ダイアログとして表示]をオンに設定する

ポップアップは画面デザイナーから[ポップアップの追加]を選択して作成いずれも通常画面の作成と同じように作成可能。

ダイアログとポップアップの大きな違いはポップアップは画面毎に作成されるため、同じポップアップを複数の画面で共有することはできない


画面の構築カスタムコントロール

カスタムコントロールを使用すれば、LightSwitchに標準で備わっている HTML コントロール以外の方法で情報を表示・入力できる

JavaScriptライブラリの読み込み

default.htmファイルの <script>セクションに記載

Renderコードの編集

<script type=”text/javascript” src=”Scripts/MyControl.js” charset=”utf-8”></script>

myapp.BrowseContactSet.ContactCompany1_render = function (element, contentItem) {

$(element).append(contentItem.value);};



データバインド機能前頁の例はデータを静的に表示する場合は良いが動的に変化したりデータが更新するような場合にはデータバインド機能を利用する

myapp.BrowseContactSet.ContactCompany1_render = function (element, contentItem) {var contactCompany = $('<input id="contactCompany" />');contactCompany.appendTo($(element));

//テキストボックスの値が変化した場合にバインド先に反映contactCompany.change(function () {

if (contentItem.value != contactCompany.val()) {contentItem.value = contactCompany.val();

}});

//バインド先が変化した場合にテキストボックスに反映contentItem.dataBind("stringValue", function (newValue) { contactCompany.val(newValue); });

};



データバインドの効果としては、一覧＋明細画面のように同一データを複数のコントロール表示している場合に自動的に連動する

以下の例では「山田会社」を「山田株式会社」に変更すると自動的に右の表示部も反映される


画面遷移

ユーザは画面に表示されたリスト項目またはコマンドバーのボタンをタップ（Click）して、別の画面を開くことができる

ユーザがリスト項目をタップした場合に開く方法

リストのアクションの項目のタップを設定

ボタンをタップしたとき画面が開く方法

ボタンを追加

いずれも既存メソッドshowScreenNameを選択（ScreenNameは開く画面）

対象データの指定は現在選択中（ EntityName.selectedItem ）のものか新規（New EntityName）を指定する


セキュリティ

認証

ロールの定義

アクセス制御


認証

認証は以下の３つの方式が利用できる

Window認証

Form認証

SharePoint認証

Sharepointが有効の場合はSharePoint認証


ロールの定義

LightSwicthの権限はロールベースになっている

ロールの定義はプロジェクトのプロパティのアクセス制御で、アクセス許可にロールを追加する


アクセス制御処理の実行を特定のロールを持つユーザに制限することができる

たとえば、ViewSalesロールを作成して、 ViewSalesロールを持つユーザだけ販売画面を表示できるようにする

実際のアクセス制御はコードで行う Canで始まるメソッドを実装することで行う

partial void ContactSet_CanUpdate(ref bool result){

result = Application.Current.User.HasPermission(Permissions.ContactUpdate);}


LightSwitchの配置

オンプレミス

クラウド

Azure

WebSiteに発行することで可能

SharePoint

SharePoint の有効化を行う必要がある

開発者サイトを作成して利用する


その他

ローカライズ

リソースファイルを定義して表示名に設定する

$(シンボル)の形式

HTMLはresjsonファイルで定義。既定は無い

日本語のリソースファイル client.lang-JA.resjson

チーム開発

Visual Studio 2013 以降では、LightSwitchはエンティティと画面ごとに個別のモデル (.lsml) ファイルを持つフラットなプロジェクト構造になったため管理しやすくなった

エンタープライズ.net light switch

Technology