VC# で MSHTML (.NET Framework 2.0 の場合)

☆

ちょっと思うところがあって、IEコンポーネントを使って WYSIWYG エディタを作る方法を探していたところ、Web 上をさまよっているうちに「Visual C# .NET による MSDNAA おもしろプログラミング : 第 2 回 VC# で MSHTML」というWebページにたどり着きました。

で、早速、ここに書いてある通りに Visual Studio を操作して例題を動かそうとしてみました。が、どこかが違う。掲載されているスクリーンショットと実際の Visual Studio の画面も違うし、だいたい

Web ブラウザコントロールをツールボックスに追加するためには、まずツールボックスを右クリックし、【ツールボックスのカスタマイズ】 を選択します。

Visual C# .NET による MSDNAA おもしろプログラミング : 第 2 回 VC# で MSHTML

こんな操作、どうやってやるの? どうも Visual Studio のバージョンが違うようです。Visual Studio.NET 2003 の頃の解説記事なのかな? Visual Studio 2005 ではどういう操作に置き換わっているのか、推定しつつ、アプリケーションの画面デザインは完成(ただし、Explorer コントロールなんて見当たらないので、代わりに WebBrowser コントロールを使用)。コードをコピーしてきて貼り付け。コンパイルすると以下の箇所でエラー。

            mshtml.HTMLDocument myDocument =
             (mshtml.HTMLDocument)axWebBrowser1.Document; // ドキュメントオブジェクトの取得

Visual C# .NET による MSDNAA おもしろプログラミング : 第 2 回 VC# で MSHTML

いろいろ試行錯誤した挙句、上記のコードは .NET Framework 1.1 を使うことが前提になっていて、.NET Framework 2.0 ではそのまま使えないことが判明。mshtml.HTMLDocument の代わりに System.Windows.Forms.HtmlDocument もしくは mshtml.IHTMLDocument2 を使わないといけないんですね。

結局、件の例題を Visual Studio 2005 + .NET Framework 2.0 で書くには、以下のような手順で作業を行なえばいいことになります。

作業手順

1. プロジェクトの作成
   「新しいプロジェクトの作成」画面で、
   • 「プロジェクトの種類」は C# を選択
   • 「テンプレート」は Windowsアプリケーション を選択
   • 「プロジェクト名」は 自分の好きな名前を適当に入力
2. 参照設定の追加
   「プロジェクト(P)」-「参照の追加(R)」で「参照の追加」ダイアログを開き、「.NET」タブの Microsoft.shtml コンポーネントを選択
   
   (上の画像をクリックすると、さらに大きな画像を表示します)
3. 画面(Form)のデザイン
   以下の図のようにコントロールを貼り付け
   
   (上の画像をクリックすると、さらに大きな画像を表示します)
4. プロパティの設定
   • textBox1 - 「デザイン」の「(Name)」を txtURL に設定
   • button1 - 「デザイン」の「(Name)」を btnMove に、「表示」の「Text」 を 移動 に設定
   • button2 - 「デザイン」の「(Name)」を btnBack に、「表示」の「Text」 を 戻る に設定
   • button3 - 「デザイン」の「(Name)」を btnForward に、「表示」の「Text」 を 進む に設定
   • toolStripMenuItem1 - 「デザイン」の「(Name)」を toolStripMenuItem1 に、「表示」の「Text」 を ブラウザ に設定
   • 3つのメニューを上から順に、
     • 「デザイン」の「(Name)」を mnuBrowserHome に、「表示」の「Text」 を ホームページへ移動 に設定
     • 「デザイン」の「(Name)」を mnuBrowserSearch に、「表示」の「Text」 を 検索エンジンへ移動 に設定
     • 「デザイン」の「(Name)」を mnuBrowserEdit に、「表示」の「Text」 を HTML 編集 に設定
   • webBrowser コントロール - 「デザイン」の「(Name)」を axWebBrowser1 に設定
