WebView2コントロールの基本的な操作

ここではWebView2コントロールの基本的な操作方法について解説します。

操作を行うための前準備については以下を参考にしてください。

Webページの表示

URLを指定してWebページを表示するにはnavigateメソッドを使用します。

ただし、navigateメソッドはページの読み込み完了を待ちませんので、 後述する読み込み完了待ちの処理をいれないと、読み込み途中のまま次の処理が行われてしまいます。

実装方法

指定したURLをWebView2コントロールで表示します。
WebView2.CoreWebView2.Navigate("WebページのURL")

サンプル

						WebView2.CoreWebView2.Navigate("https://web.biz-prog.net/") '開きたいURL
					
						webView2.CoreWebView2.Navigate("https://web.biz-prog.net/"); //開きたいURL
					

読み込み待ち

navigateメソッドでWebページを表示したり、リンクのクリックを行ったり、Submitを行った直後は、
ページの読み込み途中なので続けて処理を行うとエラーになります。
ページの読み込みが終わるまで待機する処理が必要です。

WebViewでは読み込みが完了するとNavigationCompletedイベントが発生しますので、
NavigationCompletedイベントが発生するまで処理を待機してやります。

実装方法

こちらを参考にしてください。


戻る/進む

閲覧履歴の「戻る」「進む」を行います。
これら操作でもページの読み込みが発生しますので、メソッド実行後に、読み込み完了を待つ処理が必要です。(上記参照)

実装方法

サンプル

						'戻る
						If WebView2.CanGoBack Then
							WebView2.GoBack()
						End If
				
						'進む
						If WebView2.CanGoForward Then
							WebView2.GoForward()
						End If
					
						//戻る
						if (webView2.CanGoBack)
						{
							webView2.GoBack();
						}
			
						//進む
						if (webView2.CanGoForward)
						{
							webView2.GoForward();
						}
					

中止/リロード

読み込みを中止したり、サイトのリロード(再読み込み)が行えます。
リロードを行った場合はサイトの読み込みが発生しますので、メソッド実行後には読み込み完了を待つ処理が必要です。

実装方法

サンプル

						'読み込み中止。どちらかを使います。
						WebView2.Stop()
						WebView2.CoreWebView2.Stop()

						'再読み込み。どちらかを使います。
						WebView2.Reload()
						WebView2.CoreWebView2.Reload()
					
						//読み込み中止。どちらかを使います。
						webView2.Stop();
						webView2.CoreWebView2.Stop();

						//再読み込み。どちらかを使います。
						webView2.Reload();
						webView2.CoreWebView2.Reload();
					

タイトル/URLの取得

現在表示しているサイトのタイトルとURLを取得します。

実装方法

サンプル

						MsgBox(WebView2.CoreWebView2.DocumentTitle)   	'タイトルを表示する
						MsgBox(WebView2.CoreWebView2.Source)  			'URLを表示する
					
						MessageBox.Show(webView2.CoreWebView2.DocumentTitle);   //タイトルを表示する
						MessageBox.Show(webView2.CoreWebView2.Source);  		//URLを表示する
					

Zoomの取得・設定

現在表示しているページのZoomを取得・設定する方法です。

実装方法

ZoomFactorプロパティにて取得と設定が行えます。
値はdouble型です。

サンプル

						Private Sub btnGetZoom_Click(sender As Object, e As EventArgs) Handles btnGetZoom.Click

							WebView2.CoreWebView2.Navigate("https://web.biz-prog.net/")
							Dim zoom As Double = WebView2.ZoomFactor    'Zoomの取得
							MessageBox.Show(zoom.ToString())
							WebView2.ZoomFactor = 0.5  'Zoomの設定
					
						End Sub	
					
						private void btnGetZoom_Click(object sender, EventArgs e)
						{
							webView2.CoreWebView2.Navigate("https://web.biz-prog.net/");
							double zoom = webView2.ZoomFactor;  //Zoomの取得
							MessageBox.Show(zoom.ToString());
							webView2.ZoomFactor = 0.5;  //Zoomの設定
						}
					

参考

WebView2.ZoomFactor Property

htmlの取得

現在表示しているページのhtmlを取得します。

実装方法

ExecuteScriptAsyncとJavaScriptのコードを使ってhtmlを取得します。
取得した文字列に対して、文字コードの変更と、文頭・文末の余計な文字を除去します。

サンプル

						Dim html = Await WebView2.ExecuteScriptAsync("document.documentElement.outerHTML")
						html = Regex.Unescape(html)
						html = html.Remove(0, 1)
						html = html.Remove(html.Length - 1, 1)
					
						var html = await webView2.ExecuteScriptAsync("document.documentElement.outerHTML");
						html = Regex.Unescape(html);
						html = html.Remove(0, 1);
						html = html.Remove(html.Length - 1, 1);