Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
Help us understand the problem. What is going on with this article?

WebView2 で Web サイトを表示する。

※本投稿は、https://qiita.com/noura_chirashi/items/e8fdc3653a7a953d8eb2 (WebView2 を使って Web サイトを表示し、C# と JavaScript が相互に呼び出す) に続きます。


本投稿の手順は以下

https://developer.microsoft.com/ja-jp/microsoft-edge/webview2/
 の、右下の修正済みバージョン (2021/2/7現在の最新は 88.0.705.63 ) をDLして解凍する。

② [①]でDLしたファイルを解凍して、フォルダごと好きな場所に解凍する。
 ※ソースコード内でパスを指定するので、exe ファイルと同じ場所とか、好きな場所。
 今回は、以下のよう(プロジェクトフォルダの直下)にしました。
a.png

③プロジェクトの csproj ファイルの ItemGroup に、下記サイトの PackageReference を登録する。
 https://www.nuget.org/packages/Microsoft.Web.WebView2/

<Project Sdk="Microsoft.NET.Sdk">

  <PropertyGroup>
    <OutputType>WinExe</OutputType>
    <TargetFramework>net5.0-windows</TargetFramework>
    <UseWindowsForms>true</UseWindowsForms>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="Microsoft.Web.WebView2" Version="1.0.705.50" />
  </ItemGroup>

</Project>

④実際のソースコードは下記(出来るだけ短めにしました。)
 WebView2 コントロールをフォームに Add して、URL を開く場合は Navigate メソッドを、HTMLソースコードをレンダリングする場合は NavigateToString メソッドを使用する。

using System.IO;
using System.Windows.Forms;
using Microsoft.Web.WebView2.Core;
using Microsoft.Web.WebView2.WinForms;

namespace Test
{
    public class Form1 : Form
    {
        private WebView2 view2;
        private string WebView2Path = Path.Combine(Directory.GetCurrentDirectory(), "Microsoft.WebView2.FixedVersionRuntime.88.0.705.62.x64");

        public Form1()
        {
            view2 = new WebView2();
            view2.Dock = DockStyle.Fill;
            Controls.Add(view2);
            Navigate("https://www.google.com");
        }

        private async void Navigate(string url)
        {
            await view2.EnsureCoreWebView2Async(CoreWebView2Environment.CreateAsync(WebView2Path).Result);
            view2.CoreWebView2.Navigate(url);
        }

        private async void NavigateToString(string source)
        {
            await view2.EnsureCoreWebView2Async(CoreWebView2Environment.CreateAsync(WebView2Path).Result);
            view2.NavigateToString(source);
        }
    }
}

⑤Navigate("https://www.google.com"); の実行結果
2.png

※もし、以下のエラーが出たら、ソースコード内で指定した場所に WebView2 ランタイムがないという事なので、指定したパスに間違いがないか要確認。
111.png

noura_chirashi
名は体を表す
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away