webview

webview

轻量级跨平台webview库 实现HTML5界面与原生代码交互

webview是一个轻量级跨平台库,为C/C++开发者提供HTML5界面构建能力。该库支持Linux、macOS和Windows等主流平台,实现了HTML5 UI与原生代码的双向交互。webview基于各平台的底层web渲染技术,如WebKitGTK、WebKit和WebView2等,使开发者能够方便地创建基于Web技术的桌面应用。其轻量、跨平台和双向绑定等特性,为构建现代GUI提供了简洁有效的解决方案。

webview跨平台GUI开发HTML5JavaScript绑定Github开源项目

webview

<a href="https://discord.gg/24KMecn" title="Join the chat at Discord"><img src="https://assets-global.website-files.com/6257adef93867e50d84d30e2/636e0b5061df29d55a92d945_full_logo_blurple_RGB.svg" alt="Discord" height="20" /></a> Build Status

A tiny cross-platform webview library for C/C++ to build modern cross-platform GUIs.

The goal of the project is to create a common HTML5 UI abstraction layer for the most widely used platforms.

It supports two-way JavaScript bindings (to call JavaScript from C/C++ and to call C/C++ from JavaScript).

[!NOTE] Language binding for Go [has moved][webview_go]. Versions <= 0.1.1 are available in this repository.

Platform Support

PlatformTechnologies
Linux[GTK 3][gtk], [WebKitGTK][webkitgtk]
macOSCocoa, [WebKit][webkit]
Windows[Windows API][win32-api], [WebView2][ms-webview2]

Documentation

The most up-to-date documentation is right in the source code. Improving the documentation is a continuous effort and you are more than welcome to contribute.

Prerequisites

Your compiler must support minimum C++11 except for platforms that require a more modern version.

Linux and BSD

The [GTK][gtk] and [WebKitGTK][webkitgtk] libraries are required for development and distribution. You need to check your package repositories regarding which packages to install.

Packages

  • Debian:
    • WebKitGTK 6.0, GTK 4:
      • Development: apt install libgtk-4-dev libwebkitgtk-6.0-dev
      • Production: apt install libgtk-4-1 libwebkitgtk-6.0-4
    • WebKitGTK 4.1, GTK 3, libsoup 3:
      • Development: apt install libgtk-3-dev libwebkit2gtk-4.1-dev
      • Production: apt install libgtk-3-0 libwebkit2gtk-4.1-0
    • WebKitGTK 4.0, GTK 3, libsoup 2:
      • Development: apt install libgtk-3-dev libwebkit2gtk-4.0-dev
      • Production: apt install libgtk-3-0 libwebkit2gtk-4.0-37
  • Fedora:
    • WebKitGTK 6.0, GTK 4:
      • Development: dnf install gtk3-devel webkitgtk6.0-devel
      • Production: dnf install gtk3 webkitgtk6.0
    • WebKitGTK 4.1, GTK 3, libsoup 3:
      • Development: dnf install gtk3-devel webkit2gtk4.1-devel
      • Production: dnf install gtk3 webkit2gtk4.1
    • WebKitGTK 4.0, GTK 3, libsoup 2:
      • Development: dnf install gtk3-devel webkit2gtk4.0-devel
      • Production: dnf install gtk3 webkit2gtk4.0
  • FreeBSD:
    • GTK 4: pkg install webkit2-gtk4
    • GTK 3: pkg install webkit2-gtk3

BSD

  • Execution on BSD-based systems may require adding the wxallowed option (see mount(8)) to your fstab to bypass W^X memory protection for your executable. Please see if it works without disabling this security feature first.

Windows

Your compiler must support C++14 and we recommend to pair it with an up-to-date Windows 10 SDK.

For Visual C++ we recommend Visual Studio 2022 or later. We have a separate section for MinGW-w64.

Developers and end-users must have the [WebView2 runtime][ms-webview2-rt] installed on their system for any version of Windows before Windows 11.

Getting Started

If you are a developer of this project then please go to the development section.

Instructions here are written for GCC when compiling C/C++ code using Unix-style command lines, and assumes that multiple commands are executed in the same shell session. Command lines for Windows use syntax specific to the Command shell but you can use any shell such as PowerShell as long as you adapt the commands accordingly. See the MinGW-w64 requirements when building on Windows.

You will have a working app but you are encouraged to explore the [available examples][examples] and try the ones that go beyond the mere basics.

Start with creating a new directory structure for your project:

mkdir my-project && cd my-project mkdir build libs "libs/webview"

Windows Preparation

