クラウドを利用した
Windows ストアアプリ開発
~ Windows Azure と連携する
日本マイクロソフト株式会社
デベロッパー&プラットフォーム統括本部
クライアントテクノロジー推進部
エバンジェリスト 大西 彰 (@oniak3)...
Agenda
デバイスとサービスを組み合わせる

Windows Azure を知る
シナリオ別の実装方法を知る
デバイスとサービスを組み合わせる
インターネット、
グローバル利用の
視点で考える
マイクロソフトが提供しているサービス
マイクロソフトが提供しているサービス

2.5 億
アカウント

200+
サービス

24 時間 / 7 日稼働

約

3億

300 PByte

接続ユーザー

Bing データ

4億

55 億...
そもそも、サーバーって?
クライアント
サーバー型の考え方

クライアントからの要求に対して、

何らかのサービスを提供する側のアプリ
クライアント・サーバー型の構成
非同期通信の世界

時刻 t0
時刻 t1

リクエスト

レスポンス

処理時間
クライアントとサーバーのデータ交換

時刻 t0
時刻 t1

リクエスト
レスポンス

文字列
文字列

JSON や XML

処理時間
サービスにつながらない状況
ちょっと前までとは違った視点で開発
デバイス&サービス
これからの考え方

・常時接続とは限らない

モバイルにおけるタブレット利用
・直接データベースに接続しない

サービスアプリを経由して通信
・文字列でデータ交換

XML
:型を明確にす...
Windows Azure を知る
Windows Azure
開発言語

アプリケーション
キャッシュ

Web

サイト

クラウド
サービス

ID

仮想
マシン

サービスバス

モバイル
サービス

コンピューティング

世界規模のクラウド基盤
サーバー/ ネットワーク/ データセンター
高度な...
シナリオ別の実装方法を知る
代表的なシナリオ
シナリオ

ストアアプリ側

クラウド側

Web ページの表示

WebView

Web サイト

RSS / ATOM フィード

SyndicationClient

Web サイト上のブログ

画像、音楽、ビデオ

...
Web ページの表示
<WebView x:Name="myWebView" />

myWebView.Navigate(new Uri("http://8store.azurewebsites.net"));

