結局、RIAはどれを使うべきなのか?
連載インデックスへ
検証特集:クラウドの“クライアント”としてRIAを試す(終)

SilverlightとAmazon S3で“クラウドRIA”を作ってみた


クラスメソッド株式会社
福田 寅成
2010/8/26



SOAP通信を利用したAmazon S3へのアクセス

 今回、SilverlightからAmazon S3には、SOAPを利用してアクセスします。Amazon S3はRESTとSOAPでアクセスできますが、RESTの場合、ヘッダベースで認証する必要があります。Silverlightでは、その部分のカスタマイズが許可されていないので、SOAPを利用して通信します。

 Amazon S3の場合のRESTは、前回のAdobe AIRやWPFアプリケーションなどのデスクトップアプリケーションで主に利用する通信手段です。もちろん、どちらもSOAPでアクセスしてもOKです。

clientaccesspolicy.xmlの配置

 SilverlightアプリケーションをWebサーバやクラウドに配置する際の基本としては、「crossdomain.xml」「clientaccesspolicy.xml」に関して確認しておく必要があります。ドメインをまたいでデータをやりとりする場合には、それらをあらかじめ配置しておく必要があります。そうしないと、セキュリティエラーが通信の際に発生してしまいます。

 これらポリシーファイルの配置に関しては、本番利用時には詳細な設定を行う必要があります。また、配置するサイト全体のポリシーにかかわる重要事項なので、実際のプロジェクトではプロジェクトの開始時点で各所とあらかじめ調整をしておく必要があります。

 今回は、clientaccesspolicy.xmlをアプリで表示したいバケットの直下に配置しておきます(前回紹介した「S3 Firefox Organizer」を使ってアップロードするといいでしょう)。

 また、clientaccesspolicy.xmlの設定に関しては今回は「SOAPからアクセスのあった場合のみアクセスを受け入れる」設定にしています。以下は実際の設定です。

<?xml version="1.0" encoding="utf-8" ?>
<access-policy>
<cross-domain-access>
<policy>
<allow-from http-request-headers="SOAPAction">
<domain uri="*"/>
</allow-from>
<grant-to>
<resource include-subpaths="true" path="/"/>
</grant-to>
</policy>
</cross-domain-access>
</access-policy>

 SilverlightS3プロジェクトの直下に上記サンプルを置いておきましたので、サンプルをダウンロードされた方は確認してみてください。

サービス参照の設定

 アプリケーションをゼロから作成する場合、空のSilverlightアプリケーションを作成し、以下のサービス参照の設定を行えば、後はXAMLC#のソースコードファイルを編集していくだけです。

 今回は、SOAPを使ってAmazon S3にアクセスするので、下記の手順でサービス参照をプロジェクトに追加します。

 Visual StudioのSilverlightプロジェクトを右クリックし、[サービス参照の追加]をクリックします。開いたダイアログで、Amazon S3のWSDLを入力します。WSDLの[アドレス]は「https://s3.amazonaws.com/doc/2006-03-01/AmazonS3.wsdl?」です。

図5 サービス参照の追加
図5 サービス参照の追加

 [移動]ボタンをクリックすると、サービスが検索されます。サービスに「AmazonS3」が出たら、[名前空間]の「ServiceReference1」を「AWSS3」に修正して[OK]をクリックします。すると、Service Referencesに「AWSS3」が追加され、プロジェクトルートに「ServiceReference.ClientConfig」ファイルが生成されます。

サービス参照の設定の修正

 次に、先ほど生成された「ServiceReference.ClientConfig」を修正します。デフォルトの設定ファイルは、下記のようになっています。

<configuration>
<system.serviceModel>
<bindings>
<basicHttpBinding>
<binding name="AmazonS3SoapBinding" maxBufferSize="2147483647"
maxReceivedMessageSize="2147483647">
<security mode="Transport">
<transport>
<extendedProtectionPolicy policyEnforcement="Never" />
</transport>
</security>
</binding>
</basicHttpBinding>
</bindings>
<client>
<endpoint address="https://s3.amazonaws.com/soap" binding="basicHttpBinding"
bindingConfiguration="AmazonS3SoapBinding" contract="AWSS3.AmazonS3"
name="AmazonS3" />
</client>
</system.serviceModel>
</configuration>

 これを以下の設定に修正します。

<configuration>
<system.serviceModel>
<bindings>
<basicHttpBinding>
<binding name="AmazonS3SoapBinding" maxBufferSize="2147483647"
maxReceivedMessageSize="2147483647">
<security mode="Transport" />
</binding>
<binding name="CustomAWS" maxBufferSize="2147483647"
maxReceivedMessageSize="2147483647">
<security mode="None" />
</binding>
</basicHttpBinding>
</bindings>
<client>
<endpoint address="http://バケット名.s3.amazonaws.com/soap" binding="basicHttpBinding"
bindingConfiguration="CustomAWS" contract="AWSS3.AmazonS3"
name="AmazonS3" />
</client>
</system.serviceModel>
</configuration>

 以下は、修正の概要です。

  • endpointのaddressの部分にバケット名を追加
  • bindingConfigurationをCustomAWSに変える
  • 新たにbindingとしてCustomAWSを追加。ここでHTTPでアクセスするように設定を変える