The [WebView2 SDK][ms-webview2-sdk] is required when compiling programs:

mkdir libs\webview2 curl -sSL "https://www.nuget.org/api/v2/package/Microsoft.Web.WebView2" | tar -xf - -C libs\webview2

If you wish to use the official WebView2 loader (WebView2Loader.dll) then grab a copy of the DLL (replace x64 with your target architecture):

copy /Y libs\webview2\build\native\x64\WebView2Loader.dll build

Note: See the WebView2 loader section for more options.

C/C++ Preparation

Fetch the webview library:

curl -sSLo "libs/webview/webview.h" "https://raw.githubusercontent.com/webview/webview/master/webview.h" curl -sSLo "libs/webview/webview.cc" "https://raw.githubusercontent.com/webview/webview/master/webview.cc"

Getting Started with C++

Save the basic C++ example into your project directory:

curl -sSLo basic.cc "https://raw.githubusercontent.com/webview/webview/master/examples/basic.cc"

Build and run the example:

# Linux g++ basic.cc -std=c++11 -Ilibs/webview $(pkg-config --cflags --libs gtk+-3.0 webkit2gtk-4.1) -o build/basic && ./build/basic # macOS g++ basic.cc -std=c++11 -Ilibs/webview -framework WebKit -o build/basic && ./build/basic # Windows/MinGW g++ basic.cc -std=c++14 -mwindows -Ilibs/webview -Ilibs/webview2/build/native/include -ladvapi32 -lole32 -lshell32 -lshlwapi -luser32 -lversion -o build/basic.exe && "build/basic.exe"

Bonus for Visual C++

Build a C++ example:

cl basic.cc /std:c++14 /EHsc /Fobuild\ ^ /I libs\webview ^ /I libs\webview2\build\native\include ^ /link /OUT:build\basic.exe

Getting Started with C

Save the basic C example into your project directory:

curl -sSLo basic.c "https://raw.githubusercontent.com/webview/webview/master/examples/basic.c"

Build the library and example, then run it:

# Linux g++ -c libs/webview/webview.cc -std=c++11 -DWEBVIEW_STATIC $(pkg-config --cflags gtk+-3.0 webkit2gtk-4.1) -o build/webview.o gcc -c basic.c -std=c99 -Ilibs/webview -o build/basic.o g++ build/basic.o build/webview.o $(pkg-config --libs gtk+-3.0 webkit2gtk-4.1) -o build/basic && build/basic # macOS g++ -c libs/webview/webview.cc -std=c++11 -DWEBVIEW_STATIC -o build/webview.o gcc -c basic.c -std=c99 -Ilibs/webview -o build/basic.o g++ build/basic.o build/webview.o -framework WebKit -o build/basic && build/basic # Windows/MinGW g++ -c libs/webview/webview.cc -std=c++14 -DWEBVIEW_STATIC -Ilibs/webview2/build/native/include -o build/webview.o gcc -c basic.c -std=c99 -Ilibs/webview -o build/basic.o g++ build/basic.o build/webview.o -mwindows -ladvapi32 -lole32 -lshell32 -lshlwapi -luser32 -lversion -o build/basic.exe && "build/basic.exe"

Bonus for Visual C++

Build a shared library:

cl libs\webview\webview.cc /std:c++14 /EHsc /Fobuild\ ^ /D WEBVIEW_BUILD_SHARED ^ /I libs\webview ^ /I libs\webview2\build\native\include ^ /link /DLL /OUT:build\webview.dll

Build a C example using the shared library:

cl basic.c build\webview.lib /EHsc /Fobuild\ ^ /D WEBVIEW_SHARED ^ /I libs\webview ^ /link /OUT:build\basic.exe

More Examples

The examples shown here are mere pieces of a bigger picture so we encourage you to try [other examples][examples] and explore on your own—you can follow the same procedure. Please [get in touch][issues-new] if you find any issues.

Compile-time Options

C API Linkage

NameDescription
WEBVIEW_APIControls C API linkage, symbol visibility and whether it's a shared library. By default this is inline for C++ and extern for C.
WEBVIEW_BUILD_SHAREDModifies WEBVIEW_API for building a shared library.
WEBVIEW_SHAREDModifies WEBVIEW_API for using a shared library.
WEBVIEW_STATICModifies WEBVIEW_API for building or using a static library.

Backend Selection

NameDescription
WEBVIEW_GTKCompile with GTK/WebKitGTK.
WEBVIEW_COCOACompile with Cocoa/WebKit.
WEBVIEW_EDGECompile with Win32/WebView2.