Navigate
LoadC...
RSS / ATOM フィード
async void LoadFeed()
{
var client = new SyndicationClient();
var uri = new Uri("http://8store.azurewebsit...
画像
<Image Source=
"https://mediasvc5wm2h8jg564k6.blob.core.windows.net/demo/onia3beer.jpg" />

Source
画像の読み込みは
非同期
画像のダウンロード
GetBufferAsync
async void DownloadImage()
{
var client = new HttpClient();
var uri = new
Uri("https://mediasvc5w...
音楽・ビデオの再生
<MediaElement x:Name="myME" AreTransportControlsEnabled="True"
Width="640" Height="400"
Source="https://mediasvc...
軽量なデータアクセス
MbClient はモバイルサービスのクライアント

public class TodoItem
{
public int Id { get; set; }
GetTable<TodoItem>()
public stri...
軽量なデバイスへの通知
Node.js サーバー側

クライアント側
REST サービスの呼び出し
async Task<string> GetFromWebAPI()
{
var client = new HttpClient();
var uri = new Uri("http://aka.ms/boyaca...
WCF サービスの呼び出し
async Task<string> PostMyMessage(string message)
{
ServiceReference1.MyServiceClient client =
new ServiceRef...
デバイス&サービス 考え方の一例
デバイス上でサービスのマッシュアップ
読み

通信

書き

<Windows Azure Web サイト>
商品サービス
ASP.NET Web API
<Windows Azure Web サイト>
注文モニタ
ASP.NET Signal...
デバイス&サービス、これからの開発
マルチ デバイス

クラウド

社内システム

オーダー
リアルタイム/
バッチ連携

オーダー

オーダー

構築アプリ
活用サービス
開発ツール

デバイス アプリ

バックエンドサービス

基幹システム...
クラウドを利用した
Windows ストアアプリ
・非同期呼び出し
・仕事用も遊び用も
・グローバルリーチ
クラウドを利用したWindows ストアアプリ開発 ~ Windows Azure と連携する ~
クラウドを利用したWindows ストアアプリ開発 ~ Windows Azure と連携する ~
クラウドを利用したWindows ストアアプリ開発 ~ Windows Azure と連携する ~
Upcoming SlideShare
Loading in …5
×

クラウドを利用したWindows ストアアプリ開発 ~ Windows Azure と連携する ~

1,525 views
1,370 views

Published on

0 Comments
3 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
1,525
On SlideShare
0
From Embeds
0
Number of Embeds
127
Actions
Shares
0
Downloads
2
Comments
0
Likes
3
Embeds 0
No embeds

No notes for slide

クラウドを利用したWindows ストアアプリ開発 ~ Windows Azure と連携する ~

  1. 1. クラウドを利用した Windows ストアアプリ開発 ~ Windows Azure と連携する 日本マイクロソフト株式会社 デベロッパー&プラットフォーム統括本部 クライアントテクノロジー推進部 エバンジェリスト 大西 彰 (@oniak3) aonishi@microsoft.com ~ http://aka.ms/wsazuredev
  2. 2. Agenda デバイスとサービスを組み合わせる Windows Azure を知る シナリオ別の実装方法を知る
  3. 3. デバイスとサービスを組み合わせる
  4. 4. インターネット、 グローバル利用の 視点で考える
  5. 5. マイクロソフトが提供しているサービス マイクロソフトが提供しているサービス 2.5 億 アカウント 200+ サービス 24 時間 / 7 日稼働 約 3億 300 PByte 接続ユーザー Bing データ 4億 55 億 Email アカウント サーチ数 / 月 4,800 万 サブスクライバー 約 5,000 万 Office Web Apps ユーザー
  6. 6. そもそも、サーバーって? クライアント サーバー型の考え方 クライアントからの要求に対して、 何らかのサービスを提供する側のアプリ
  7. 7. クライアント・サーバー型の構成
  8. 8. 非同期通信の世界 時刻 t0 時刻 t1 リクエスト レスポンス 処理時間
  9. 9. クライアントとサーバーのデータ交換 時刻 t0 時刻 t1 リクエスト レスポンス 文字列 文字列 JSON や XML 処理時間
  10. 10. サービスにつながらない状況
  11. 11. ちょっと前までとは違った視点で開発 デバイス&サービス これからの考え方 ・常時接続とは限らない モバイルにおけるタブレット利用 ・直接データベースに接続しない サービスアプリを経由して通信 ・文字列でデータ交換 XML :型を明確にする JSON :型を緩やかにする
  12. 12. Windows Azure を知る
  13. 13. Windows Azure
  14. 14. 開発言語 アプリケーション キャッシュ Web サイト クラウド サービス ID 仮想 マシン サービスバス モバイル サービス コンピューティング 世界規模のクラウド基盤 サーバー/ ネットワーク/ データセンター 高度な自動化 柔軟性 統合リソース管理 従量課金 北米4カ所、ヨーロッパ2カ所、アジア2カ所、日本2カ所 豪州2カ所 + CDN 24 カ所 SQL メディア データベース CDN ビックデータ バックアップ テーブル データ管理 HPC BLOB データ分析 仮想 ネットワーク 統合 トラフィック マネージャー ネットワーク
  15. 15. シナリオ別の実装方法を知る
  16. 16. 代表的なシナリオ シナリオ ストアアプリ側 クラウド側 Web ページの表示 WebView Web サイト RSS / ATOM フィード SyndicationClient Web サイト上のブログ 画像、音楽、ビデオ Image, MediaElement Azure ストレージ 軽量なデータアクセス MobileServiceClient モバイルサービス 軽量なデバイスへの通知 MobileServiceClient モバイルサービス REST サービスの呼出 HttpClient サービス参照 クラウドサービス WCF サービスの呼出 クラウドサービス
  17. 17. Web ページの表示 <WebView x:Name="myWebView" /> myWebView.Navigate(new Uri("http://8store.azurewebsites.net")); Navigate LoadCompleted
  18. 18. RSS / ATOM フィード async void LoadFeed() { var client = new SyndicationClient(); var uri = new Uri("http://8store.azurewebsites.net/?feed=rss2"); var feed = await client.RetrieveFeedAsync(uri); } await client.RetrieveFeedAsync SyndicationFeed feed
  19. 19. 画像 <Image Source= "https://mediasvc5wm2h8jg564k6.blob.core.windows.net/demo/onia3beer.jpg" /> Source 画像の読み込みは 非同期
  20. 20. 画像のダウンロード GetBufferAsync async void DownloadImage() { var client = new HttpClient(); var uri = new Uri("https://mediasvc5wm2h8jg564k6.blob.core.windows.net/demo/onia3beer.jpg"); var stream = await client.GetBufferAsync(uri); var destination = Path.GetFileName(uri.LocalPath); StorageFile file = await KnownFolders.PicturesLibrary.CreateFileAsync( destination, CreationCollisionOption.GenerateUniqueName); await FileIO.WriteBufferAsync(file, stream); }
  21. 21. 音楽・ビデオの再生 <MediaElement x:Name="myME" AreTransportControlsEnabled="True" Width="640" Height="400" Source="https://mediasvc5wm2h8jg564k6.blob.core.windows.net/demo/Win dows81intro.mp4"/> Source
  22. 22. 軽量なデータアクセス MbClient はモバイルサービスのクライアント public class TodoItem { public int Id { get; set; } GetTable<TodoItem>() public string Text { get; set; } public bool Complete { get; set; } .InsertAsync } async void SaveData() { var newItem = new TodoItem { Text = string.Format("{0} > Developer Camp デモ", System.DateTime.Now.ToString("hh:mm:ss")) }; await App.MbClient.GetTable<TodoItem>().InsertAsync(newItem); }
  23. 23. 軽量なデバイスへの通知 Node.js サーバー側 クライアント側
  24. 24. REST サービスの呼び出し async Task<string> GetFromWebAPI() { var client = new HttpClient(); var uri = new Uri("http://aka.ms/boyacatalog2"); return await client.GetStringAsync(uri); } GetStringAsync string
  25. 25. WCF サービスの呼び出し async Task<string> PostMyMessage(string message) { ServiceReference1.MyServiceClient client = new ServiceReference1.MyServiceClient(); var echo = await client.EchoAsync(message); return echo; } EchoAsync string
  26. 26. デバイス&サービス 考え方の一例
  27. 27. デバイス上でサービスのマッシュアップ 読み 通信 書き <Windows Azure Web サイト> 商品サービス ASP.NET Web API <Windows Azure Web サイト> 注文モニタ ASP.NET SignalR <Windows Azure モバイルサービス> 注文サービス TodoItemテーブル
  28. 28. デバイス&サービス、これからの開発 マルチ デバイス クラウド 社内システム オーダー リアルタイム/ バッチ連携 オーダー オーダー 構築アプリ 活用サービス 開発ツール デバイス アプリ バックエンドサービス 基幹システム Windowsストア、 Xamarin Windows Azure モバイルサービス など パッケージ Visual Studio (共通プラットフォーム/共通スキルで開発)
  29. 29. クラウドを利用した Windows ストアアプリ ・非同期呼び出し ・仕事用も遊び用も ・グローバルリーチ

×