Windows Dev. Site

WebBrowser WindowsFormでJavaScriptからC#呼び出し

iPhoneやAndroidでは、WebViewを使って、ネイティブの機能をJavaScriptから使うことができたり、ネイティブコードからJavaScriptが実行できます。これと同じことをWindowsでもやってみました。(まだやってませんがWindows Phoneでも同様なのかな)
これは何かと便利で、Titanium Mobileのようにスマホアプリをハイブリッドで開発できるのも、このしくみを利用するからですね。

環境:VisualStudio 2010 / Windows 7

まず、以下のようにブラウザをC#で簡単につくれます。(フォームにツールボックスからWebBrowserをはりつけ)


namespace CSbrowser
{
    [System.Runtime.InteropServices.ComVisibleAttribute(true)]
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();

            webBrowser1.ObjectForScripting = this;
            webBrowser1.Navigate(new Uri("http://localhost/test.html"));
        }
        public void CSfunc1(string value)
        {
            MessageBox.Show(value);
        }
        private void button1_Click(object sender, EventArgs e)
        {
            object[] args = { "arg1" };
            webBrowser1.Document.InvokeScript("JSfunc1", args);
        }
        private void button2_Click(object sender, EventArgs e)
        {
            string js = "alert('Click!')";
            webBrowser1.Url = new Uri("javascript:" + Uri.EscapeDataString(js) + ";");
        }
    }
}

次は、読み込むhtmlファイルです。(test.html)

<html>
<script>
var jsdata1 = 'jsdata1';
function JSfunc1(arg)
{
	alert('JSfunc1! : ' + arg);
}
function clk()
{
	window.external.CSfunc1(jsdata1);
}
</script>
<body>
<br><hr>
<center>
<h3><font color=blue>Test Page for C# WebBrowser.</font></h3>
<hr>
<input type='button' value='btn1' onClick='clk()'>
</center>
</body>
</html>

test.htmlをローカルのWebサーバで読み込めるようにして(XAMPPなど)、C#ソースをビルドしてたちあげると、

WebBrowserForm

このような画面になります。

中央の”btn1″ボタンをクリックすると、C#のCSfunc1()が呼ばれます。また、Windowsフォームの”button1″ボタンを押すと、JavaScriptのJSfunc1()が呼ばれ、”button2″ボタンを押すと、JavaScriptのalert()関数が実行されます。

まだいろいろと応用が考えられそうですね。

«

»