5. イベントハンドラの追加
   
   • 「移動」ボタンをダブルクリック
   • 「戻る」ボタンをダブルクリック
   • 「進む」ボタンをダブルクリック
   • 「ホームページへ移動」メニューをダブルクリック
   • 「検索エンジンへ移動」メニューをダブルクリック
   • 「HTML 編集」メニューをダブルクリック
   • webBrowser コントロールの「プロパティ」-「イベント」の「動作」の DocumentCompleted に axWebBrowser1_NavigateComplete2 を設定
6. ソースコードの編集
   以下のようなコード(色が付いている部分)を追加します

           private void btnMove_Click(object sender, EventArgs e)
           {
               axWebBrowser1.Navigate(txtURL.Text); // 移動
           }
   
           private void btnBack_Click(object sender, EventArgs e)
           {
               try
               {
                   axWebBrowser1.GoBack(); // 戻る
               }
               catch (Exception ee)
               {
                   MessageBox.Show("これ以上は戻れません"); // エラーメッセージ
               }
           }
   
           private void btnForward_Click(object sender, EventArgs e)
           {
               try
               {
                   axWebBrowser1.GoForward(); // 進む
               }
               catch (Exception ee)
               {
                   MessageBox.Show("これ以上は進めません"); // エラーメッセージ
               }
           }
   
           private void mnuBrowserHome_Click(object sender, EventArgs e)
           {
               axWebBrowser1.GoHome(); // ホームページへジャンプ
           }
   
           private void mnuBrowserSearch_Click(object sender, EventArgs e)
           {
               axWebBrowser1.GoSearch(); // 検索エンジンへジャンプ
           }
   
           private void mnuBrowserEdit_Click(object sender, EventArgs e)
           {
               mshtml.IHTMLDocument2 myDocument = (mshtml.IHTMLDocument2)axWebBrowser1.Document.DomDocument;
               myDocument.designMode = "On"; // 編集モード開始
           }
   
           private void axWebBrowser1_NavigateComplete2(object sender, WebBrowserDocumentCompletedEventArgs e)
           {
               System.Windows.Forms.HtmlDocument myDocument = axWebBrowser1.Document; // ドキュメントオブジェクトの取得
               this.Text = myDocument.Title; // タイトルの表示
   
               string s = myDocument.Url.ToString();
               if (txtURL.Text != s)
                   txtURL.Text = s;
           }
   

   最後の方、string s = myDocument.Url.ToString(); から始まる3行は、私が独自に行なった追加です。

あとは、ビルドするだけ。

.NET Framework 2.0 では System.Windows.Forms.HtmlDocument が使えるようになり、IEコンポーネントを利用したブラウザ(や IE を遠隔操作するアプリケーション)は格段に作りやすくなっています。ただ、System.Windows.Forms.HtmlDocument は designMode の切り替えがないので、今見ている Webページをビジュアルに編集するには mshtml.IHTMLDocument2 を使うことになります。昔ながらの IHTMLDocument2 なので、Web を探し回ればノウハウはかなり蓄積されています。.NET Framework 2.0 や 3.0 の時代になっても IHTMLDocument2 なのか、という嘆きが聞こえてきそうですが(笑)

という感じで、.NET Framework 2.0 (や 3.0) で IEコンポーネントを使う場合は、この例題が基本になると思いますので、一度は実際に自分の手で作ってみるといいと思います。

上記で作成したアプリケーションを実際に動かしてみたところ

参考

「Visual C# .NET による MSDNAA おもしろプログラミング : 第 2 回 VC# で MSHTML」にたどり着く前にさまよったのは、以下のようなWebページです。何かの参考になるかも。

• IEコンポーネントの使い方 [VC++の使い方]
• InternetExplorerをCOMを使って操作する
• IEを探し出してIHTMLDocument2を取得する (UsefullCode.net)
• IEコンポーネントによるHTMLパーサ｜あるプログラマのつぶやき