webview2加载本地页面

news2024/9/24 10:03:34

加载方式

通过导航到文件 URL 加载本地内容

使用方式：
webView->Navigate( L"file:///C:/Users/username/Documents/GitHub/Demos/demo-to-do/index.html");
但是这种方式存在一些问题，比如：

存在跨域问题（我加载的vue写得本地页面）

参考以下链接解决问题：

WebView2 浏览器标志
全局总结

解决方法：

设置环境变量
![外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传](https://img-home.csdnimg.cn/images/20230724024159.png?origin_url=image.png&pos_id=img-Oiwwzsqe-1727069632557
在创建WebView2控件之前，在代码中添加进程环境变量:
SetEnvironmentVariable(L"WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS", L"--allow-file-access-from-files --disable-web-security");
创建WebView2时指定EnvironmentOptions,例如：

#include <WebView2EnvironmentOptions.h>
...
std::wstring args;
args.append(L"--allow-file-access-from-files --disable-web-security");
auto options = Microsoft::WRL::Make<CoreWebView2EnvironmentOptions>();
options->put_AdditionalBrowserArguments(args.c_str());
CreateCoreWebView2EnvironmentWithOptions(nullptr, nullptr, options.Get(),
	Callback<ICoreWebView2CreateCoreWebView2EnvironmentCompletedHandler>(
		//回调函数
        ...
    )
)

以上方式实测有效。

导航到 HTML 字符串的示例

个人测试加载html字符串，对于html中引入了css和js，加载不太友好。

使用虚拟主机名映射加载本地内容

推荐使用这种方式，加载速度比WebResourceRequested快（实测的确是快点），但是需要支持：ICoreWebView2_3

wil::com_ptr<ICoreWebView2_3> webView;
webView = webview.try_query<ICoreWebView2_3>();
if (!webView.get())
{
				
}
else
{
webView->SetVirtualHostNameToFolderMapping(L"demo", L"C:\\Github\\Demos\\demo-to-do", 
                                  COREWEBVIEW2_HOST_RESOURCE_ACCESS_KIND_DENY_CORS);
webView->Navigate(L"https://demo/index.html");
}