Silverlight から HTML5 の WebStorage を使う方法

はじめに

Silverlight の不満の１つに、「クライアントデータベースが無いこと」がある。Silverlight には System.Data が無いので、SQLite *1 や SQL Server CE は使えない。

また、Microsoft は Silverlight のランタイムのサイズを気にしているみたいなので、将来クライアントデータベースが追加されることは期待できそうにない。

そこで閃いた

「Silverlight にクライアント DB が無いなら、HTML5 の WebStorage を使えばいいじゃない。」

やり方は簡単

まず、Silverlight をホストしている HTML ページに、JavaScript で WebStorage を操作する関数を記述する。

var storage = window.localStorage;

function setWebStorage(key, value) {
    if (storage) {
        storage.setItem(key, value);
    }
}

function getWebStorage(key, value) {
    if (storage == null) {
        throw new Error("WebStorage は使えません。");
    }
    return storage.getItem(key);
}

これらの関数を Silverlight の HTML ブリッジを使って呼び出せばいい。

using System.Windows;
using System.Windows.Controls;
using System.Windows.Browser;
namespace WebStorageSample
{
    public partial class MainPage : UserControl
    {
        public MainPage()
        {
            InitializeComponent();
        }

        private void SaveWebStorage(object sender, RoutedEventArgs e)
        {
            HtmlPage.Window.Invoke("setWebStorage", "test_key", this._textBox.Text);
        }

        private void LoadWebStorage(object sender, RoutedEventArgs e)
        {
            this._textBox.Text = HtmlPage.Window.Invoke("getWebStorage", "test_key") as string;
        }
    }
}