Building an chromium-based application

Source: Internet
Author: User

Chromium is the core of the Google Chrome browser, the first from Apple's WebKit development, because webkit differences in development, and Google wants to have greater freedom in the developer, 2013 Google decided to develop its own branch of WebCore, called the Blink engine, and then Google to the BSD Berkeley Licensing Open source, BSD licensing restrictions more lenient, many browsers are based on chromium development, for example, after the omission of 100 words. Google has made further streamlined optimizations on its original basis and developed the V8 JavaScript engine, which in 2010 acquired WEBRTC technology and then opened the source code, WEBRTC with PV encoding, compatible with HTML5 standards, In the same year, Google introduced Chrome OS cloud operating system, browser derivative products.

Not much nonsense to say, retrieve the chromium Embedded Framework, called CEF, you can see the current chromium the latest release of the Cefbuilds, you can also download on Google Code, It includes the browser's core library and the underlying API, support for C and C + + programming languages, and third-party include. Net/mono, Java, Python, Delphi and other open source projects.

We downloaded the Win32 C + + library from Google Code and opened the release folder.

Here is a description:

LIBCEF.DLL:CEF Core Library.

Icudt.dll: Encoded format Library.

D3dcompiler_43.dll, D3dcompiler_46.dll, LibEGL.dll, LibGLESv2.dll

These are the 3d graphics libraries, D3dcompiler_43.dll applies to xp,d3dcompiler_46 for versions above XP.

The Include folder is the CEF C + + header file that you can go to github to download. NET called Project, called Cefsharp, which provides a complete demo of WinForm and WPF.

Cefsharp: Encapsulation is the portal and data acceptance class for the C # call API.

Cefsharp.browsersubprocess: A companion process written by. NET that is primarily responsible for working with JavaScript and multitasking.

CefSharp.BrowserSubprocess.Core: is a C + + project that needs to refer to the CEF C + + header file, mainly JavaScript related operations.

Cefsharp.core: Also a C + + project, including the initial configuration of CEF, accepting events, and so on.

Cefsharp.example:c# invokes the init configuration of CEF.

CefSharp.WinForm.Example: wrote a custom control as a window for the Cef browser.

ChromimumWebBrowser.cs the implementation of all interfaces can be placed here, see Cefsharp Demo.

1  Public class Chromiumwebbrowser:control, iwebbrowserinternal, Iwinformswebbrowser 2 {3    ... 4 }

Add a custom control Browserusercontrol. Customize a constructor.

1  PublicBrowserusercontrol (stringURL)2 {3 InitializeComponent ();4 5     varBrowser =Newchromiumwebbrowser (URL)6     {7Dock =DockStyle.Fill8     };9      This. Controls.Add (browser);Ten}

Create a Form1 startup window to add the created user control.

1  PublicForm1 ()2 {3 InitializeComponent ();4 5     varBrowser =NewBrowserusercontrol (Cefexample.defaulturl)6     {7Dock =DockStyle.Fill,8     };9 Browser. CreateControl ();Ten      This. Controls.Add (browser); One}

Take a look at the Main method entry in Program.cs, and Cefexample calls an Init initialization method.

1 /// <summary>2 ///The main entry point for the application.3 /// </summary>4 [STAThread]5 Static voidMain ()6 {7 cefexample.init ();8 9 application.enablevisualstyles ();TenApplication.setcompatibletextrenderingdefault (false); OneApplication.Run (NewForm1 ()); A}

In the Cefsharp.example project, Defaulturl is the default home page URL address.

1  Public Static classCefexample2 {3      Public Const stringDefaulturl ="";4     Private Static ReadOnly BOOLDebuggingsubprocess =debugger.isattached;5 6      Public Static voidInit ()7     {8         varSettings =Newcefsettings ();9Settings. Remotedebuggingport =8088;TenSettings. Cefcommandlineargs.add ("Enable-media-stream","Enable-media-stream"); OneSettings. Ignorecertificateerrors =true; ASettings. LogSeverity =Logseverity.verbose; -  -         if(debuggingsubprocess) the         { -             //var architecture = environment.is64bitprocess? "x64": "x86"; -             //settings. Browsersubprocesspath = ". \\.. \\.. \\.. \\CefSharp.BrowserSubprocess\\bin\\ "+ architecture +" \\Debug\\CefSharp.BrowserSubprocess.exe "; -         } +  -Settings. Registerscheme (NewCefcustomscheme +         { ASchemename =Cefsharpschemehandlerfactory.schemename, atSchemehandlerfactory =Newcefsharpschemehandlerfactory () -         }); -  -         if(!cef.initialize (settings)) -         { -             if(Environment.getcommandlineargs (). Contains ("--type=renderer")) in             { -Environment.exit (0); to             } +             Else -             { the                 return; *             } $         }Panax Notoginseng     } -}

Let's put in a release version, which probably has these files. Locales inside the localization resource pack, including cef_100_percent/cef_200_percent, if deleted, will appear such as window scroll bar appearance exception, Degug.log will record the operation record.

Run it and open a webpage.

Let's write another HTML page.

1 <!DOCTYPE HTML>2 3 <HTML>4 <Head>5     <Metahttp-equiv= "Content-type"content= "text/html; charset=utf-8">6     <MetaID= "Viewport"name= "Viewport"content= "Width=device-width, initial-scale=1">7     <title></title>8 </Head>9 <Body>Ten     <VideoAutoPlay></Video> One     <Script> A         'Use Strict'; -  -         varVideo=Document.queryselector ('Video'); the         varConstraints= { - Audio:false, - Video:true -         }; +  - Navigator.getusermedia=Navigator.getusermedia||Navigator.webkitgetusermedia|| + Navigator.mozgetusermedia; A  at         functionSuccesscallback (stream) { -; -             if(window. URL) { - video.src=window. Url.createobjecturl (stream); -             } Else { - video.src=stream; in             } -         } to  +         functionErrorcallback (Error) { - Console.log ('Navigator.getusermedia Error:', error); the         } *  $ navigator.getusermedia (Constraints, Successcallback, errorcallback);Panax Notoginseng     </Script> - </Body> the </HTML>

Modify Cefexample's defaulturl to point to this page.

One thing to note is that the Enable-media-stream parameter is added to Cefcommandlineargs, which means to turn on Chrome's media stream. Look at the effect.

Here we use the HTML5 WEBRTC technology based on the chromium kernel, and the page opens the camera.

Here is a rough list of a small demo, as well as some basic mouse events, page redirection and other functions, in addition to chromium very functional API is worth learning and digging.

Building an chromium-based application

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.