Uncategorized

Excel のクラウドな開発 (Office 365 SharePoint Online 編 : REST, JavaScript, etc)

2015/11 追記 : この機能は、SharePoint 2016 以降では、SharePoint Server から削除予定です。今後は、Office Online Server (Excel Online) の Excel Services、または、Office 365 API の Excel REST API を使用してください。

Excel のクラウドな開発

こんにちは。

「Web 上にアップロードされ、公開された Excel で、どこまでカスタマイズが可能か」 というご質問をよく受けますので、以下に まとめて記載しておきます。(既に、3 名の方からご質問を頂きました。)
セミナーなどで既に何度かお見せしていますが、改めて、以下に纏めておきましょう . . .

 

SharePoint 2010 / SharePoint Online (Office 365) における Excel の Web 活用 (概要)

SharePoint 2010 には、Office Online (旧 Office Web App) という追加のコンポーネントをインストールすることによって、Excel や Word などの Office 文書を Web ブラウザーのみを使って操作できるようになっており、それぞれ、Excel Online (旧 Excel Web App)、Word Online (旧 Word Web App) . . .  という Web 用の Office アプリケーションが使用されます。(という当たり前の説明からですみません . . .) そして、この Office Online は、Office 365 (SharePoint Online) や OneDrive (旧 Windows Live SkyDrive) においても使用可能です。

しかし、このように、Web 上に公開された Excel のワークブックでは、Excel でよく使用されてているマクロや VBA などがそのまま動作するわけではありません。(勿論、関数は動作します。) Visual Studio で構築した Office のアプリケーションも、リッチ クライアント (Microsoft Excel など) では動作しますが、Excel Online 上で動作させることはできません。
では、Web 上に公開されたこうした文書は、いっさいのカスタマイズやプログラムからの利用ができないかというと、もちろん、そのようなことはありません。提供されている Web 上の流儀に沿って実装することで、さまざまな形で利用できるようになっています。ここでは、そうした方法 (手法) を以下に纏めます。

今回は、まず、Office 365 (SharePoint Online)、あるいは、オンプレミス上、もしくはインターネット上の SharePoint Server 2010 のケースを説明します。次回、OneDrive のケースを説明する予定ですが、後述するように、SharePoint を使用した Excel の Web 活用シナリオは、OneDrive と比べて、桁違いにさまざまな手法が提供されています。

2011 / 11 追記 : Office 365 SharePoint Online を使用して、Microsoft Account (Windows Live ID) を持つ一般のユーザーと情報共有できるようになりました。詳しくは、下記を参照してください
/2011/11/20/office-365-sharepoint-online-external-user/

また、下記の後半で使用する Excel Services は、Office 365 の E3 以上の契約が必要となるので、こうした点にも注意してください。(SharePoint Online で使用可能な機能の一覧は、こちら を参照してください。)

では、思いつく限り、その活用手法を説明していきましょう。

 

Excel Services REST API (基礎)

まずは、Excel 2010 を開き、下図の通り、テーブルとグラフを作成します。(このワークブックは、以降のすべての説明で使用します。)

Excel の [挿入] タブの [テーブル] ボタンを押して、テーブル オブジェクトとして以下のテーブルを作成しておきます。(今回は、このテーブルの名前を「table1」とします。) それぞれの従業員に対し、「作業工数」(労働時間) と「諸手当」の欄があり、「支払い」列には、「作業工数 * 時給 + 諸手当」の計算結果を設定しています。
なお、この C2 のセル (時給の値) には「exrate」という名前を定義しておきます。
さらに、[挿入] タブの [グラフ] ボタンを押して、上記のテーブルをもとに、従業員と支払い金額のグラフを挿入しておきます。(このグラフの名前を、今回は、「graph1」とします。)

補足 : Excel で、テーブルなど、ブック上のオブジェクトの名前を管理するには、[数式] タブの [名前の管理] を選択します。
また、グラフ オブジェクトの名前を設定するには、対象のグラフを選択して、[レイアウト] タブの [グラフ名] のプロパティを変更します。
さらに、セルに名前を定義するには、セルを選択して、左上の名前の入力欄に文字列を設定します。(下図)

そして、上記のワークブック (今回は、「Book1.xlsx」とします) を、SharePoint Server (または、Office 365 の SharePoint Online) のドキュメント ライブラリーにアップロードします。今回は、「共有ドキュメント」(Shared Document) のドキュメント ライブラリにアップロードします。

