Tips というより開発時に調べた Script 等を忘れないように書き留めた覚え書きです。
最近はここに書き留めておくことも忘れている始末で、我ながら情けなく思う今日この頃です。
ということで、不定期更新というか最近更新していませんが、JavaScript や VBScript などを紹介していきますのでご参考になれば幸いです。

WebView2 コントロールを使ってみる1

2022年6月16日ついに Internet Explorer のサポートが終了しましたね
InternetExplorer(Tridentエンジン)がベースのWebBrowserコントロールは早くても2029年までは使用できますのでしばらくは問題ないと思いますが、最近のWebページではデザインが崩れたり、JavaScriptがエラーになることがあるのが困りものですよね

そこで遅まきながら Edgeブラウザ(Chromium)がベースの WebView2 コントロールを使ってみた時の備忘録です

記載日:2022年 7月 4日

VisualStudio で WebView2 コントロールを使えるようにする

環境

  • Windows10 1803(ビルド17110)以降
  • WebView2ランタイム または Microsoft Edge (Chromium) カナリアチャネル
  • VisualStudio 2017以降
  • .NET Framework 4.6.2以降

VisualStudio の設定

  1. ターゲットフレームワークの設定
    .NET Frameworkが4.6.2以降に設定する
    ターゲットフレームワークの設定
  2. [ツール] → [NuGet パッケージ マネージャー(N)] → [ソリューションの NuGet パッケージの管理(N)...] を開く
    ソリューションの NuGet パッケージの管理
  3. 「参照」を選択し検索欄に「WebView2」を入力すると「Microsoft.Web.WebView2」がヒットしますのでインストールします ※注1)見つからない場合
    Microsoft.Web.WebView2のインストール
  4. ツールボックスにWebView2が現れます
    現れない場合は VisualStudio を再起動してみてください
    ツールボックス
  5. フォームに貼り付けるだけでは使用できません
    フォームに貼り付け
    実行しても表示されません ※注2)ビルドエラーになる場合
    実行しても表示されません
  6. WebView2 を初期化する必要があります
    また、初期化の完了を待たないで webView2.CoreWebView2 にアクセスすると NullReferenceException が発生する場合がありますので、フォームロード時に初期化しています
    Imports Microsoft.Web.WebView2.Core
    Public Class Form1
      Private Sub Form1_Load(sender As Object, e As EventArgs) Handles MyBase.Load
        InitializeAsync()
      End Sub
    
      Private Async Sub InitializeAsync()
        Await WebView21.EnsureCoreWebView2Async(Nothing)
      End Sub
    End Class
    WebView2 を初期化して実行すると表示されます
    実行すると表示されます

注1)WebView2ランタイムのインストール

「ソリューションの NuGet パッケージの管理」で「Microsoft.Web.WebView2」が見つからない場合はインストールする必要があります
Visual Studio 2022 ではインストールされていましたが、それ以前のバージョンの場合は別途インストールする必要があるようです
WebView2 ランタイムのダウンロードページから WebView2 ランタイムの「Evergreen Bootstrapper」をインストールしてください
WebView2 ランタイムのダウンロードページ

注2)パッケージ管理方法の変更

Visual Studio 2017 でNuGetを使う場合、パッケージ管理方法が packages.config だとビルドした時にエラーになります
(Visual Studio 2022 では packages.config のままでエラーになりませんでした)

  1. [ツール] → [NuGet パッケージ マネージャー(N)] → [パッケージ マネージャー設定(P)]を開く
    パッケージ マネージャー設定
  2. 「パッケージの管理」の「既定のパッケージ管理形式」を「PackageReference」にします
    既定のパッケージ管理形式

ページの先頭へ