Silverlight 3のナビゲーションフレームワークを使う

 今回のアプリケーションの実装上の特徴は、ナビゲーションフレームワークとサービス参照を利用したデータ取得です。

 ナビゲーションフレームワークはSilverlight 3から登場した新機能です。以下は、主な利用の流れです。

  1. 画面をPageを継承したXAMLで作成
  2. PageをFrameクラスで管理
  3. 各画面でどの画面に行くかを指定したり、FrameからFrame内の画面を何にするか指定
  4. 画面が遷移すると、Webブラウザ上のURLも変化(ディープリンク

 まず、Main.xamlのコードを見てみると、この画面(Pageではない)は下記のようなコードです。

    <Grid x:Name="LayoutRoot" Width="640" Height="480">
<Grid.Background>
<ImageBrush ImageSource="../Style/wood_bg.png"/>
</Grid.Background>
<navigation:Frame x:Name="MainContent" Source="/Views/BucketList.xaml"/>
</Grid>

 下の方にMainContentという名前のFrameがあり、そのSourceがバケット一覧画面(Page)です。今回は各画面(Page)からどの画面(Page)に飛ぶかを各画面のイベントハンドラで実装しています。

 例えば、バケット一覧DataGridで選択されているバケットの行が変更された場合(SelectionChangedイベントが発生した場合)、下記のような形で画面遷移処理を行っています。

Uri contentListPageUri = new Uri(String.Format("/Views/ContentList.xaml?bucketName=" + bucketName), UriKind.Relative);
 
NavigationService.Navigate(contentListPageUri);

 ここでは、コンテンツ一覧画面にバケット名をパラメータとして渡しつつ画面を遷移しています。画面遷移はNavigationServiceのNavigateにURLを設定するだけです。Navigateメソッドが実装されると、Frame内のコンテンツが指定されたPageに差し替わります。

 各画面用の共通ヘッダにはコンテンツ一覧に戻る「ListBuckets」ボタンがあります。これも同様の処理をHeader.xaml.csで行っているだけです。

 このようにナビゲーションフレームワークは画面間で(主に)URLパラメータベースで値をやりとりします。パラメータはWebブラウザ上のURLに現れるので、注意してください。

 なお、Expression Blendで用意されているビヘイビアを利用した画面遷移の実装も可能です。こちらはXAMLベースでノーコーディングで実装可能です。一方で、コードビハインドで処理を記述すると、「きめ細かい処理制御ができる」というメリットがあります。

サービス参照を利用したデータ取得処理

 残りは、データの取得処理です。Amazon S3からデータを取得する場合は、少しめんどくさい処理を行う必要があります。これは、認証周りに関するわずらわしい処理で、今回その処理は「S3Helper.cs」「S3Util.cs」にまとめてあり、各画面の処理はそれらユーティリティを利用してシンプルに行っています。

 バケット一覧画面(BucketList.xaml)の初期表示処理を見てみます。Pageクラスを継承した画面はナビゲーションに関するイベントハンドラを持っています。ここではOnNavigatedToメソッドを見てみます。

DateTime timeStamp = S3Helper.GetDatestamp();
AWSS3.AmazonS3Client s3 = S3Util.getS3();

s3.ListAllMyBucketsCompleted += new EventHandler<AWSS3.ListAllMyBucketsCompletedEventArgs>(s3_ListAllMyBucketsCompleted);
s3.ListAllMyBucketsAsync(S3Util.AWS_AWS_ID, timeStamp,
S3Helper.GenerateSignature(S3Util.AWS_SECRET_KEY, S3Util.S3_OPERATION_LIST_ALL_MY_BUCKETS, timeStamp));

 このメソッドではAmazonS3Clientを利用して、バケット一覧取得処理(ListAllMyBucketsAsync)を呼び出しています。呼び出す際の引数がいろいろ必要で、ユーティリティを利用してそれらを準備しています。

 基本的に非同期処理なので、通信完了イベントをあらかじめ設定してから、通信処理を呼び出しています。通信完了イベントでは、イベント結果からバケットの一覧を取得し、バケット一覧データグリッドのItemsSourceにセットしています。

 バケット一覧画面でバケットを選択した際のコンテンツ一覧取得処理もほぼ同様です。画面表示前に画面に表示したくないファイル(clientaccesspolicy.xml)をLINQで簡単にフィルタしています。

AWSS3.ListBucketResult res = e.Result;

AWSS3.ListEntry[] originalContents = res.Contents;

var queryResult = from content in originalContents
where content.Key != "clientaccesspolicy.xml"
orderby content.Key
select content;

AWSS3.ListEntry[] contents = queryResult.ToArray();

ContentDataGrid.ItemsSource = contents;

RIAとクラウドのペアはベストパートナーである

 前回の記事から時間が空いてしまいましたが、その間もRIAとクラウドの周辺は目まぐるしく変化しています。

 RIAに関しては、今年はSilverlight 4Flex 4Adobe AIR 2の正式版が登場しました。今後RIAの本格的な業務への応用、すなわち「ビジネスRIA」としてのRIAの利用が増えて来るものと予想されます。

 クラウドに関してはWindows Azureが1月に正式公開され、さらに2月に入って実際の課金も始まりました。また、Amazon Data Services Japanが今年から本格的に日本国内での活動を開始しています。

 このRIAとクラウドのペアはベストパートナーであると考えています。それぞれがそれぞれの良さを最大限に引き出し、新たなアプリケーション開発のスタンダードを築いていくことでしょう。

 今回でいったんクラウドRIAの連載は終わりです。これまで記事を読んでいただきありがとうございました。


@IT関連記事


クラウド活用「雲活」のために押さえるべき39のポイント
安藤幸央のランダウン(50)
 活用するべきサービスか否か、クラウドの利点・問題点、クラウドプラットフォーム提供企業になるための条件、開発者がするべきことに分けて紹介
Java Solution」フォーラム 2010/2/2
FlexとSilverlightで同じアプリを作って比較してみた
結局、RIAはどれを使うべきなのか?(最終回) 業務用で定番のマスタメンテナンスの簡単なアプリを作成。RIA技術を比較検証する際の1つの手段として参考にしてほしい
リッチクライアント & 帳票」フ ォーラム 2009/2/24
体験してみて分かった“雲”の違い
特集:クラウド体験記(後編)
 Amazon EC2、Windows Azureの使用感を述べ、Force.comやGoogle App Engineを含めた、エンジニアにとってのクラウド活用の価値を総括
Insider.NET」フォーラム 2009/4/14
Silverlightは次世代のJavaScriptフレームワーク?
ついに正式リリース! いまこそ知りたい!! どの環境でも動くマイクロソフトのRIA技術Silverlightについて、実際に動く2つのサンプルを見ながら、その特徴と技術を解説
リッチクライアント & 帳票」フ ォーラム 2007/9/7
.NETを知らない人でも分かるSilverlight入門
「マイクロソフトの技術は.NETを知らないと学習できないのでは?」という読者にこそ読んでもらいたい、リッチクライアント技術Silverlightの入門連載。 もちろん、知っている人も大歓迎!
Silverlight 2で.NET技術をカッコよく使おう
連載「.NETを知らない人でも分かるSilverlight入門」の続編のSilverlight 2入門連載です。Silverlightで.NET技術をよりカッコよく簡単に使えるRIAを作ってみましょう
Silverlight制作をデザイナと開発者でコラボしてみた
実録:デザイナ×開発者コラボを成功するポイントとは Expression Blend×Visual Studioのコラボは本当に簡単なのか? 面白コンテンツの制作過程をドキュメントでお届け
プロトタイプ機能を備えた“本物”のデザイナーのツール
Expression Blend 3+SketchFlowを使ってみた 
先日発表された最新デザインツールについて、主な新機能6つと、Silverlightアプリに肉付けできるプロトタイプ機能を紹介
編集部より:クラウドコンピューティングに興味を持った読者は下記インデックスページをご確認ください。随時更新中で、クラウド・コンピューティングの最新情報も分かります。

クラウド技術入門
クラウド・コンピューティング技術。そのすべては、ここにある

プロフィール:福田 寅成(ふくだ ともなり)
クラスメソッド株式会社 エンタープライズサービス部門 システムエンジニア
大手SIerでの長いJava開発経験を経てクラスメソッドに。 Java、JavaScript/Ajax、Flex、AIR、C#など、さまざまな分野に関する技術調査研究、および業務アプリケーション開発に携わる。
FlexやAIRの開発依頼はコチラ

1-2  

 INDEX
検証特集:クラウドの“クライアント”としてRIAを試す(終)
SilverlightとAma
zon S3で“クラウドRIA”を作ってみた
  Page1
クラウドとRIAの組み合わせを試してみよう
Amazon S3のデータを扱うSilverlightアプリ
Amazon S3+Silverlightアプリを作る準備
Page2
SOAP通信を利用したAmazon S3へのアクセス
RIAとクラウドのペアはベストパートナーである



リッチクライアント&帳票 全記事一覧へ



HTML5 + UX フォーラム 新着記事
@ITメールマガジン 新着情報やスタッフのコラムがメールで届きます(無料)

注目のテーマ

HTML5+UX 記事ランキング

本日 月間