こんにちは。
さて、今日は、Office Open XML、および、以前セミナーでもご紹介した Microsoft 365 で動くクラウド アプリケーションの開発サンプル (サンプル アプリケーション) をご紹介します。
- Office 文書作成 (OpenXML)
- SharePoint Online へのファイル保存 (SharePoint WS-Trust)
- Excel、Word 上で動くクラウド アプリケーション (Office Add-in)
- SharePoint Online、SharePoint Server 上で動くクラウド アプリケーション (SharePoint Add-in)
- Outlook カレンダーへのスケジュール登録 (iCalendar)
- メールの一覧 (Microsoft Graph)
- スケジュール / カレンダーの通知・同期 (Sync and Notify)
ソースコードは、最後に添付しておきました。まずは使ってみて、どのような開発が可能か、イメージをつかんでください。
Office 文書作成 (Office OpenXML)
[デモ サイト] http://cloudstoragesample.azurewebsites.net/
OpenXML を使って、Word ファイルを動的に作成 (自動作成) するサンプル アプリケーションです。Web で入力された内容に従って、インメモリー上で Word ファイルを自動作成します。
使い方は、以下の通りです。
ブラウザーで上記のサイトを表示すると、下図の請求書入力フォーム (Web フォーム) が表示されます。
上図で、氏名、郵便番号、住所、電話番号、メールアドレスを入力して、[次へ進む] ボタンを押します。
表示される画面で内容を確認して、[請求書を表示] ボタンを押し、ダウンロードされるファイルを開きます。
Microsoft Word (Word 2007 以上) が起動し、上記で入力した内容に応じて Word 文書が自動生成されているのが確認できます。
このアプリケーションは、Windows Phone を使っても、同様に、Word ファイルを開いて確認できます。(Windows Phone の Office Hub に入っている Office Mobile が使用されます。)
作成されたファイルに簡単な修正などをおこなって、OneDrive (SkyDrive) や SharePoint Online に保存できます。(そして、あとから、家や会社のパソコンで、細かな編集作業が継続できます。)
(Windows Phone : 左が Web の入力、右が生成された Word ファイル)
例えば、Windows Phone の開発言語 (Silverlight) には OpenXML SDK (もしくは、System.IO.Packaging 名前空間) は提供されていませんが、このようにクラウド (Windows Azure) 上のサービスを経由して、Office ファイル (Excel、Word など) を扱ったスマートフォン アプリケーションを構築することも可能です。
Office OpenXML (OOXML) を使用した開発手法については、「Office 開発入門 “10行でズバリ !”」を参照してください。
SharePoint Online へのファイル保存 (SharePoint WS-Trust)
2014/05 追記 : 最新の開発環境では、後述する Microsoft Graph が使用できます。(本サンプルでは、WS-Trust を使用しています。)
[デモ サイト] http://cloudstoragesample.azurewebsites.net/
SharePoint Online と連携して動作するサンプル アプリケーションです。(今回は、ファイルの保存をおこないます。)
上記と同じアプリケーション (Word のサンプル) で、今度は、[クラウド ストレージへ保存] ボタン (上図参照) を押すと、作成したドキュメント (Word 文書) を SharePoint Online に保存するための画面 (下図) が表示されます。
この画面に、お使いの SharePoint Online のサイトの URL と、ユーザー ID (アカウント)、パスワードを入力すると、サイトのドキュメント ライブラリーの一覧が選択可能になるので、保存先のドキュメント ライブラリーを選択して [Save] ボタンを押します。
上記のドキュメント (Word 文書) は、SharePoint Online に保存されます。Office Online を使って、内容を確認できます。
SharePoint Online 連携は、現在、Microsoft Graph (OAuth / REST による API) が使用できます。ここで使用している WS-Trust を使った連携については、「AD FS フェデレーションを処理する Client Programming (Office 365 編)」を参照してください。また、OneDrive のプログラミングによる認証 (OAuth との連携) については、「OneDrive (SkyDrive) REST API を使った Web アプリケーション開発」を参照してください。
Excel、Word 上で動くクラウド アプリケーション (Office Add-in)
[ダウンロード] App.xml
Office Online を使用する場合は OneDrive、デスクトップ版の Office を使う場合は Excel 2013, または Word 2013 以上が必要です。
まずは、Office アドイン (Office Add-ins) を使用するための設定をおこないます。(通常は、Office ストアから検索してインストールできます。)
まず、上記の App.xml をローカルにダウンロードしてください。
Office Online (Excel Online) を使う場合は、OneDrive にログインして Excel ブックを新規作成し (または、既存の Excel ブックを編集モードで開き)、Excel Online のリボンの [Insert] (挿入) – [Office Add-ins] (Office アドイン) を選択します。
表示される画面で [Manage My Add-ins] (マイ アドインの管理) – [Upload My Add-in] (マイ アドインのアップロード) を選択するとファイル選択の画面が開くので、ここで上記でダウンロードした App.xml を選択します。
デスクトップ版 (Windows, Mac) の Excel を使う場合は、あらかじめ Windows の共有フォルダーを作成し、上記の App.xml をこの共有フォルダーに配置 (コピーなど) します。
つぎに、Excel を起動し、[ファイル] – [オプション] メニューを選択します。表示されるオプション画面で、[セキュリティ センター] タブを選択して、[セキュリティ センターの設定] ボタンをクリックしてください。
表示される画面で、[信頼できるアプリ カタログ] タブを選択して、ここに上記の共有フォルダーを追加します。([メニューに表示する] のチェック ボックスも選択しておいてください。)
Excel を再起動し、リボンの [挿入] タブの [個人用アプリ] (または、[My アドイン]) を選択します。表示される画面で、[共有フォルダー] を選択すると、下図の「Test App」があるため、これを挿入します。
このアプリでは、リクルート株式会社 ATND API (http://api.atnd.org/) を使用して日本のイベント (セミナー) の検索をおこない、Office 文書に挿入できます。2020/04 で ATND API はサービスを終了しましたので、現在はダミーのイベントデータを表示しています。（2020/05 追記）
作業ウィンドウ (右) にイベント検索画面が表示されますので、ここで イベントを検索して、[Add] リンクをクリックします。Excel シートの選択されている箇所に、選択したイベントの内容が表形式で挿入されます。
このアプリは、Word でも使用できます。同様に、Word 上にこのアプリを挿入して、アプリの [Add] ボタンを押すと、Word 文書に、イベントの情報が表として挿入されます。
Office アドイン (Office Add-ins) の開発手法については、「@IT : Office ストアで世界に飛び出そう! 最新 Office 2013 アプリ開発入門 (全 3 回 連載)」が参考になります。
2017/12 追記 : SharePoint を使用した最新の UI 開発は、SharePoint Framework を使用してください。(ここで紹介している開発手法は、古い情報です。)
[ダウンロード] SP2013AppsDemo.app
SharePoint 2013 以上の SharePoint Server、または、SharePoint Online が必要です。
まず、SharePoint 2013 のアプリ カタログ (App Catalog) に、上記の .app ファイルを登録 (追加) します。
Microsoft 365 (SharePoint Online) の場合は、SharePoint 管理センター (SharePoint admin center) の画面を開き、[アプリ] (apps) を選択し、[アプリ カタログ] (App Catalog) をクリックするとアプリ カタログを表示できます。
SharePoint Server (On-Premises) の場合は、[サーバーの全体管理] (Central Administration) 画面の [アプリ] (apps) – [アプリ カタログの管理] (Manage App Catalog) から アプリ カタログを表示できます。(ただし、SharePoint Server では、事前に App Catalog のセットアップ が必要です。)
つぎに、このアプリをサイトに追加します。
サイトを開き、[サイト コンテンツ] をクリックして、表示される画面で [アプリの追加] をクリックします。すると、下図の画面が表示され、サイトに上記のアプリ (SP2013AppsDemo) が追加できます。(このアプリをクリックして追加してください。)
追加したアプリを選択すると、下図の「開催場所リスト (首都圏版)」が表示されます。
このリストでは、アイテムの新規作成時に、タイトルに「ビックサイト」、「パシフィコ横浜」、「幕張メッセ」などの実在の会場名を入力すると、Bing Maps に問い合わせをおこなって、その住所を自動設定します。(ただし、「都道府県」欄と「その他住所」欄が空になっている必要があります。)
登録した会場の所在地が、東京都、神奈川県、千葉県、埼玉県のいずれかの場合、首都圏の地図上に会場がマップされます。
リストからアイテム (会場) を 1 つだけ選択すると、リボンの [場所の表示] ボタンがクリックできますので、このボタンをクリックします。
会場の地図が、Bing Map で表示されます。
ここで、住所 (テキスト) を変更すると地図が変更され、また、地図をマウスで右クリックすると、住所 (テキスト) が選択した位置の情報に変更されます。さらに、[Update address !] ボタンを押すと、変更した住所が SharePoint のリストに反映されます。
SharePoint アドイン (SharePoint Add-ins) の開発手法については、SharePoint アドイン開発の連載 を参照してください。
Outlook カレンダーへのスケジュール登録 (iCalendar)
[デモ サイト] http://outlooksample.azurewebsites.net/
ASP.NET MVC を使って、Outlook の予定表を動的に作成し、Outlook に登録するサンプル アプリケーションです。リクルート株式会社 ATND API (http://api.atnd.org/) を使用して国内 (日本) イベントの一覧を取得します。2020/04 で ATND API はサービスを終了しましたので、現在はダミーのイベントデータを表示しています。（2020/05 追記）
取得した内容に従って、インメモリー上で Outlook 用の .ics ファイルを自動作成します。
使い方は、以下の通りです。
ブラウザーで上記のサイトを表示すると、下図の国内イベントの一覧が表示されます。(キーワードによる絞り込みができます。)
上図で、表示したいイベントの View リンクをクリックすると、そのイベントの詳細画面 (下図) が表示されます。
上図画面の下部の [Add to Outlook] を押すと、ブラウザーによりファイルのダウンロードが促されるため、下図の通り、[ファイルを開く] をクリックします。
Outlook のスケジュール登録画面が表示されるため (下図)、[保存して閉じる] を選択することで Outlook のカレンダーに予定 (スケジュール) が登録されます。(クライアントに、Microsoft Outlook が必要です。)
ASP.NET Web API を使用した Custom Formatter については、「Web Api で Custom MIME タイプを処理する」を参照してください。
メールの一覧 (Microsoft Graph)
[デモ サイト] https://o365apidemo.azurewebsites.net/
Microsoft Graph (旧 Office 365 API) を使用して、Outlook のメールの一覧を取得します。
ここではメール一覧のサンプルですが、Microsoft Graph を使用することで、カレンダー、ファイル (OneDrive, SharePoint)、Teams など、さまざまなサーバー上のリソースと連携できます。(更新も可能です。)
上記の URL にアクセスすると、Microsoft 365 の SignIn 画面 (ログイン画面) が表示されるので、お持ちの Microsoft 365 のアカウントでログインします。(Outlook.com のアカウントでログインすることもできます。)
ログインをおこなうと、下記の Consent UI (メールの読み込みを許可する画面) が表示されます。(この画面で承諾をおこなうと、次回以降は表示されません。)
上記画面で承諾すると、Inbox のメール一覧が表示されます。(下図)
なお、いったん許可したこのアプリの権限 (許可設定) は、以下で削除できます。(デモ後、削除しておいてください。)
Microsoft Graph を使用した開発手法については「Microsoft Graph のメリットとその使い方」を参照してください。
スケジュール / カレンダーの通知・同期 (Sync and Notify)
[デモ サイト] https://calendarsample.azurewebsites.net/
Microsoft Graph や EWS (Exchange Web Service) を使って、ユーザー情報、ファイル、カレンダーなどの同期 (Synchronization) や通知 (Notification) をおこなうアプリケーションを構築できます。
このアプリケーションは、Microsoft 365 の Exchange Online の予定表 (Calendar) と、通知 (Notification) によってリアルタイムに連携するアプリケーションです。(EWS Managed API を使用しています。)
ブラウザーで上記のサイトを表示し、下部の [同期の設定] グループにある [Exchange Online (Office 365)] (下図) を選択すると、メール アドレスとパスワードを入力するダイアログが表示されます。このダイアログ ボックスに、実際の Exchange Online (Microsoft 365) のアカウント情報を入力します。
すると、Exchange Online の実際の予定情報を取得し、この予定表 アプリケーション (ブラウザー上) に予定情報がマージされます。
さらに、Exchange Online 上で新規に予定を追加 (新規作成) すると、この予定表 アプリケーションに、リアルタイムにデータが反映されます。(ただし、作成のみで、変更や削除の際の同期機能は実装していません。)
なお、このデモでは、「同期」(Synchronization) ではなく「通知」(Notification) のみを使っていますが、「同期」を実装することで、起動の順序などに関係なく、常に矛盾のない状態で同期を維持したアプリケーションも構築可能です。
ここで使用している Exchange Web Service (EWS) と EWS Managed API を使用した開発手法については、「Exchange Online 開発 : EWS (Web サービス) による開発入門」を参照してください。（Exchange Online (Outlook) 連携は、Microsoft Graph (OAuth / REST による API) が使用できます。）
また、WebSocket などを使った Real-time Web の開発手法については、「WebSocket サーバー開発」を参照してください。
ソースコードは、以下に置いておきます。
OneDrive/SharePoint/Azure Blob の Storage 連携のサンプルコード (OneDrive)
iCalendar ファイルによる Outlook 連携のサンプルコード (OneDrive)
Office アドインのサンプルコード (OneDrive)
SharePoint アドインのサンプルコード (OneDrive)
Exchange における EWS を使ったカレンダー同期のサンプルコード (OneDrive)
Office 365 API によるメール取得のサンプルコード (OneDrive)
補足 : あくまでも、開発サンプルの目的です . . . 例によって、例外処理など、細かな処理は省略していますし、上記の Exchange のデモも、暗号化せずにパスワードをそのまま渡しています。(SSL を使用するなど、セキュリティ面も考慮して実装してください。)
※ Change History
2020/06/02 The sample of EWS with basic authentication is removed.
2020/06/02 The sample of Skype for Business (Lync) Application is removed.
Categories: Uncategorized
tsmatz
5 replies»