App Distribution

Distribution of your app is outside the scope of this library but we can give some pointers for you to explore.

macOS Application Bundle

On macOS you would typically create a bundle for your app with an icon and proper metadata.

A minimalistic bundle typically has the following directory structure:

example.app                 bundle
└── Contents
    ├── Info.plist          information property list
    ├── MacOS
    |   └── example         executable
    └── Resources
        └── example.icns    icon

Read more about the [structure of bundles][macos-app-bundle] at the Apple Developer site.

Tip: The png2icns tool can create icns files from PNG files. See the icnsutils package for Debian-based systems.

Windows Apps

You would typically create a resource script file (*.rc) with information about the app as well as an icon. Since you should have MinGW-w64 readily available then you can compile the file using windres and link it into your program. If you instead use Visual C++ then look into the [Windows Resource Compiler][win32-rc].

The directory structure could look like this:

my-project/
├── icons/
|   ├── application.ico
|   └── window.ico
├── basic.cc
└── resources.rc

resources.rc:

100 ICON "icons\\application.ico"
32512 ICON "icons\\window.ico"

Note: The ID of the icon resource to be used for the window must be 32512 (IDI_APPLICATION).

Compile:

windres -o build/resources.o resources.rc g++ basic.cc build/resources.o [...]

Remember to bundle the DLLs you have not linked statically, e.g. those from MinGW-w64 and optionally WebView2Loader.dll.

MinGW-w64 Requirements

In order to build this library using MinGW-w64 on Windows then it must support C++14 and have an up-to-date Windows SDK.

Distributions that are known to be compatible:

MS WebView2 Loader

Linking the WebView2 loader part of the Microsoft WebView2 SDK is not a hard requirement when using our webview library, and neither is distributing WebView2Loader.dll with your app.

If, however, WebView2Loader.dll is loadable at runtime, e.g. from the executable's directory, then it will be used; otherwise our minimalistic implementation will be used instead.

Should you wish to use the official loader then remember to distribute it along with your app unless you link it statically. Linking it statically is possible with Visual C++ but not MinGW-w64.

Here are some of the noteworthy ways our implementation of the loader differs from the official implementation:

  • Does not support configuring WebView2 using environment variables such as WEBVIEW2_BROWSER_EXECUTABLE_FOLDER.
  • Microsoft Edge Insider (preview) channels are not supported.

The following compile-time options can be used to change how the library integrates the WebView2 loader:

  • WEBVIEW_MSWEBVIEW2_BUILTIN_IMPL=<1|0> - Enables or disables the built-in implementation of the WebView2 loader. Enabling this avoids the need for WebView2Loader.dll but if the DLL is present then the DLL takes priority. This option is enabled by default.
  • WEBVIEW_MSWEBVIEW2_EXPLICIT_LINK=<1|0> - Enables or disables explicit linking of WebView2Loader.dll. Enabling this avoids the need for import libraries (*.lib). This option is enabled by default if WEBVIEW_MSWEBVIEW2_BUILTIN_IMPL is enabled.

Development

To build the library, examples and run tests, use one of the builds scripts in the script directory:

  • build.sh:

    • On Unix-based systems.
    • On Windows in a Unix-like environment such as MSYS2.
  • build.bat:

    • On Windows when building with Visual C++.

You can specify individual tasks on the command line for these scripts:

TaskDescription
infoDisplays information.
cleanCleans the build directory.
formatReformats code.
depsFetches dependencies.
checkRuns checks.
buildBuilds the library, examples and tests.
testRuns tests.

Additionally, the scripts accept the following environment variables.

Both scripts:

VariableDescription
CIChanges behavior in CI environments (more strict).
TARGET_ARCHTarget architecture for cross-compilation (x64, x86).
BUILD_DIROverrides the path of the build directory.

Only build.sh:

VariableDescription
HOST_OSHost operating system (linux, macos, windows).
TARGET_OSTarget operating system for cross-compilation (see HOST_OS).
CCC compiler executable.
CXXC++ compiler executable.
LIB_PREFIXLibrary name prefix.
PKGCONFIGAlternative pkgconfig executable.
WEBKITGTK_APIWebKitGTK API to interface with, e.g. 0x400 for 4.0, 0x401 for 4.1 or 0x600 for 6.0. This will also automatically decide the GTK version. Uses the latest known and available API by default.

Cross-compilation

See the CI configuration for examples.

Limitations

Browser Features

Since a browser engine is not a full web browser it may not support every feature you may expect from a browser. If you find that a feature does not work as expected then please consult with the browser engine's documentation and [open an issue][issues-new] if you think that the library should support it.

