使ってみよう! Windows Live SDK/API

第36回Live Messenger Web Toolkit─⁠─WebサイトにLive Messenger機能を追加(4)

アプリケーションコンタクト

Live Messenger Web Toolkitを利用するとLive Messengerと連携したSNSなどのWebサイトも作れます。メンバー管理やメッセージング機能はそのままLive Messengerのものを使用することができそうですね。しかし、通常Live Messengerでは、ふたりが会話をするにはお互いがコンタクトリストに追加している必要があります。また、コンタクトリストへ追加するにはお互いのメールアドレスを相手に知らせなければなりません。

多くのSNSではメールアドレスを知らせずにメッセージのやりとりができ、SNS内のコンタクトリストを作れます。また、SNS内ではLive Messengerの表示名とは異なる名前を使いたい場合もあるかもしれません。PC版のLive Messengerでは実現できませんが、これらを実現する方法がLive Messenger Web Toolkitには用意されています。Live Messenger Web Toolkitを利用した特定のWebサイト内だけで有効なコンタクトリストを作成でき、そのサイト内でお互いがサイト内のコンタクトリストに追加してある状態であれば、メールアドレスを必要とせずにメッセージの送受信やオンライン状態の確認ができるようになります。加えて、メンバーの表示名をWebサイト内のみ変更する方法も用意されています。この特別なコンタクトを、アプリケーションコンタクトと呼んでいます。

アプリケーションコンタクトはUI Controlsとして提供されています。用意されているコントロールは次のふたつです。

  • Application Contactsコントロール
  • Application Contactコントロール

前者のApplication Contactsコントロールは、Webサイト内だけのコンタクトリストを作成するためのものです。後者のApplication Contactコントロールは、表示名や表示アイコンをLive Messengerで設定したものとは異なるものを見せるためのコントロールです。これらのコントロールを使用する以外にもLive Messenger Libraryを利用してアプリケーションコンタクトを定義できます。

Messenger Application Keyの取得

アプリケーションコンタクトを使用するには、規定ではリストを署名する必要があり、Messenger Application Keyと呼ばれる値を取得し、署名に使用します。

Messenger Application Key取得には、Application IDが必要です。Application IDは第34回で紹介したアプリケーションの登録時に得られたものです。

Messenger Application Keyは、次の場所から取得します。URLの {appid} 部分を、取得済みのApplication IDに置き換えてアクセスします。

https://consent.messenger.services.live.com/applicationsettings.aspx?appid=0x{appid}

上記URLのサイトは図1のようになっています。このページでは、Messenger Application Keyの取得または変更ができます。Keyの値は、16〜64文字の文字列です。文字に日本語や <, >, %, ; は使えません。

図1 Messenger Application Keyの設定
図1 Messenger Application Keyの設定

アプリケーションコンタクトの作成

それでは、Webサイト内だけで有効なコンタクトリスト、アプリケーションコンタクトリストを作ってみましょう。

Application Contactsコントロール

