WPF 애플리케이션에서 WebView2 사용하기: 기초 사용법과 문제 해결

들어가며

WPF(Windows Presentation Foundation)는 마이크로소프트에서 개발한 사용자 인터페이스 프레임워크로, 복잡한 사용자 인터페이스를 구축할 때 주로 사용됩니다. 최근 웹 콘텐츠를 데스크톱 애플리케이션에 통합하는 요구가 증가하면서, WebView2 컨트롤이 WPF 개발자들 사이에서 주목받고 있습니다. 이 글에서는 WPF 애플리케이션에 WebView2를 도입하는 기초 사용법과, 패키지 검색이나 설치 중 발생할 수 있는 문제들에 대한 해결 방안을 제공합니다.

WebView2 기초 사용법

1. Visual Studio를 열고 새 WPF 프로젝트를 생성합니다.
2. Microsoft.Web.WebView2 NuGet 패키지를 프로젝트에 추가합니다. 솔루션 탐색기에서 프로젝트를 마우스 오른쪽 버튼으로 클릭 > NuGet 패키지 관리 선택 > 찾아보기 탭에서 Microsoft.Web.WebView2 검색 후 설치합니다.
3. MainWindow.xaml에 WebView2 컨트롤을 추가합니다:
   

   <Window ...
           xmlns:wv2="clr-namespace:Microsoft.Web.WebView2.Wpf;assembly=Microsoft.Web.WebView2.Wpf">
       <Grid>
           <wv2:WebView2 x:Name="webView" Source="https://www.example.com"/>
       </Grid>
   </Window>​

4. MainWindow.xaml.cs 에 WebView2 초기화 코드를 추가합니다:
   

   public partial class MainWindow : Window
   {
       public MainWindow()
       {
           InitializeComponent();
           InitializeAsync();
       }
   
       private async void InitializeAsync()
       {
           await webView.EnsureCoreWebView2Async(null);
       }
   }​

5. 프로젝트를 빌드하고 실행하여 웹 콘텐츠가 WPF 애플리케이션 내에 성공적으로 로드되는지 확인합니다.

 

문제와 대처 방안

내가 겪은 문제는 NuGet 패키지 검색 실패였습니다. 비주얼 스튜디오 세팅이 잘못되어 있었기 때문인데, 이는 생각보다 흔히 발생할 수 있는 문제입니다. 만약 여러분도 패키지 검색이 안된다면, 다음과 같은 해결책을 시도해보세요.

• 문제 1: NuGet 패키지 검색 실패
  • 원인: NuGet 패키지 소스 설정 오류 또는 인터넷 연결 문제.
  • 해결책:
    1. 도구 > 옵션 > NuGet 패키지 관리자 > 패키지 소스로 이동합니다.
    2. 확인해보니, nuget.org 소스가 없거나 비활성화되어 있었습니다. + 버튼을 클릭하여 새 소스를 추가합니다.
    3. 이름 필드에 nuget.org를 입력하고, 소스 URL 필드에는 https://api.nuget.org/v3/index.json을 입력한 후 업데이트 버튼을 클릭합니다. 이렇게 하면 대부분의 패키지 검색 문제가 해결됩니다.
    4. 만약 이 방법으로 해결되지 않는다면, 인터넷 연결을 확인하고, 모든 NuGet 캐시 지우기 옵션을 사용해보세요. 도구 > 옵션 > NuGet 패키지 관리자 > 일반에서 찾을 수 있습니다.

만약 위의 단계를 따라 해도 문제가 해결되지 않는다면, Visual Studio의 재설치를 고려해볼 수도 있습니다. 하지만 대부분의 경우, 패키지 소스를 올바르게 설정하고 캐시를 클리어하는 것만으로도 문제를 해결할 수 있습니다.

이러한 문제에 직면했을 때 해결책을 찾는 것이 어렵게 느껴질 수 있지만, 단계별로 접근한다면 충분히 해결 가능합니다. 개발 과정에서 이러한 문제에 부딪히는 것은 매우 일반적인 일이며, 이를 해결하는 과정에서 많은 것을 배울 수 있습니다.