For example, the library does not attempt to support user interaction features like alert(), confirm() and prompt() and other non-essential features like console.log().

Bindings

LanguageProject
Adathechampagne/webview-ada
Buntr1ckydev/webview-bun
C#webview/webview_csharp
C3thechampagne/webview-c3
Crystalnaqvis/webview
Dthechampagne/webview-d
Denowebview/webview_deno
Go[webview/webview_go][webview_go]
HarbourEricLendvai/Harbour_WebView
Haskelllettier/webviewhs
Janetjanet-lang/webview
Javawebview/webview_java
KotlinWinterreisender/webviewko
Nimoskca/webview,

编辑推荐精选

扣子-AI办公

扣子-AI办公

职场AI,就用扣子

AI办公助手,复杂任务高效处理。办公效率低?扣子空间AI助手支持播客生成、PPT制作、网页开发及报告写作,覆盖科研、商业、舆情等领域的专家Agent 7x24小时响应,生活工作无缝切换,提升50%效率!

堆友

堆友

多风格AI绘画神器

堆友平台由阿里巴巴设计团队创建,作为一款AI驱动的设计工具,专为设计师提供一站式增长服务。功能覆盖海量3D素材、AI绘画、实时渲染以及专业抠图,显著提升设计品质和效率。平台不仅提供工具,还是一个促进创意交流和个人发展的空间,界面友好,适合所有级别的设计师和创意工作者。

图像生成AI工具AI反应堆AI工具箱AI绘画GOAI艺术字堆友相机AI图像热门
码上飞

码上飞

零代码AI应用开发平台

零代码AI应用开发平台,用户只需一句话简单描述需求,AI能自动生成小程序、APP或H5网页应用,无需编写代码。

Vora

Vora

免费创建高清无水印Sora视频

Vora是一个免费创建高清无水印Sora视频的AI工具

Refly.AI

Refly.AI

最适合小白的AI自动化工作流平台

无需编码,轻松生成可复用、可变现的AI自动化工作流

酷表ChatExcel

酷表ChatExcel

大模型驱动的Excel数据处理工具

基于大模型交互的表格处理系统,允许用户通过对话方式完成数据整理和可视化分析。系统采用机器学习算法解析用户指令,自动执行排序、公式计算和数据透视等操作,支持多种文件格式导入导出。数据处理响应速度保持在0.8秒以内,支持超过100万行数据的即时分析。

AI工具酷表ChatExcelAI智能客服AI营销产品使用教程
TRAE编程

TRAE编程

AI辅助编程,代码自动修复

Trae是一种自适应的集成开发环境(IDE),通过自动化和多元协作改变开发流程。利用Trae,团队能够更快速、精确地编写和部署代码,从而提高编程效率和项目交付速度。Trae具备上下文感知和代码自动完成功能,是提升开发效率的理想工具。

AI工具TraeAI IDE协作生产力转型热门
AIWritePaper论文写作

AIWritePaper论文写作

AI论文写作指导平台

AIWritePaper论文写作是一站式AI论文写作辅助工具,简化了选题、文献检索至论文撰写的整个过程。通过简单设定,平台可快速生成高质量论文大纲和全文,配合图表、参考文献等一应俱全,同时提供开题报告和答辩PPT等增值服务,保障数据安全,有效提升写作效率和论文质量。

AI辅助写作AI工具AI论文工具论文写作智能生成大纲数据安全AI助手热门
博思AIPPT

博思AIPPT

AI一键生成PPT,就用博思AIPPT!

博思AIPPT,新一代的AI生成PPT平台,支持智能生成PPT、AI美化PPT、文本&链接生成PPT、导入Word/PDF/Markdown文档生成PPT等,内置海量精美PPT模板,涵盖商务、教育、科技等不同风格,同时针对每个页面提供多种版式,一键自适应切换,完美适配各种办公场景。

AI办公办公工具AI工具博思AIPPTAI生成PPT智能排版海量精品模板AI创作热门
潮际好麦

潮际好麦

AI赋能电商视觉革命,一站式智能商拍平台

潮际好麦深耕服装行业,是国内AI试衣效果最好的软件。使用先进AIGC能力为电商卖家批量提供优质的、低成本的商拍图。合作品牌有Shein、Lazada、安踏、百丽等65个国内外头部品牌,以及国内10万+淘宝、天猫、京东等主流平台的品牌商家,为卖家节省将近85%的出图成本,提升约3倍出图效率,让品牌能够快速上架。

下拉加载更多