SharePoint Online で Silverlight を使う

  • [アーティクル]

発行日: 2009 年 6 月

この投稿では、Microsoft Online Services エンジニアリング チームのプログラム マネージャー II である Troy Hopwood が、Web サービスを介して SharePoint Online と統合し、SharePoint Online に展開できる、基本的な Silverlight コントロールの作成について説明しています。

このサンプルを作成および展開するには、少なくとも 1 つのサイト コレクションを持つ SharePoint Online アカウントが必要です。また、このサンプルで使用するサイト コレクションに対して “フル コントロール” 以上のアクセス許可を持っている必要があります。

Microsoft Office SharePoint Designer 2007 と Microsoft Visual Studio 2008 も必要になります。SharePoint Designer 2007 は無料で入手でき、Visual Studio 2008 は試用版を無料でダウンロードできます。

Microsoft Office SharePoint Designer 2007

Microsoft Visual Studio 2008 無料試用版

以下の手順は、Silverlight SDK と Microsoft Silverlight Tools for Visual Studio 2008 の両方がコンピューターにインストールされていることを前提にしています。インストールされていない場合、以下のサイトにある Visual Studio 2008 用ツールをインストールすると SDK もインストールされます。

Microsoft Silverlight Tools for Visual Studio 2008

シナリオ

このシナリオは、それぞれ異なるスキルを備えた数人のコンサルタントが在籍する IT コンサルティング企業の例を示しています。すべてのコンサルタント、コンサルタントのマネージャー、およびコンサルタントのスキルを表示する、シンプルな Silverlight ベースの Web パーツを作成する必要があります。

手順

次の手順では、SharePoint Online と統合するカスタムの Silverlight コントロールを作成する方法と、SharePoint Online 環境にこの Silverlight コントロールを展開する方法について説明します。展開する Silverlight コントロールが既にある場合は、「Silverlight コントロールの展開」にスキップできます。

サイト コレクションへのリストの追加

このサンプルでは、SharePoint サイトに新しいリストを作成する必要があります。このリストに「SkillsAvailable」という名前を付け、以下の列と構成を追加します。

SharePoint List 1

作成している Silverlight コントロールにデータを表示させるために、リストにいくつかのデータを入力します。

SharePoint List 2

Silverlight コントロールの作成

  1. 使用するサイト コレクションに対するフル コントロール以上のアクセス許可を持つアカウントを使用して、Microsoft Online Services シングル サインイン クライアントにサインインします (シングル サインイン クライアントを介さずに Microsoft Online Services にサインインすると、プロセス全体を通して何度も資格情報の入力を求められます)。

  2. Visual Studio 2008 を起動します。

  3. 「SilverlightExample」という名前の新しい Silverlight プロジェクトを作成します。

  4. Page.xaml をまだ開いていない場合は開き、下部にある [XAML] タブを選択します。

  5. Page.xaml の <Grid> タグの間に以下を追加します。

  6. SharePoint lists.asmx にサービス参照を追加します。

    1. ソリューション エクスプローラーで、[サービス参照] を右クリックし、[サービス参照の追加] をクリックします。

    2. [アドレス] ボックスに、リスト Web サービスのアドレスを入力します。
      (https://1.sharepoint.microsoftonline.com/\_vti\_bin/lists.asmx?wsdl)

    3. [OK] をクリックします。

  7. Page.xaml.cs を開きます。

  8. Page.xaml.cs のコードを以下のものに置き換えます。

  9. ソリューションをビルドします (F6 キーを押します)。

注: Silverlight 内のドメインを越えたセキュリティ制約のため、このソリューションのデバッグを Visual Studio で実行することはできません。

Silverlight コントロールの展開

  1. SharePoint Designer を開きます。

  2. サイト コレクションのルートに Silverlight コントロールをアップロードします。

    1. [ファイル]、[インポート]、[ファイル] の順にクリックします。

    2. [ファイルの追加] をクリックします。

    3. Silverlight ソリューションの .xap ファイルを参照します。このファイルは、ソリューションの bin ディレクトリにあります。

    注: SharePoint Designerをお持ちでない場合は、サイト コレクションの URL (https://1.sharepoint.microsoftonline.com) にネットワーク ドライブをマップし、Windows エクスプローラーを使用してファイルをアップロードすることができます。

  3. Web ブラウザーでサイト コレクションを開きます。

  4. Web パーツを含むページに移動します。

  5. [サイトの操作] をクリックし、[ページの編集] をクリックします。

  6. 任意の Web パーツ領域で [Web パーツの追加] をクリックします。

  7. [コンテンツ エディター Web パーツ] の横にあるチェック ボックスをオンにします。

  8. [追加] をクリックします。

  9. 新しく作成したコンテンツ エディター Web パーツで、[編集] をクリックし、[共有 Web パーツの変更] をクリックします。

  10. [ソース エディター] ボタンをクリックします。

  11. 以下を貼り付けます。

  12. [保存] をクリックします。

  13. [OK] をクリックします。

  14. [編集モードの終了] をクリックします。

名前、スキル、およびマネージャーを一覧表示するシンプルな Silverlight コントロールがページ上に表示されます。

Silverlight list

その他のリソース

SharePoint Online を拡張するさまざまな方法についての PDC セッション (Silverlight デモを含む)
https://channel9.msdn.com/pdc2008/BB53/ (英語)

Silverlight Web サイト
https://www.microsoft.com/japan/silverlight/