WebView2 LoadFile Demo - Loading Local HTML Files

Overview

Demonstrates how to load HTML files from the local file system via cWebView2Host, perfectly combining desktop applications with rich web frontends.

Project Structure

Download Source [ Note: Re-register the DLL file in the bin directory ]

Source code is available in the VBMAN2 project's demos/webview2/loadFile directory.

loadFile/
  ├── Form1.frm              # Main form, containing local file loading logic
  ├── www/
  │   └── index.html         # Local HTML page (922-line complete landing page)
  ├── vbman2_webview2.vbp    # VB6 project file
  └── vbman2_webview2.vbw    # VB6 workspace file

Core Code Walkthrough

1. Declaration and Initialization (Form1.frm)

Dim wv As New cWebView2Host

Private Sub Form_Load()
    wv.Initialize Me.hWnd, App.Path & "\www"
End Sub

When the second parameter of Initialize is a local folder path, cWebView2Host automatically maps it as WebView2-accessible resources.

2. Local HTML Page (www/index.html)

www/index.html is a complete single-page website featuring:

• SVG logo and branding
• CSS animations and transitions
• IntersectionObserver scroll reveal effects
• Responsive layout
• Complete modern web page effects

This proves that WebView2 can perfectly render complex modern web content.

Feature Description

1. Folder Path Auto-Mapping

   • Pass a local path like App.Path & "\www"
   • Internally auto-maps to http://vbman2.com/index.html
   • Relative paths in pages (CSS, JS, images) are automatically resolved

2. Full Web Capabilities

   • Supports CSS3 animations and transitions
   • Supports ES6+ JavaScript
   • Supports modern APIs like IntersectionObserver
   • Supports SVG vector graphics

3. Zero-Configuration Local Serving

   • No need to start a local HTTP server
   • No configuration files or parameters needed
   • Simply pass the folder path

Technical Notes

1. App.Path: VB6 runtime property that returns the directory where the EXE is located. Using App.Path & "\www" ensures HTML files are found regardless of where the program runs

2. Path Mapping Principle: cWebView2Host uses WebView2's SetVirtualHostNameToFolderMapping API to map folders as virtual host names

3. Resource References: Relative path references in HTML (e.g., <link href="style.css">, <script src="app.js">) all work normally

4. Protocol Limitation: Folder mapping mode uses http:// protocol; if https:// protocol is needed, manually call SetVirtualHostNameToFolderMapping

Use Cases

1. Desktop application embedded help documentation
2. Offline web applications (no remote server needed)
3. Data visualization dashboards
4. Rich UI interfaces implemented with HTML/CSS/JS

Extension Suggestions

1. Use SetVirtualHostNameToFolderMapping to specify custom domain and https protocol
2. Local HTML can communicate with VB6 via window.chrome.webview.postMessage
3. Combine with BindUI/BindData for two-way interaction between local HTML UI and VB6 data