以上で、準備は完了です。

まず、以下の URL にアクセスしてみましょう。(Office 365 の場合は、URL は、すべて https:// となります。)

http://<サイトの URL>/_vti_bin/ExcelRest.aspx/Shared%20Documents/Book1.xlsx/model/charts(‘graph1’)

下図の通り、名前 (graph1) を付けたグラフ部分がイメージとして表示されます。

また、下記の通り入力すると、Book1.xslx で利用可能な図 (チャート) の一覧がフィードで返ってきます。

http://<サイトの URL>/_vti_bin/ExcelRest.aspx/Shared%20Documents/Book1.xlsx/model/charts

テーブル (table1) を表示するには、同じく、以下の通り指定します。

http://<サイトの URL>/_vti_bin/ExcelRest.aspx/Shared%20Documents/Book1.xlsx/model/tables(‘table1’)

上記は、下記の通り指定しても同じ結果となります。(このように、名前が付いていない範囲も、下記の方法で指定できます。「B2%7CD6」は、「B2|D6」を URL エンコードしています。)

http://<サイトの URL>/_vti_bin/ExcelRest.aspx/Shared%20Documents/Book1.xlsx/model/Ranges(‘Sheet1!B2%7CF7’)

このように、URI ベースで、Excel ファイルの各オブジェクトを参照できるので、SharePoint (SharePoint Online) 上のポータル (トップページ) や、ブログ、Wiki Page などに、最新のグラフやテーブルを表示したり、Office 365 (SharePoint Online) で Word ドキュメントを新規作成し、図 (イメージ) として挿入するといった利用方法が可能です。

 

Excel Services REST API (フォーマット指定)

上記では、図はイメージで表示され、テーブルは HTML の Table タグで表示されますが、以下の通り指定すると、テーブルの結果が atom フィードで返ってくるため、結果をプログラムで解析したり、特定の値のセット (合計値など) だけをプログラムで扱うような場合などに使用できます。(なお、残念ながら、Json は使用できません . . .)

http://<サイトの URL>/_vti_bin/ExcelRest.aspx/Shared%20Documents/Book1.xlsx/model/tables(‘table1’)?$format=atom

補足 : フォーマットは、html、image、atom、workbook の 4 種類が指定できます。workbook を指定すると、ワークブック自体 (.xlsx そのもの) も取得できます。

例えば、Word のクイック パーツ (Quick Parts) を使用すると、XPath を使って単語へのリンクが埋め込めるため、Excel 上の集計値 (集計結果) を Word 文書に埋め込むようなシナリオでも使用できるでしょう。

 

Excel Services REST API (パラメーターの使用)

Excel Services REST API を使用して、入力値に応じて出力結果を変えるような、対話的な呼出しもできます。

例えば、上図の Excel ワークブックで、「時給」(C2 のセル) の箇所を 500 円に設定した場合のグラフを取得したい場合、下記の URL で取得できます。(この場合、もちろん、オリジナルの Book1.xlsx が変更されるのではなく、表示だけが変更されます。)

http://<サイトの URL>/_vti_bin/ExcelRest.aspx/Shared%20Documents/Book1.xlsx/model/charts(‘graph1’)?Ranges(‘exrate’)=500

上記では exrate の値だけを設定していますが、「&」でつなげて、複数のパラメーター (parameter) を指定できます。

ここで紹介した Excel Services REST API では、残念ながら、(Excel Online のような) 対話型 UI の提供や、更新処理はサポートされていませんが、このあと述べる手法を使用してこうした処理を実現してみましょう。
なお、この Excel Services REST API の詳細は、下記の MSDN のドキュメントを参照してください。

[MSDN] Excel Services REST API :
http://msdn.microsoft.com/ja-jp/library/ee556413.aspx

 

対話型 UI と Excel Web Access (EWA)

Excel のシートそのもののように、利用者 (エンドユーザー) に値を入力させて、適宜、表示されるテーブル (PivotTable 含む) や図などを変更するような UI も Web で提供できます。(もちろん、Excel Online 自身は、こうした対話型 UI ですが、ここでは、こうした UI を「部品」として利用します。) SharePoint が持っている Excel Services の発行機能を使用します。

補足 : SharePoint では、Office Online と、下記で述べる Excel Web Access という 2 つの類似した Web 公開の機能が存在していますが、もともと、SharePoint Server 2007 の頃に、この Excel Services による Excel Web Access の仕組みが実装され、SharePoint 2010 以降で Excel Online (Excel Web App) が追加されたという歴史があります。

さきほどは、Excel ファイルを作成して、そのままドキュメント ライブラリーにアップロードしましたが、今回は、アップロードの前に、Book1.xlsx を (Excel を使って) 開いて、いくつか事前設定をおこないます。

Excel 2010 でワークブック (Book1.xlsx) を開き、[ファイル] – [保存と送信] で、[SharePoint に保存] を選択して、[発行オプション] をクリックします。(下図)

 

表示される画面 (ダイログボックス) で、テーブルとグラフを表示するため、[ブック内のアイテム] を選択して、「graph1」、「table1」、「exrate」を選択します。(今回のデモでは「exrate」は不要ですが、この後の JavaScript のデモで使用するため、「exrate」も使用可能にします。)

つぎに、[パラメーター] タブを選択し、[追加] ボタンを押して、「exrate」のパラメーター (上図の C2 のセル) を追加します。

以上で準備が整ったので、前述と同様に、この Book1.xlsx を「共有ドキュメント」(Shared Document) のドキュメント ライブラリーにアップロードしてみましょう。

まず、アップロードされた Excel をクリックして、Excel Online で開くと、下図の通り、パラメーターの入力欄が (右に) 追加されているのがわかります。この入力欄に値を設定すると、設定した値に応じて、上図の C2 のセルの内容が変更され、グラフ (graph1) が変更されます。(ここで変更した内容は、オリジナルのブックには反映されず、この UI だけに反映されます。)
テーブルを表示するには、右上の [表示] のドロップダウンで「table1」を選択します。

つぎに、SharePoint の Excel Web Access の Web パーツ を使用して、テーブル、図 (Chart)、パラメーター フィルターなどを組み合わせた独自な UI を作成してみます。
例えば、上記の Book1.xlsx をアップロードしたサイトで SharePoint の既定のトップ ページ (Home.aspx) を表示して、このページを編集モードに変更します。リボンの [挿入] タブ、[その他の Web パーツ] ボタンを押して、[Excel Web Access] を選択すると、ページ内に Excel Web Access の Web パーツが挿入されます。

挿入された Web パーツで、[Web パーツの編集] (下図) を選択すると、Web パーツの設定画面が表示されます。

表示される Web パーツの編集画面で、[ブック] 欄に上記の Book1.xlsx の URL (http://<サイトの URL>/Shared%20Documents/Book1.xlsx) を入力し、[名前付きアイテム] 欄に図の名前 (上記の graph1) を設定します。すると、下図の通り、グラフが Home.aspx 上に埋め込まれて表示されます。

この Excel Web Access では、さまざまな設定が可能です。例えば、上記の [Web パーツの編集] 画面で、[パラメーター 作業ウィンドウの表示] のチェックボックスを外すと、下図の通り、パラメーター ウィンドウを非表示にできます。

さまざまな UI 部品 (Web パーツ) 間の接続も可能です。例えば、独自なフィルター (テキスト ボックスなど) の Web パーツを追加し、このフィルターの値と上記の Web パーツのパラメーター (exrate) を接続します。すると、下図のように、テキストボックスの内容を変更すると、グラフが変更されるようになります。(この場合も、もちろん、オリジナルのワークブックは変更されません。)

補足 : なお、SharePoint 2010 (Office 365) の Wiki Page で Web パーツの接続 (Connect) をおこなうには、SharePoint Designer を使用してください。(Wiki Page でなく、WebPart Page の場合は、ブラウザーで接続可能です。)

補足 : 上記のようにパラメーターなどを活用した部品化をおこなわず、Excel のテーブルなどをそのまま Excel Web Access の Web パーツに表示して、その上で編集可能にすることもできます。([文字および数式の入力] プロパティを有効にします。)

 

JavaScript によるロジック実装 (Excel JavaScript OM)

上記の Excel Web Access を使用した UI では、さらに、JavaScript を使用して、ワークブック内のアイテムを操作できます。

例えば、上記の Excel Web Access の Web パーツが挿入されたページに、[コンテンツ エディター] Web パーツを挿入し、(コンテンツ エディター内の文字列を選択した状態で) リボンの [HTML] – [HTML ソースの編集] を選択します。(下図)

補足 (追記) : JavaScript のみを挿入する場合、SharePoint 2013 以降では、[Script Editor] Web パーツが使用できます。

そして、表示される HTML エディターに、下記の通りコードを記述してみましょう。
このコードでは、ボタンを押すと、Excel Web Access 上 (Book1.xlsx) のパラメーター「exrate」を取得して、ここに 500 の値を設定しています。

<script type="text/javascript">var ewa;if (window.attachEvent)  window.attachEvent('onload', MyPageLoad1);else  window.addEventListener('DOMContentLoaded', MyPageLoad1, false);function MyPageLoad1() {   Ewa.EwaControl.add_applicationReady(GetTargetControl);}function GetTargetControl(){  // Get Excel Web Access Web Part  ewa = Ewa.EwaControl.getInstances().getItem(0);   } function SetRateTest(){  var param = ewa.getActiveWorkbook().getNamedItems().getItemByName('exrate');  param.getRefersToRangeAsync(GetRangeCallback, null);}function GetRangeCallback(asyncResult){  var range = asyncResult.getReturnValue();  //var userdata = asyncResult.getUserContext();  // [[value]] is two dimensional array of json format.  range.setValuesAsync([[500]], SetValuesCallback, null)}function SetValuesCallback(returnValues){  // nothing to do  //var graph = ewa.getActiveWorkbook().getNamedItems().getItemByName('graph1');  // . . .}</script>Set 500 as rate :<input type="button" id="MyTestButton" value="500" onclick="SetRateTest()" />

さいごに、Excel Web Access の Web パーツの編集画面で、下図の通り、[文字および数式の入力] を許可しておいてください。(上記のコードで、exrate の値を書き換えているためです。)

ボタンを押すと、パラメーター (exrate) が 500 に変更され、下図のようにグラフが変更されます。(もちろん、ここでも、オリジナルのワークブックは変更されません。)

この JavaScript (Excel JSOM) を使って、ワークブックやシートの操作、図やテーブル (PivotTable 含む) の操作、値の取得・設定 (setValuesAsync など)、再計算、イベント処理など (add_activeSelectionChanged など)、Excel のマクロにも負けないさまざまな処理が実装できます。
なお、使用可能なオブジェクトやメソッドなどについては、下記の MSDN のドキュメントが参考になります。

[MSDN] SharePoint 2010 Ewa Namespace :
http://msdn.microsoft.com/en-us/library/ee589018.aspx

 

Excel Web Services (SOAP API) によるデータ操作

さいごに、SharePoint では、SharePoint Server 2007 の頃から、Excel Web Services API という SOAP ベースの API も提供されています。(無論、SharePoint 2010、Office 365 などでも、そのまま使用できます。)
上記がすべて表示や対話の処理であるのに対し、この Web サービスでは、リモートから、Excel を開かずに、オリジナルのデータに対する取得・設定をおこなうことができます。(この Web サービスを使用すると、発行された Excel ワークブックのデータ更新や、データ更新後の特定のセルの再計算などを、リモートから実行できます。)

ここでは、このサービスの利用方法や、メソッドの詳細は説明しませんが、この Web サービスの URL は、http://<サイトの URL>/_vti_bin/ExcelService.asmx です。(Visual Studio を使用している場合は、[サービス参照の追加] で使用できます。)

 

このように、SharePoint (Office 365 含む) を使用すると、Web 上に発行された Excel ワークブックを非常に多くのシナリオで活用できるようになっています。(次回の OneDrive の場合と比べて頂くと、まさに、エンタープライズ向けの多くの機能が提供されていることに気づいて頂けるかと思います。)
Office 365 の試用版 (トライアル) もご利用頂けますので、是非、お試しください。

補足 : ここでは説明を省略しますが、SharePoint では、通常の埋め込み関数では処理不可能な高度な関数を、ユーザー定義関数 (User Definition Function, UDF) と呼ばれる方法で Excel に埋め込むことができます。(UDF を使用した簡単なサンプルについては、以前、「Excel と Excel Services を使ったデータベース連携」で説明していますので参考にしてください。)

補足 : この他にも、SharePoint 2010 には、グラフ Web パーツや、Performance Point Services (ただし、Office 365 では使用できません) が提供する Web パーツなどさまざまな BI 系のコンポーネントがあります。ここでは、これらの説明は省略します。

 

Categories: Uncategorized

Tagged as: ,

2 replies»

Leave a Reply