[.Net] C#에서 CefSharp으로 크롬 브라우저 사용하는 방법 (예제 포함)

CefSharp이란?

CefSharp 로고

CefSharp은 Google Chrome의 오픈 소스 버전인 Chrominum Embedded Framework(CEF)를 기반으로 한 브라우저 컨트롤(browser control)입니다. CefSharp을 사용한다는 것은 C# 또는 VB.NET에서 모든 기능의 표준이 호환되는 웹 브라우저를 사용하는 가장 쉬운 방법이기도 합니다.

또한 CefSharp는 최신 웹 표준을 수용하고 HTML5, JavaScript, CSS3 및 HTML 5 오디오 및 비디오 요소를 지원합니다. 3D 콘텐츠는 하드웨어 가속 렌더링을 위해 OpenGL/DirectX를 사용하는 WebGL을 통해 지원됩니다. 또한 PDF를 위한 임베디드 모듈도 포함되어 있습니다.

이러한 CefSharp은 전체 소스 코드를 C#과 C++/CLI로 제공합니다. 라이선스는 BSD이며, 이는 무료로 사용이 가능하다는 것이죠.

CefSharp에 대한 소개와 기능에 대해 자세한 내용은 홈페이지를 참고하시면 되겠습니다.

https://cefsharp.github.io/

CefSharp - Fast web browser for WinForms and WPF Apps

 

CefSharp과 WebBrowser Control의 차이점

C# WebBrowser Control을 사용한 Naver 메인 화면

그런데 C# WinForm에는 이미 WebBrowser라는 컨트롤이 있습니다. 그러면 굳이 CefSharp을 사용해야 하는 이유가 무엇일까요? 그 이유는, WebBrowser 컨트롤은 IE7(Internet Explorer 7)을 사용한다는 것이죠. 물론, 레지스트리 변경으로 IE11로 버전을 변경할 수 있습니다(이에 대한 내용은 아래 Stack overflow 링크를 참고하세요.).

https://stackoverflow.com/questions/17922308/use-latest-version-of-internet-explorer-in-the-webbrowser-control

Use latest version of Internet Explorer in the webbrowser control

IE라고 해서 문제점이 가득한 것은 아니지만, 얼마 전 티스토리 OpenAPI로 개발하던 중 어느 날부터 스크립트 오류가 계속 발생하는 경험이 있었습니다. 전날까진 문제가 없었는데 다음 날부터 계속 오류가 발생하더군요. 웹 개발에 대한 경험이 없던 터라, 스크립트 오류에 대해 찾아보니 IE에 대한 내용이 수두룩하게 나오더군요. 도저히 해결이 되지 않아 카카오에 문의해보니 티스토리는 IE 브라우저 사용을 권장하지 않고, 크롬 또는 파이어폭스 브라우저 등에서 이용을 하라는 답변을 받았습니다.

결국 CefSharp으로 브라우저 컨트롤만 변경했는데 아주 쉽게 해결됐습니다. 정리하면, C# WebBrowser 컨트롤은 IE 기반이고, CefSharp은 Chrominum 기반이라는 차이점이 있습니다.

C#에서 CefSharp 사용을 위한 준비 단계

Visual Studio에서 ExamCefSharp라는 이름의 C# WinForm 프로젝트를 생성합니다.

WinForm 프로젝트 생성

NuGet에서 CefSharp을 검색하면 많은 검색 결과가 표시됩니다. 그 중 CefSharp.WinForms를 선택하고, 프로젝트에 설치합니다.

NuGet CefSharp.WinForms 설치하기

설치가 완료되면, 아래와 같이 참조에 CefSharp 관련 dll이 추가됩니다.

CefSharp 참조 dll 목록

 

 

C#에서 CefSharp 사용하기

CefSharp을 설치해도 도구상자에 CefSharp 컨트롤이 추가되지 않습니다. 혹시나 dll을 추가하면 컨트롤이 생길까 싶었으나 추가가 되지 않더군요. 그래서 본문에서는 코드에서 직접 객체 생성 후 접근하는 방법으로 설명합니다.

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows.Forms;
using CefSharp;
using CefSharp.WinForms;

namespace ExamCefSharp
{
    public partial class Form1 : Form
    {
        private ChromiumWebBrowser _chrome = null;
        public Form1()
        {
            InitializeComponent();

            InitializeCefSharp();
        }

        private void InitializeCefSharp()
        {
            //쿠키 데이터 사용하는 방법
            CefSettings settings = new CefSettings();
            settings.CachePath = Environment.GetFolderPath(Environment.SpecialFolder.LocalApplicationData) + @"\CEF";
            Cef.Initialize(settings);
            
            //웹 사이트 이동
            _chrome = new ChromiumWebBrowser("https://naver.com");
            //한국어 설정
            _chrome.BrowserSettings.AcceptLanguageList = "ko-KR";
            //Main Form에 CefSharp컨트롤 추가
            this.Controls.Add(_chrome);
            //Main Form 전체 영역에 붙이기
            _chrome.Dock = DockStyle.Fill;
            //페이지 로딩 완료 이벤트
            _chrome.LoadingStateChanged += OnLoadingStateChanged;
        }

        private void OnLoadingStateChanged(object sender, LoadingStateChangedEventArgs args)
        {
            if (!args.IsLoading)
            {
                MessageBox.Show("페이지 로딩 완료!");
            }
        }
    }
}

전체 코드를 추가했습니다. 코드 사용이 아주 간단하죠?

쿠키 정보가 필요하다면 28~30번 째 라인의 코드를 추가해야 합니다.

그리고 페이지 로딩 완료 이벤트가 필요하다면, 41번 째 라인의 LoadingStateChanged 이벤트를 등록하면 됩니다. 위 코드를 동작한 결과는 아래와 같습니다.

CefSharp Control을 사용한 Naver 메인 화면

C# WebBrowser Control을 사용한 결과와 동일합니다. 사용법도 쉬우니 IE가 맘에 들지 않다면 CefSharp을 사용하는 것도 좋은 방법입니다.

첨부된 예제 코드에는 CefSharp Package 용량이 큰 관계로 포함되어 있지 않습니다. 따로 NuGet 패키지를 설치하시면 바로 사용 가능합니다.

ExamCefSharp.zip

0.01MB