アプリケーションコンタクトを有効にするにはApplication Contactsコントロールを使用します(Live Messenger Libraryを使用しても可能です⁠⁠。Application Contactsコントロールにアプリケーションコンタクトリストを設定し、Messenger Application Keyから求まる値を使って署名します。XHTMLに記述するApplication Contactsコントロールのタグは次のようになっています。

<msgr:app-contacts
   contacts="..."
   signature="..."
   on-set-contacts-completed="...">
</msgr:app-contacts>

contacts属性には、アプリケーションコンタクトのリストを設定し、signature属性にはリストの署名のために使用します。on-set-contacts-completed属性にはコントロールによりアプリケーションコンタクトの設定が完了後に呼ばれるJavaScriptの関数を指定します。いずれの属性も必須ではありませんが、少なくともcontacts属性がなければ、コントロールとして意味をなしません。また通常はsignature属性が必要です。それでは、次にこれらの値の作り方をみてみましょう。

アプリケーションコンタクトリスト

アプリケーションコンタクトリストは、アプリケーションコンタクトとなるユーザーのCIDのリストと、作成日時を含めた次のようなXML文書として表します。

<Ticket>
        <Contact id="64801418014"/>
        <Contact id="44801418141"/>
        <Contact id="11447918014"/>
        <Contact id="-35143418014"/>
        <Contact id="-89571418014"/>
        <Contact id="58711418014"/>
        <TS>2010-07-20T12:34:56Z</TS>
</Ticket>

<Ticket>要素の中に、<Contact>と<TS>要素があります。ひとつのアプリケーションコンタクトはひとつの<Contact>要素で表し、id属性にCIDを10進数表記で指定します。CIDはWindows Liveアカウントユーザーを一意に表す値です。CIDについては、第34回で紹介しています。<TS>要素にはリストの作成日時を指定します。

このXML文書の文字列を先ほどのApplication Contactsコントロールのcontacts属性に指定します。指定する際は、属性値として有効になるようエンコードする必要があります。

CIDの配列からアプリケーションコンタクトの属性値を生成するメソッド例を以下に示します。

Public Function CreateApplicationContactList(ByRef cids() As Long) As String        
    Dim contactCids = 
    For Each cid In cids
        contactCids &= String.Format("<contact id="" {0}""="">", cid)
    Next
    Return String.Format("<ticket>{0}<ts>{1}</ts></ticket>", contactCids, DateTime.UtcNow.ToString("o"))
End Function

使用するときは、次のようにメソッドを呼び出します。

' アプリケーションコンタクトリストのメンバー CID
Dim cids() As Long = New Long() {5566738540414425322, _
                                 -6356285628991451204, _
                                 -5771274640885475729}
' アプリケーションコンタクトリスト 
Dim list = CreateApplicationContactList(cids)

アプリケーションコンタクトリストの署名

続いてsignature属性値の生成方法をみてみましょう。値は、Messenger Application Keyを使用してアプリケーションコンタクトリスト(XML文書の文字列)をHMAC-SHA256ハッシュ関数により求めたハッシュ値を、Base64でエンコードした文字列です。

実は、この値を求める方法はWindows Live IDの委任認証などで使用している方法です。同様の計算は第14回にも登場しています。次にsignature値を求めるメソッドを示します。

' Imports System.Security.Cryptography
Public Shared Function CreateSignature(ByVal messengerApplicationKey As String, ByVal applicationContactList As String) As String
    Dim key = Derive(messengerApplicationKey, "SIGNATURE")
    Dim hashAlgorithm = New HMACSHA256(key)
    Dim data = System.Text.Encoding.Default.GetBytes(applicationContactList)
    Return Convert.ToBase64String(hashAlgorithm.ComputeHash(data))
End Function

Public Shared Function Derive(ByVal secretKey As String, ByVal prefix As String) As Byte()
    Dim hashAlgorithm = New SHA256Managed
    Dim buffer = System.Text.Encoding.Default.GetBytes(prefix & secretKey)
    Dim hashOutput = hashAlgorithm.ComputeHash(buffer)

    Dim byteKey(15) As Byte
    Array.Copy(hashOutput, byteKey, byteKey.Length)
    Return byteKey
End Function

使用方法は以下の通りです。

' list: アプリケーションコンタクトリスト
Dim signature = CreateSignature("取得したMessengerApplicationKey", list)

Application Contactsコントロールの動作確認

以上でApplication Contactsコントロール動作に必要な値の生成ができました。実際に使用してアプリケーションコンタクトが有効になるか確認してみましょう。

アプリケーションコンタクトリストのXML文書と、署名は、Application Contactsコントロールの属性に設定する際にはエンコードしておく必要があります。

Dim s = HttpUtility.HtmlAttributeEncode(signature)
Dim l = HttpUtility.HtmlAttributeEncode(list)
Dim tag = String.Format("<msgr:app-contacts contacts="{0}" signature="{1}"></msgr:app-contacts>", l, s)

動作確認には、ふたつのWindows Liveアカウントが必要です。またお互いLive Messengerのコンタクトリストに追加していると動作がわかりませんので、コンタクトリストに対象アカウントがある場合、コンタクトリストから外しておきます。

それぞれのユーザー用に設定したApplication Contactsコントロールを含むXHTMLを提示するようにします。片方のユーザーには相手のCIDを用いてアプリケーションコンタクトリストを作ります。もう片方のユーザーも同様に相手のCIDを用いてアプリケーションコンタクトリストを作ります。

確認にはコンタクトリストの表示と会話が必要ですので、UI ControlsのMessenger Web Barコントロールや、Contact List ControlやConversation ListコントロールをApplication Contactsコントロールと一緒に記述しましょう。

片方のユーザーに提示するXHTMLの<body>内の例を以下に示します。

<body>
<msgr:app
    id="appTag"
    application-verifier-token="<%= ApplicationVerifier %>"
    privacy-url="Privacy.html"
    channel-url="Channel.html"
    token-url="RefreshMessengerToken.aspx"
    onAuthenticated="onAuthenticated"
    onSignedIn="onSignedIn">
</msgr:app>

<msgr:app-contacts
        contacts='&lt;Ticket>&lt;Contact id=&quot;5566738540414425322&quot; 
/>&lt;TS>2010-02-22T22:22:22.0000000Z&lt;/TS>&lt;/Ticket>'
        signature='求めたsignature値'>
</msgr:app-contacts>

<msgr:bar></msgr:bar>
</body>

それでは、ふたつのアカウントでそれぞれページを表示し、サインインします。すると、相手のメールアドレスを知らない状態ですが、お互いのオンライン状態や名前が表示され、会話も可能であることがわかると思います図2⁠。

図2 アプリケーションコンタクトリストの表示
図2 アプリケーションコンタクトリストの表示

サインインした場合、アプリケーションコンタクトリストと元のユーザーのコンタクトリストの両方が表示されます。アプリケーションコンタクトのユーザーは、Webサイトのドメイン名のグループ名で分類されています。

図ではMessenger Web Barコントロールを使用しましたが、Contact Listコントロールを使用した場合、hide-messenger-contacts属性にtrueを指定すると、アプリケーションコンタクトのみの表示も可能です。

確認する目的では各ユーザー用に直接XHTMLを記述して行うこともできますが、実際にSNSのようなサービスを実現するには、サインインしたユーザーに合わせて異なるアプリケーションコンタクトリストを生成し表示する仕組みを作る必要があります。

Application Contactコントロール

もうひとつのアプリケーションコンタクトに関するApplication Contactコントロールも使ってみましょう。このコントロールを使用するとユーザーの表示名や表示アイコンをWebサイト上でのみ異なる名前やアイコンにできます。

XHTMLに記述するタグは次のようになります。

<msgr:app-contact
   cid="-0123456789"
   contact-list-enabled="true"
   display-name="あやの"
   display-picture-url="http://example.jp/images/ayano.png"
   personal-message="頑張ろうよ">
</msgr:app-contact>

cid属性には、表示を変更するユーザーのCIDを指定します。Webサイトを訪れたユーザーにも使えるので$userも指定可能です。display-name、display-picture、persona-message属性にはそれぞれ表示名、表示アイコン、表示メッセージを指定します。

ProfileコントロールとApplication Contactコントロールを組み合わせて動作を確認してみましょう。実行結果を図3に示します。

図3 Application Contactコントロールによる表示の変更
図3 Application Contactコントロールによる表示の変更

実行してみると気付くのではないかと思いますが、表示の変更はユーザーがサインインしていない状態でも有効です。Application Contactコントロールを使用すると、サインインしていない状態の既定の名前変更や、オフラインのメンバーに対して以前の表示名やアイコンを記憶しておき、オンラインになるまで前回状態の表示にも使用できます。

また、Application Contactコントロールは、ひとりのユーザーに対してひとつのコントロールを使用します。変更したいユーザーの数だけApplication Contactコントロールを記述します。


今回は以上です。いかがでしたでしょうか。アプリケーションコンタクトというLive Messenger Web Toolkitだけに用意された機能を紹介しました。アプリケーションコンタクトを使用するとSNSなどのサービス作成も可能であることがわかったのではないでしょうか。次回もLive Messenger Web Toolkitを用いた開発を紹介する予定です。

おすすめ記事

記事・ニュース一覧