ssCAROのブログ

色んなとこで見つけたプログラムのメモ置き場っぽい

Edge仕様のWebBrowserコントロール(WebView)

WebBrowserコントロールを使うとIE仕様になってしまい、サイトによってはJavaScriptが動かなかったりします。
そこで、WebBrowserコントロール(IE)ではなく、WebViewコントロール(Edge)を使用します。

実行環境が決まってるようで、このバージョン以降が必要のようです。

Visual Studio 2017 を起動し、NuGet から次のパッケージをインストールします。
この文字列で検索すると見つかります。
Microsoft.Toolkit.Forms.UI.Controls.WebView」

ツールボックスの「アイテムの選択」から「.NET Framework コンポーネント」タブを開き次のパスのdllを参照から開きます。

C:\Users\<ユーザー名>\.nuget\packages\microsoft.toolkit.forms.ui.controls.webview\5.1.1\lib\net462\Microsoft.Toolkit.Forms.UI.Controls.WebView.dll

あとは、ツールボックスからWebViewコントロールをフォームに張り付けて完成。

フォームを開くとユーザーIDとパスワードが入力されてログインしたいときのサンプルプログラム

Imports Microsoft.Toolkit.Win32.UI.Controls.Interop.WinRT

Public Class frmMain
    Private Sub frmMain_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        WebView1.Navigate("https://www.example.com/login.html")
    End Sub

    Private Sub WebView1_NavigationCompleted(sender As Object, e As WebViewControlNavigationCompletedEventArgs) Handles WebView1.NavigationCompleted

        If WebView1.DocumentTitle = "ログイン画面" Then
            Dim script As New System.Text.StringBuilder

            'ユーザーID uuuuu を入力
            script.AppendLine(String.Format("document.getElementsByName('UserId').item(0).value = '{0}';", "uuuuu"))
            'パスワード ppppp を入力
            script.AppendLine(String.Format("document.getElementsByName('Password').item(0).value = '{0}';", "ppppp"))

            WebView1.InvokeScript("eval", script.ToString())

            'ログインボタンを探してクリック
            script.Clear()
            script.AppendLine("for (i in document.getElementsByTagName('input')) {")
            script.AppendLine("    if (document.getElementsByTagName('input').item(i).value === 'ログイン') {")
            script.AppendLine("        document.getElementsByTagName('input').item(i).click();")
            script.AppendLine("    }")
            script.AppendLine("}")

            WebView1.InvokeScript("eval", script.ToString())
        End If

    End Sub
End Class

WebBrowserコントロールにあったDocumentプロパティが見当たらなくてinputタグにどうやって値を入れるの?と、だいぶ困った。
WebViewコントロールはJavaScriptでhtmlを操作するようだ。

参考URL: WPFやWindowsフォームでEdgeのWebViewを使うには?[Windows 10 1803以降]:.NET TIPS - @IT
参考URL: 【C#】WebBrowserコントロールをEdgeに対応させる | 思い立ったが吉日

さらにメモ
Chromium仕様のブラウザコントロール(CefSharp)もあるみたい。
参考URL: WinFormsでChromiumブラウザコンポーネント(CefSharp)を使ってみる
参考URL: VB.net(WinForms)でのCefsharpの基本的な扱い方について